@tamagui/react-native-web-internals 2.0.0-rc.8 → 2.0.0

package/dist/cjs/modules/useEvent/__tests__/index-test.cjs

@@ -2,13 +2,15 @@ var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf,
-  __hasOwnProp = Object.prototype.hasOwnProperty;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, {
-    get: () => from[key],
-    enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-  });
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
@@ -18,14 +20,14 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 // "default" to the CommonJS "module.exports" for node compatibility.
 isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
   value: mod,
-  enumerable: !0
+  enumerable: true
 }) : target, mod));
-var import_dom_event_testing_library = require("dom-event-testing-library"),
-  React = __toESM(require("react"), 1),
-  ReactDOM = __toESM(require("react-dom"), 1),
-  import_test_utils = require("react-dom/test-utils"),
-  import__ = __toESM(require("../index.cjs"), 1),
-  import_jsx_runtime = require("react/jsx-runtime");
+var import_dom_event_testing_library = require("dom-event-testing-library");
+var React = __toESM(require("react"), 1);
+var ReactDOM = __toESM(require("react-dom"), 1);
+var import_test_utils = require("react-dom/test-utils");
+var import__ = __toESM(require("../index.cjs"), 1);
+var import_jsx_runtime = require("react/jsx-runtime");
 function createRoot(rootNode) {
   return {
     render(element) {
@@ -34,20 +36,29 @@ function createRoot(rootNode) {
   };
 }
 describe("use-event", () => {
-  let root, rootNode;
+  let root;
+  let rootNode;
   beforeEach(() => {
-    rootNode = document.createElement("div"), document.body.appendChild(rootNode), root = createRoot(rootNode);
-  }), afterEach(() => {
-    root.render(null), document.body.removeChild(rootNode), rootNode = null, root = null;
-  }), describe("setListener()", () => {
+    rootNode = document.createElement("div");
+    document.body.appendChild(rootNode);
+    root = createRoot(rootNode);
+  });
+  afterEach(() => {
+    root.render(null);
+    document.body.removeChild(rootNode);
+    rootNode = null;
+    root = null;
+  });
+  describe("setListener()", () => {
     test("event dispatched on target", () => {
-      const listener = jest.fn(),
-        targetRef = React.createRef();
+      const listener = jest.fn();
+      const targetRef = React.createRef();
       function Component() {
         const addClickListener = (0, import__.default)("click");
-        return React.useEffect(() => {
+        React.useEffect(() => {
           addClickListener(targetRef.current, listener);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           ref: targetRef
         });
       }
@@ -57,20 +68,24 @@ describe("use-event", () => {
       const target = (0, import_dom_event_testing_library.createEventTarget)(targetRef.current);
       (0, import_test_utils.act)(() => {
         target.click();
-      }), expect(listener).toBeCalledTimes(1);
-    }), test("event dispatched on parent", () => {
-      const listener = jest.fn(),
-        listenerCapture = jest.fn(),
-        targetRef = React.createRef(),
-        parentRef = React.createRef();
+      });
+      expect(listener).toBeCalledTimes(1);
+    });
+    test("event dispatched on parent", () => {
+      const listener = jest.fn();
+      const listenerCapture = jest.fn();
+      const targetRef = React.createRef();
+      const parentRef = React.createRef();
       function Component() {
-        const addClickListener = (0, import__.default)("click"),
-          addClickCaptureListener = (0, import__.default)("click", {
-            capture: !0
-          });
-        return React.useEffect(() => {
-          addClickListener(targetRef.current, listener), addClickCaptureListener(targetRef.current, listenerCapture);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        const addClickListener = (0, import__.default)("click");
+        const addClickCaptureListener = (0, import__.default)("click", {
+          capture: true
+        });
+        React.useEffect(() => {
+          addClickListener(targetRef.current, listener);
+          addClickCaptureListener(targetRef.current, listenerCapture);
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           ref: parentRef,
           children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
             ref: targetRef
@@ -83,25 +98,30 @@ describe("use-event", () => {
       const parent = (0, import_dom_event_testing_library.createEventTarget)(parentRef.current);
       (0, import_test_utils.act)(() => {
         parent.click();
-      }), expect(listener).toBeCalledTimes(0), expect(listenerCapture).toBeCalledTimes(0);
-    }), test("event dispatched on child", () => {
-      const log = [],
-        listener = jest.fn(() => {
-          log.push("bubble");
-        }),
-        listenerCapture = jest.fn(() => {
-          log.push("capture");
-        }),
-        targetRef = React.createRef(),
-        childRef = React.createRef();
+      });
+      expect(listener).toBeCalledTimes(0);
+      expect(listenerCapture).toBeCalledTimes(0);
+    });
+    test("event dispatched on child", () => {
+      const log = [];
+      const listener = jest.fn(() => {
+        log.push("bubble");
+      });
+      const listenerCapture = jest.fn(() => {
+        log.push("capture");
+      });
+      const targetRef = React.createRef();
+      const childRef = React.createRef();
       function Component() {
-        const addClickListener = (0, import__.default)("click"),
-          addClickCaptureListener = (0, import__.default)("click", {
-            capture: !0
-          });
-        return React.useEffect(() => {
-          addClickListener(targetRef.current, listener), addClickCaptureListener(targetRef.current, listenerCapture);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        const addClickListener = (0, import__.default)("click");
+        const addClickCaptureListener = (0, import__.default)("click", {
+          capture: true
+        });
+        React.useEffect(() => {
+          addClickListener(targetRef.current, listener);
+          addClickCaptureListener(targetRef.current, listenerCapture);
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           ref: targetRef,
           children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
             ref: childRef
@@ -114,16 +134,21 @@ describe("use-event", () => {
       const child = (0, import_dom_event_testing_library.createEventTarget)(childRef.current);
       (0, import_test_utils.act)(() => {
         child.click();
-      }), expect(listenerCapture).toBeCalledTimes(1), expect(listener).toBeCalledTimes(1), expect(log).toEqual(["capture", "bubble"]);
-    }), test("event dispatched on text node", () => {
-      const listener = jest.fn(),
-        targetRef = React.createRef(),
-        childRef = React.createRef();
+      });
+      expect(listenerCapture).toBeCalledTimes(1);
+      expect(listener).toBeCalledTimes(1);
+      expect(log).toEqual(["capture", "bubble"]);
+    });
+    test("event dispatched on text node", () => {
+      const listener = jest.fn();
+      const targetRef = React.createRef();
+      const childRef = React.createRef();
       function Component() {
         const addClickListener = (0, import__.default)("click");
-        return React.useEffect(() => {
+        React.useEffect(() => {
           addClickListener(targetRef.current, listener);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           ref: targetRef,
           children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
             ref: childRef,
@@ -137,17 +162,20 @@ describe("use-event", () => {
       const text = (0, import_dom_event_testing_library.createEventTarget)(childRef.current.firstChild);
       (0, import_test_utils.act)(() => {
         text.click();
-      }), expect(listener).toBeCalledTimes(1);
-    }), test("listener can be attached to document ", () => {
-      const listener = jest.fn(),
-        targetRef = React.createRef();
+      });
+      expect(listener).toBeCalledTimes(1);
+    });
+    test("listener can be attached to document ", () => {
+      const listener = jest.fn();
+      const targetRef = React.createRef();
       function Component({
         target: target2
       }) {
         const addClickListener = (0, import__.default)("click");
-        return React.useEffect(() => {
+        React.useEffect(() => {
           addClickListener(target2, listener);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           ref: targetRef
         });
       }
@@ -159,17 +187,20 @@ describe("use-event", () => {
       const target = (0, import_dom_event_testing_library.createEventTarget)(targetRef.current);
       (0, import_test_utils.act)(() => {
         target.click();
-      }), expect(listener).toBeCalledTimes(1);
-    }), test("listener can be attached to window ", () => {
-      const listener = jest.fn(),
-        targetRef = React.createRef();
+      });
+      expect(listener).toBeCalledTimes(1);
+    });
+    test("listener can be attached to window ", () => {
+      const listener = jest.fn();
+      const targetRef = React.createRef();
       function Component({
         target: target2
       }) {
         const addClickListener = (0, import__.default)("click");
-        return React.useEffect(() => {
+        React.useEffect(() => {
           addClickListener(target2, listener);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           ref: targetRef
         });
       }
@@ -181,18 +212,21 @@ describe("use-event", () => {
       const target = (0, import_dom_event_testing_library.createEventTarget)(targetRef.current);
       (0, import_test_utils.act)(() => {
         target.click();
-      }), expect(listener).toBeCalledTimes(1);
-    }), test("listener is replaceable", () => {
-      const listener = jest.fn(),
-        listenerAlt = jest.fn(),
-        targetRef = React.createRef();
+      });
+      expect(listener).toBeCalledTimes(1);
+    });
+    test("listener is replaceable", () => {
+      const listener = jest.fn();
+      const listenerAlt = jest.fn();
+      const targetRef = React.createRef();
       function Component({
         onClick
       }) {
         const addClickListener = (0, import__.default)("click");
-        return React.useEffect(() => {
+        React.useEffect(() => {
           addClickListener(targetRef.current, onClick);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           ref: targetRef
         });
       }
@@ -204,79 +238,100 @@ describe("use-event", () => {
       const target = (0, import_dom_event_testing_library.createEventTarget)(targetRef.current);
       (0, import_test_utils.act)(() => {
         target.click();
-      }), expect(listener).toBeCalledTimes(1), (0, import_test_utils.act)(() => {
+      });
+      expect(listener).toBeCalledTimes(1);
+      (0, import_test_utils.act)(() => {
         root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {
           onClick: listenerAlt
         }));
-      }), (0, import_test_utils.act)(() => {
+      });
+      (0, import_test_utils.act)(() => {
         target.click();
-      }), expect(listener).toBeCalledTimes(1), expect(listenerAlt).toBeCalledTimes(1);
-    }), test("listener is removed when value is null", () => {
-      const listener = jest.fn(),
-        targetRef = React.createRef();
+      });
+      expect(listener).toBeCalledTimes(1);
+      expect(listenerAlt).toBeCalledTimes(1);
+    });
+    test("listener is removed when value is null", () => {
+      const listener = jest.fn();
+      const targetRef = React.createRef();
       function Component({
         off
       }) {
         const addClickListener = (0, import__.default)("click");
-        return React.useEffect(() => {
+        React.useEffect(() => {
           addClickListener(targetRef.current, off ? null : listener);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           ref: targetRef
         });
       }
       (0, import_test_utils.act)(() => {
         root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {
-          off: !1
+          off: false
         }));
       });
       const target = (0, import_dom_event_testing_library.createEventTarget)(targetRef.current);
       (0, import_test_utils.act)(() => {
         target.click();
-      }), expect(listener).toBeCalledTimes(1), (0, import_test_utils.act)(() => {
+      });
+      expect(listener).toBeCalledTimes(1);
+      (0, import_test_utils.act)(() => {
         root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {
-          off: !0
+          off: true
         }));
-      }), listener.mockClear(), (0, import_test_utils.act)(() => {
+      });
+      listener.mockClear();
+      (0, import_test_utils.act)(() => {
         target.click();
-      }), expect(listener).toBeCalledTimes(0);
-    }), test("custom event dispatched on target", () => {
-      const listener = jest.fn(),
-        targetRef = React.createRef();
+      });
+      expect(listener).toBeCalledTimes(0);
+    });
+    test("custom event dispatched on target", () => {
+      const listener = jest.fn();
+      const targetRef = React.createRef();
       function Component() {
         const addMagicEventListener = (0, import__.default)("magic-event");
-        return React.useEffect(() => {
+        React.useEffect(() => {
           addMagicEventListener(targetRef.current, listener);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           ref: targetRef
         });
       }
       (0, import_test_utils.act)(() => {
         root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {}));
-      }), (0, import_test_utils.act)(() => {
+      });
+      (0, import_test_utils.act)(() => {
         const event = new CustomEvent("magic-event", {
-          bubbles: !0
+          bubbles: true
         });
         targetRef.current.dispatchEvent(event);
-      }), expect(listener).toBeCalledTimes(1);
-    }), test("listeners can be set on multiple targets simultaneously", () => {
-      const log = [],
-        targetRef = React.createRef(),
-        parentRef = React.createRef(),
-        childRef = React.createRef(),
-        listener = jest.fn(e => {
-          log.push(["bubble", e.currentTarget.id]);
-        }),
-        listenerCapture = jest.fn(e => {
-          log.push(["capture", e.currentTarget.id]);
-        });
+      });
+      expect(listener).toBeCalledTimes(1);
+    });
+    test("listeners can be set on multiple targets simultaneously", () => {
+      const log = [];
+      const targetRef = React.createRef();
+      const parentRef = React.createRef();
+      const childRef = React.createRef();
+      const listener = jest.fn(e => {
+        log.push(["bubble", e.currentTarget.id]);
+      });
+      const listenerCapture = jest.fn(e => {
+        log.push(["capture", e.currentTarget.id]);
+      });
       function Component() {
-        const addClickListener = (0, import__.default)("click"),
-          addClickCaptureListener = (0, import__.default)("click", {
-            capture: !0
-          });
-        return React.useEffect(() => {
-          addClickListener(targetRef.current, listener), addClickListener(parentRef.current, listener), addClickCaptureListener(targetRef.current, listenerCapture), addClickCaptureListener(parentRef.current, listenerCapture);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        const addClickListener = (0, import__.default)("click");
+        const addClickCaptureListener = (0, import__.default)("click", {
+          capture: true
+        });
+        React.useEffect(() => {
+          addClickListener(targetRef.current, listener);
+          addClickListener(parentRef.current, listener);
+          addClickCaptureListener(targetRef.current, listenerCapture);
+          addClickCaptureListener(parentRef.current, listenerCapture);
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           id: "parent",
           ref: parentRef,
           children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
@@ -294,35 +349,43 @@ describe("use-event", () => {
       const child = (0, import_dom_event_testing_library.createEventTarget)(childRef.current);
       (0, import_test_utils.act)(() => {
         child.click();
-      }), expect(listenerCapture).toBeCalledTimes(2), expect(listener).toBeCalledTimes(2), expect(log).toEqual([["capture", "parent"], ["capture", "target"], ["bubble", "target"], ["bubble", "parent"]]);
-    }), test("listeners are specific to each event handle", () => {
-      const log = [],
-        targetRef = React.createRef(),
-        childRef = React.createRef(),
-        listener = jest.fn(e => {
-          log.push(["bubble", "target"]);
-        }),
-        listenerAlt = jest.fn(e => {
-          log.push(["bubble", "target-alt"]);
-        }),
-        listenerCapture = jest.fn(e => {
-          log.push(["capture", "target"]);
-        }),
-        listenerCaptureAlt = jest.fn(e => {
-          log.push(["capture", "target-alt"]);
-        });
+      });
+      expect(listenerCapture).toBeCalledTimes(2);
+      expect(listener).toBeCalledTimes(2);
+      expect(log).toEqual([["capture", "parent"], ["capture", "target"], ["bubble", "target"], ["bubble", "parent"]]);
+    });
+    test("listeners are specific to each event handle", () => {
+      const log = [];
+      const targetRef = React.createRef();
+      const childRef = React.createRef();
+      const listener = jest.fn(e => {
+        log.push(["bubble", "target"]);
+      });
+      const listenerAlt = jest.fn(e => {
+        log.push(["bubble", "target-alt"]);
+      });
+      const listenerCapture = jest.fn(e => {
+        log.push(["capture", "target"]);
+      });
+      const listenerCaptureAlt = jest.fn(e => {
+        log.push(["capture", "target-alt"]);
+      });
       function Component() {
-        const addClickListener = (0, import__.default)("click"),
-          addClickAltListener = (0, import__.default)("click"),
-          addClickCaptureListener = (0, import__.default)("click", {
-            capture: !0
-          }),
-          addClickCaptureAltListener = (0, import__.default)("click", {
-            capture: !0
-          });
-        return React.useEffect(() => {
-          addClickListener(targetRef.current, listener), addClickAltListener(targetRef.current, listenerAlt), addClickCaptureListener(targetRef.current, listenerCapture), addClickCaptureAltListener(targetRef.current, listenerCaptureAlt);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        const addClickListener = (0, import__.default)("click");
+        const addClickAltListener = (0, import__.default)("click");
+        const addClickCaptureListener = (0, import__.default)("click", {
+          capture: true
+        });
+        const addClickCaptureAltListener = (0, import__.default)("click", {
+          capture: true
+        });
+        React.useEffect(() => {
+          addClickListener(targetRef.current, listener);
+          addClickAltListener(targetRef.current, listenerAlt);
+          addClickCaptureListener(targetRef.current, listenerCapture);
+          addClickCaptureAltListener(targetRef.current, listenerCaptureAlt);
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           id: "target",
           ref: targetRef,
           children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
@@ -336,38 +399,50 @@ describe("use-event", () => {
       const child = (0, import_dom_event_testing_library.createEventTarget)(childRef.current);
       (0, import_test_utils.act)(() => {
         child.click();
-      }), expect(listenerCapture).toBeCalledTimes(1), expect(listenerCaptureAlt).toBeCalledTimes(1), expect(listener).toBeCalledTimes(1), expect(listenerAlt).toBeCalledTimes(1), expect(log).toEqual([["capture", "target"], ["capture", "target-alt"], ["bubble", "target"], ["bubble", "target-alt"]]);
+      });
+      expect(listenerCapture).toBeCalledTimes(1);
+      expect(listenerCaptureAlt).toBeCalledTimes(1);
+      expect(listener).toBeCalledTimes(1);
+      expect(listenerAlt).toBeCalledTimes(1);
+      expect(log).toEqual([["capture", "target"], ["capture", "target-alt"], ["bubble", "target"], ["bubble", "target-alt"]]);
     });
-  }), describe("cleanup", () => {
+  });
+  describe("cleanup", () => {
     test("removes all listeners for given event type from targets", () => {
       const clickListener = jest.fn();
       function Component() {
         const addClickListener = (0, import__.default)("click");
-        return React.useEffect(() => {
+        React.useEffect(() => {
           addClickListener(document, clickListener);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {});
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {});
       }
       (0, import_test_utils.act)(() => {
-        root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {})), root.render(null);
+        root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {}));
+        root.render(null);
       });
       const target = (0, import_dom_event_testing_library.createEventTarget)(document);
       (0, import_test_utils.act)(() => {
         target.click();
-      }), expect(clickListener).toBeCalledTimes(0);
+      });
+      expect(clickListener).toBeCalledTimes(0);
     });
-  }), describe("stopPropagation and stopImmediatePropagation", () => {
+  });
+  describe("stopPropagation and stopImmediatePropagation", () => {
     test("stopPropagation works as expected", () => {
       const childListener = jest.fn(e => {
-          e.stopPropagation();
-        }),
-        targetListener = jest.fn(),
-        targetRef = React.createRef(),
-        childRef = React.createRef();
+        e.stopPropagation();
+      });
+      const targetListener = jest.fn();
+      const targetRef = React.createRef();
+      const childRef = React.createRef();
       function Component() {
         const addClickListener = (0, import__.default)("click");
-        return React.useEffect(() => {
-          addClickListener(childRef.current, childListener), addClickListener(targetRef.current, targetListener);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        React.useEffect(() => {
+          addClickListener(childRef.current, childListener);
+          addClickListener(targetRef.current, targetListener);
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           ref: targetRef,
           children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
             ref: childRef
@@ -380,19 +455,24 @@ describe("use-event", () => {
       const child = (0, import_dom_event_testing_library.createEventTarget)(childRef.current);
       (0, import_test_utils.act)(() => {
         child.click();
-      }), expect(childListener).toBeCalledTimes(1), expect(targetListener).toBeCalledTimes(0);
-    }), test("stopImmediatePropagation works as expected", () => {
+      });
+      expect(childListener).toBeCalledTimes(1);
+      expect(targetListener).toBeCalledTimes(0);
+    });
+    test("stopImmediatePropagation works as expected", () => {
       const firstListener = jest.fn(e => {
-          e.stopImmediatePropagation();
-        }),
-        secondListener = jest.fn(),
-        targetRef = React.createRef();
+        e.stopImmediatePropagation();
+      });
+      const secondListener = jest.fn();
+      const targetRef = React.createRef();
       function Component() {
-        const addFirstClickListener = (0, import__.default)("click"),
-          addSecondClickListener = (0, import__.default)("click");
-        return React.useEffect(() => {
-          addFirstClickListener(targetRef.current, firstListener), addSecondClickListener(targetRef.current, secondListener);
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        const addFirstClickListener = (0, import__.default)("click");
+        const addSecondClickListener = (0, import__.default)("click");
+        React.useEffect(() => {
+          addFirstClickListener(targetRef.current, firstListener);
+          addSecondClickListener(targetRef.current, secondListener);
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           ref: targetRef
         });
       }
@@ -402,7 +482,9 @@ describe("use-event", () => {
       const target = (0, import_dom_event_testing_library.createEventTarget)(targetRef.current);
       (0, import_test_utils.act)(() => {
         target.click();
-      }), expect(firstListener).toBeCalledTimes(1), expect(secondListener).toBeCalledTimes(0);
+      });
+      expect(firstListener).toBeCalledTimes(1);
+      expect(secondListener).toBeCalledTimes(0);
     });
   });
 });