-
Notifications
You must be signed in to change notification settings - Fork 20.5k
Open
Description
Description
When trying to listen events on a ShadowRoot element using on, the handler is not fired.
The native addEventListener works
Minimal example:
const el = $("#test")[0];
el.attachShadow({ mode: "open" });
el.shadowRoot.innerHTML = `<div class=".inner">Inner content</div>`;
$(el.shadowRoot).on("click", ".inner", () => {
console.log("jquery - shadow inner clicked");
});The issue is that the element data returned by dataPriv is always empty because of this check
ShadowRoot elements have nodeType === 11
The issue pointed as reason for the check seems not valid for ShadowRoot elements which are supported only on modern browsers
So, changing the check for
return owner.nodeType === 1 || owner.nodeType === 9 || owner.nodeType === 11 || !( +owner.nodeType );should work
Link to test case
extempl