v149 · Clipboard · Async Clipboard API

Format Priority Chain

Many apps want the richest clipboard format they can get — HTML over plain text, custom MIME types over generic ones. With lazy reads, you check type availability for free, then fetch only the first format that exists. No wasted OS clipboard reads.

Copy some content to your clipboard (rich text from a web page works best), then click "Read with priority chain" to watch the demo find the best available format without reading the others.

Priority order: text/html → text/plain → image/png → application/json. Only the first matching format triggers a real OS read.

format priority chain OS reads saved: —

1 text/html idle —

2 text/plain idle —

3 image/png idle —

4 application/json idle —

result

Nothing read yet.

the pattern in code

const PRIORITY = ['text/html', 'text/plain', 'image/png', 'application/json'];

const [item] = await navigator.clipboard.read();
// item.types is FREE — no OS clipboard access yet

let chosen = null;
for (const mime of PRIORITY) {
  if (item.types.includes(mime)) {
    // Only ONE getType() call — only the winner is read from OS
    const blob = await item.getType(mime);
    chosen = { mime, blob };
    break;
  }
}
// All other formats were never fetched

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗

the pattern in code

see also

implementation reference