Wednesday, May 20, 2015

Clipboard Hijacking with HTML5


Today I learned from Guillermo Rauch that Google Chrome 43 is now shipping, on both desktop and mobile, with the ability to modify the system clipboard. This is awesome! And as evidenced by the over 200 retweets he gained, developers are excited to be able to finally drop the dependence on Flash for this feature. You can read more about it here on HTML5Rocks.

I wish I could join in with the celebration, but since it was not implemented to actively prevent clipboard hijacking, I'm disappointed instead.

Clipboard hijacking is the intentional modification of the system clipboard with content other than what the user expected. If you've ever copied text from a news article and pasted to a friend only to find an intrusive ad baked in, you've experienced it first hand.

An example from a five year old Daring Fireball post, is shown below:

Over the last few months I’ve noticed an annoying trend on various web sites, generally major newspaper and magazine sites, but also certain weblogs.

Read more: http://daringfireball.net/2010/05/tynt_copy_paste_jerks/#ixzz0oyLiD4Qh

On the flip side, there was another post that happened five years ago, that illustrates developers perceiving clipboard hijacking as a positive trend.

One trend I've seen recently is that when the use copies content from a given post, the copy function (Zero Clipboard, in this example) appends the page title, a link, and a special message telling the recipient to view the post. Here's how to do it.

NO, NO, NO, NO!

This is a larger problem than autoplaying video, sound, and popups. They are annoying, but never destructive. New amazing features are being added to the web platform, such as: webcam & microphone access, location access, etc. that are available to any web site, but require user permission to be used.

Q: So how did Chrome screw this up? A: They do not prompt for clipboard access!


The demo I created below, was done in a few minutes with just a "hidden" textarea trick and a mouseup event that is incredibly common. If the demo below fails to work for you, that's good news (for you)! You won't be affected.

I tested this demo in: Chromium 42, Google Chrome 43, & Mobile Chrome 42. In all cases, the browser would allow me to select and then copied bogus nonsense into my clipboard. Even worse, is that in the desktop version of Chrome, the use of textarea.select() actually deselects the text, making it impossible to do a real operating system level copy command.

For an even more elaborate demo, check out this fork by Patrick Kettner. In his example the text remains selected, meaning the user would have even less of an idea that their clipboard was being affected.

I've voiced my findings in a Mozilla Dev Platform Google Group discussing the intent to implement and ship this feature and hope to sway them into doing the right thing for their users here. I still need to figure out how to let Google Chrome devs know my opinion, hopefully this post will reach them somehow.