Clipboard : EventTarget

Provides access to the system cut/copy/paste clipboard.

Spec:
https://w3c.github.io/clipboard-apis/#clipboard-interface

----
prototype.read() : Promise<Array<ClipboardItem>>

<htmlexample>
<button id='paste'>paste</button>
<script>
  document.getElementById('paste').onclick = async () => {
    const values = await navigator.clipboard.read();
    for (const value of values) {
      for (const type of value.types) {
        const blob = await value.getType(type);
        console.log(`${type}: ${ blob.size } bytes`);
      }
    }
  };
</script>
</htmlexample>

Spec:
https://w3c.github.io/clipboard-apis/#dom-clipboard-read

----
prototype.readText() : Promise<String>

<htmlexample>
<button id='paste'>paste</button>
<script>
  document.getElementById('paste').onclick = async () => {
    const value = await navigator.clipboard.readText();
    console.log(`read '${value}' from clipboard`);
  };
</script>
</htmlexample>

Spec:
https://w3c.github.io/clipboard-apis/#dom-clipboard-readtext

----
prototype.write(items : Iterable<ClipboardItem>) : Promise<undefined>

<htmlexample>
<button id='copy'>copy</button>
<script>
  document.getElementById('copy').onclick = async () => {
    // Create an image of a circle
    const canvas = document.createElement('canvas');
    const context = canvas.getContext('2d');
    context.fillStyle = 'red';
    context.beginPath();
    context.arc(50, 50, 30, 0, 2 * Math.PI);
    context.fill();

    const cbi = new ClipboardItem({
      'image/png': new Promise(r => canvas.toBlob(r))
    });
    await navigator.clipboard.write([cbi]);
    console.log(`copied image to clipboard`);
  };
</script>
</htmlexample>

Spec:
https://w3c.github.io/clipboard-apis/#dom-clipboard-write

----
prototype.writeText(text : String) : Promise<undefined>

<htmlexample>
<input value='value to copy'>
<button id='copy'>copy</button>
<script>
  document.getElementById('copy').onclick = async () => {
    const value = document.querySelector('input').value;
    await navigator.clipboard.writeText(value);
    console.log(`copied '${value}' to clipboard`); 
  };
</script>
</htmlexample>

Spec:
https://w3c.github.io/clipboard-apis/#dom-clipboard-writetext