Steps to reproduce the problem (copied from https://bugs.chromium.org/p/chromium/issues/detail?id=1156117): 1. Go to https://jsfiddle.net/62z9uwq1/ 2. Follow the reproduction steps in the JSFiddle AND.. This bug basically makes the combination of tabIndex + onPaste in popular frameworks such as ReactJS useless, as events are intercepted at the document level and dispatched to the appropriate element based on the event argument's target property. A) Go to https://codesandbox.io/s/react-playground-forked-9juxn?file=/index.js B) Click in "Table cell 1" and press CTRL + V: it works! C) Press TAB to jump to "Table cell 2" and press CTRL + V: Nothing happens, because the global OnPaste event handler configured by ReactJS never receives an OnPaste event with "Table Cell 2" as event target - only <body> is received. It's probably safe to assume that many other frameworks are affected too. What is the expected behavior? OnPaste must fire for elements that gain focus programmatically or via TAB navigation. What went wrong? OnPaste does not fire - only if user clicked on the element first. OnPaste fires properly in Firefox v. 83 and IEEdge 18. Chrome 87 and ChromiumEdge 87 are also affected by this bug. Other browsers such as IE and Opera not tested.
Thanks for filing, I can reproduce this on Safari 13.1.3 and STP 116.
<rdar://problem/72063887>
Same bug applies to OnCopy and OnCut. I have extended the JSFiddle to also register OnCopy and OnCut handlers: https://jsfiddle.net/7puam9yr/1/ A fix should probably be tested against all relevant events.
Programmatically invoking cut/copy/paste does not trigger the events either, nor does it modify the clipboard (unless clicking on the focusable element first). document.execCommand("cut"); document.execCommand("copy"); document.execCommand("paste");
This isn't really about whether an element is clicked but rather if the element has the selection or not. WebKit only fires the event on the selection's endpoints' common ancestor instead of the focused element.