fix: toggle repeated clicks with inner target element (#1002)

* fix: toggle repeated clicks with inner target element * test: fix events
atomiks · Nov 9, 2021 · 34a8cf2 · 34a8cf2
1 parent 475b308
commit 34a8cf2
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 3 deletions.
diff --git a/src/createTippy.ts b/src/createTippy.ts
@@ -313,9 +313,9 @@ export default function createTippy(
 
     // Clicked on the event listeners target
     if (
-      normalizeToArray(instance.props.triggerTarget || reference).indexOf(
-        actualTarget as Element
-      ) !== -1
+      normalizeToArray(instance.props.triggerTarget || reference).some((el) =>
+        actualContains(el, actualTarget as Element)
+      )
     ) {
       if (currentInput.isTouch) {
         return;

diff --git a/test/integration/props.test.js b/test/integration/props.test.js
@@ -1220,6 +1220,24 @@ describe('trigger', () => {
 
       expect(instance.state.isVisible).toBe(false);
     });
+
+    it('toggles on repeated clicks with inner element target', () => {
+      const inner = h();
+      const outer = h();
+      outer.appendChild(inner);
+
+      const instance = tippy(outer, {trigger: 'click'});
+
+      fireEvent.mouseDown(inner, {bubbles: true});
+      fireEvent.click(inner, {bubbles: true});
+
+      expect(instance.state.isVisible).toBe(true);
+
+      fireEvent.mouseDown(inner, {bubbles: true});
+      fireEvent.click(inner, {bubbles: true});
+
+      expect(instance.state.isVisible).toBe(false);
+    });
   });
 
   describe('click focus', () => {