Shadow DOM events improvement

mathigon · Jul 20, 2023 · 3388440 · 3388440
1 parent a1511e6
commit 3388440
Showing 1 changed file with 2 additions and 7 deletions.
diff --git a/src/events.ts b/src/events.ts
@@ -115,13 +115,8 @@ function makeClickOutsideEvent($el: ElementView) {
   $el._data['clickOutsideEvent'] = true;
 
   $body.on('pointerdown', (e: ScreenEvent) => {
-    let target = e.target as Node|null;
-
-    // Elements within shadow roots are opaque, so we check using coordinates.
-    const shadowRoot = $el._el.getRootNode?.() as ShadowRoot|undefined;
-    const posn = pointerPosition(e);
-    if (shadowRoot?.host) target = (shadowRoot as any).elementFromPoint(posn.x, posn.y);
-
+    // The .composedPath method ensures that this still works in shadow DOM.
+    let target = (e.composedPath()[0] || e.target) as Node|null;
     if (!target || $el._el === target || $el._el.contains(target)) return;
     $el.trigger('clickOutside', e);
   });