add navigator clipboard, ClipboardItem

[keithamus]

This implements navigator.clipboard.write and navigator.clipboard.read, which both work with ClipboardItems. It also adds a re-implementation of ClipboardItem which supports Promises, adhering to the spec.

write, per the spec takes an array of ClipboardItems and writes to the clipboard. We're limited in what we can do here, so we extract the text/plain content of the first one and call writeText. This is a pretty reasonable default behaviour.

read, per the spec should return an array of ClipboardItems representing the user's current clipboard. We're limited what we can do here, so we call readText and convert it into a ClipboardItem with just text/plain.

ClipboardItem has a presentationStyle attribute (defaulting to 'unspecified' unless it's passed as an option), and getType() always returns Blobs. In Chrome's buggy implementation, getType('text/plain') will return a String. We've accounted for both possibilities in navigator.clipboard.write just in case the polyfill isn't applied (e.g. Chrome adds promises but keeps their buggy getType() behaviour).

This means await navigator.clipboard.write(await navigator.clipboard.read()) should be a no-op (as long as the user only has plain-text data in their clipboard) which feels like a sensible thing to do.

Customer Support Data

Here are some tables representing the % of browsers we see that support (or don't support) these APIs.

Clipboard Write

Browser	Supported Since	Latest Version	% Supported	% Unsupported
chrome	66	101	73.565	0.007
edge	79	100	6.691	0.001
firefox	Not Supported	100	0.000	12.669
firefox_android	Not Supported	100	0.000	0.128
ie	Not Supported	11	0.000	0.078
opera	63	86	1.267	0.000
safari	13.1	15.4	4.630	0.013
safari_ios	13.4	15.4	0.505	0.006
samsunginternet_android	12.0	16.0	0.020	0.000
webview_android	66	101	0.002	0.008
Total:			86.68	12.91

(Note: "Other" browsers make up 0.408%)

[pablonete]

This is great, thank you @keithamus for putting this together 🎉
I've read through it and I have no concerns, just a couple of questions:

1. Is this going to provide Firefox support too?
2. Will this be added to index.ts, so the apply method brings it to dotcom? I'm just trying to clarify the road ahead: once we merge this and upgrade this lib in dotcom, we'd got https://github.com./github/repos/issues/1073 fixed 🙏

[keithamus]

1. Yeah this should work with Firefox, so you can just use navigator.read/navigator.write and thing should mostly work.
2. Yes, this should "just work" in dotcom. https://github.com./github/repos/issues/1073 can be closed once this is merged and upgraded into dotcom.

[theinterned]

This is super cool, just left my one drive-by question

[pablonete]

Tested today on Firefox and confirmed that this fixes the Copy Remote functionality in the blob page for Firefox, see details on https://github.com./github/repos/issues/1073#issuecomment-1226971804.

[JoseInTheArena]

lgtm 🚀