[Rich Content Editor] Option to paste links properly (without extraneous information)

0 Likes
(3)
Problem statement:

If I copy and paste a link from another canvas page, it brings the link itself as well as the text, which is lovely, but every time it pastes it it includes the text "Links to an external site" as part of the link text. This is potentially useful for students who have never used the internet before, but rarely helpful otherwise, especially when pasting a list of links or a paragraph with multiple links in it. I often copy a list of links (esp course readings with links and text combined) and this requires me to change the text of every single link manually.

Proposed solution:

I believe instructors should have the option to turn this behavior off by default so they can copy/paste without having this extra information added to every single link whenever there is a simple "paste" action. This could be managed in settings.

User role(s):

admin,instructor

5 Comments
KristinL
Community Team
Community Team
Status changed to: Open
 
James
Community Champion

@bernardo 

If you select and copy text from any Canvas page while viewing the page, it includes extra HTML code (often a span) that you do not want to include when pasting. It's not just limited to links.

The current work-around is to edit the item and then select and copy. Then it does not include the extra code or the external link message.

It's an extra headache, but it becomes part of your workflow. Every term when I edit my pages, I open multiple browser tabs and click edit so I can move content from one page to another without the problem you're describing.

As for what Canvas is doing when you copy/paste, it is mostly doing the right thing. When you select and copy, you typically want to copy all of the attributes so that the copied material looks like the page that you copy it from. In Canvas, there is a span added to designate it as an external link and so your copy is getting that extra span.

When you paste, it is pasting what it copied, which includes the external link span.

While Canvas could possibly add code to check to see if the pasted code contains a span with an external link, the problem is more widespread than just external links. Trying to strip code out of what people is pasting is the wrong decision as it breaks the expected behavior. That's what the paste as plaintext option in the browser is for, the expected behavior for a regular paste is to include the underlying HTML.

Unfortunately, that means that you need to make sure that what you want to paste is in the clipboard correctly. For Canvas, that currently means editing the page so that the extra markup they add isn't present before you copy.

The reason editing the page works is because the external link span isn't present in the what the user writes. If you edit the page, you will not see it. It is added after the page is loaded in the browser by running JavaScript on the page when displaying it. Since it's not in the content of the page, selecting and copying it when editing the page doesn't grab that code. If you try to select and copy while just viewing the page, then the markup is there and gets copied.

I don't work for Canvas, but I've used it for 10 years now and I don't see them "fixing" this. They want a clean interface without bunch of bells and whistles and menu options, it's not a huge problem, and there is a relatively simple work-around.

bernardo
Community Participant

Thanks for the detailed explanation. I just tested it and so far yes the edit window does not suffer from this unfortunate behavior. I will do this from now on.

What I don't get is why it does this in the first place. Why is there extra markup at all there? Does anyone actually use that? I get that they want a clean interface but if that's the case why include this at all? Or is it the equivalent of a hashtag or code that is only meant to be read by the software? 

James
Community Champion

@bernardo 

Frequently, those behind the scenes things are for accessibility. For example, applications should let people know that a link will leave the site or own in a new tab/window. There's a lot of markup added for screenreaders, too.

For sighted users, the link shows an external url icon, but that has a screenreader equivalent that is hidden within Canvas, but becomes visible when you copy/paste.

Here's an example of a link inside the editor (HTML view) (I added new lines to make it more readable)

<a class="inline_disabled" href="https://www.lock5stat.com/StatKey/" target="_blank" rel="noopener">
StatKey
</a>

Here's what an external link looks like after the markup:

<a class="inline_disabled external" href="https://www.lock5stat.com/StatKey/" target="_blank" rel="noreferrer noopener">
<span>StatKey</span>
<span aria-hidden="true" class="ui-icon ui-icon-extlink ui-icon-inline" title="Links to an external site."></span>
<span class="screenreader-only">&nbsp;(Links to an external site.)</span>
</a>

And here is what it looks like in the editor after you copy/paste from the view mode.

<a class="inline_disabled external" href="https://www.lock5stat.com/StatKey/" target="_blank" rel="noreferrer noopener">
<span>StatKey</span>
<span class="screenreader-only">&nbsp;(Links to an external site.)</span>
</a>

When you save the page, the Links to an external site does not show up on the page for me because it's inside a screenreader-only class. However, the external icon link is also missing. The difference is the external class, which wasn't there originally, but the presence of it prevents Canvas from adding it (or the external link icon) when displaying a page.

ProductPanda
Instructure
Instructure
Status changed to: Archived
Comments from Instructure

As part of the new Ideas & Themes process, all ideas in Idea Conversations were reviewed by the Product Team. Any Idea that was associated with an identified theme was moved to the new Idea & Themes space. Any Idea that was not part of the move is being marked as Archived. This will preserve the history of the conversations while also letting Community members know that Instructure will not explore the request at this time.