[Webkit-unassigned] [Bug 222262] Javascript Clipboard API write() does not work after await

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=222262

--- Comment #1 from Ryosuke Niwa <rniwa at webkit.org> ---
(In reply to Felipe Ruiz from comment #0)
> I'm using javascript Clipboard API to copy an image to the clipboard. It
> works in Chrome and Edge but not in Safari in spite of official
> documentation of Safari says that it's supported.

The issue is not so much async Clipboard API and the difference in the way user activation is tracked between Blink and WebKit.

> In this example (not my real code), write() throws an error:
> 
> document.getElementById("copy").addEventListener("click", async function() {
>     const response = await
> fetch('https://upload.wikimedia.org/wikipedia/commons/4/47/
> PNG_transparency_demonstration_1.png');
>     const blob = await response.blob();
> 
>     navigator.clipboard.write([new ClipboardItem({ "image/png": blob })])
>       .then(function () { console.log('copied'); })
>       .catch(function (error) { console.log(error); });
> });

You need to initiate the write inside click event handler as in:

document.getElementById("copy-html").addEventListener("click", event => {
    navigator.clipboard.write([
        new ClipboardItem({
            "text/png": async () => {
                const response = await fetch('https://upload.wikimedia.org/wikipedia/commons/4/47/PNG_transparency_demonstration_1.png');
                return await response.blob();
            }
        }),
    ]);
});

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20210222/9ee818af/attachment-0001.htm>