Examples using Web API: Clipboard.write()

It seemed a bit difficult to find just pure text/html examples for the Clipboard API. Turns out it's probably because you also need a text/plain backup version to also be on the clipboard too.

If this isn't the case, and I can just do a single text/html please send an issue or PR.

The new Clipboard API on Chromium is coming along and I spent an afternoon on the text/html nuances.

These examples don't use the newer async version of the API.

Link to the Repo

Examples

After clicking one of the buttons to copy the text to your clipboard, try pasting into both a non-rich and a rich text environment.

Plain text

Takes the innerText value of the div below and copies it to the clipboard.



Plain text hello world

Plain(raw) and HTML text

Creates two clipboard entries, one for text/plain and text/html which it seems the operating system decides which to use based on where the data is pasted.

For the sake of an example, this copies the innerText value of the below div and uses it for both text/plain and text/html clipboard types.



Plain text and HTML hello world

Plain(fallback) and HTML text

Creates two clipboard entries, one for text/plain and text/html where the plain example is the innerText and the html version is the full HTML markup.



Plain text and HTML hello world

HTML only text (fails)

This seems to fail as there is no text/plain backup. Nothing is copied to the clipboard.



Plain text and HTML hello world