@openmrs/esm-react-utils 3.2.1-pre.1082 → 3.2.1-pre.1084

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openmrs/esm-react-utils",
-  "version": "3.2.1-pre.1082",
+  "version": "3.2.1-pre.1084",
   "license": "MPL-2.0",
   "description": "React utilities for OpenMRS.",
   "browser": "dist/openmrs-esm-react-utils.js",
@@ -55,11 +55,11 @@
     "react-i18next": "11.x"
   },
   "devDependencies": {
-    "@openmrs/esm-api": "^3.2.1-pre.1082",
-    "@openmrs/esm-config": "^3.2.1-pre.1082",
-    "@openmrs/esm-error-handling": "^3.2.1-pre.1082",
-    "@openmrs/esm-extensions": "^3.2.1-pre.1082",
-    "@openmrs/esm-globals": "^3.2.1-pre.1082",
+    "@openmrs/esm-api": "^3.2.1-pre.1084",
+    "@openmrs/esm-config": "^3.2.1-pre.1084",
+    "@openmrs/esm-error-handling": "^3.2.1-pre.1084",
+    "@openmrs/esm-extensions": "^3.2.1-pre.1084",
+    "@openmrs/esm-globals": "^3.2.1-pre.1084",
     "dayjs": "^1.10.8",
     "i18next": "^19.6.0",
     "react": "^16.13.1",
@@ -68,5 +68,5 @@
     "rxjs": "^6.5.3",
     "unistore": "^3.5.2"
   },
-  "gitHead": "924dd37b7e38e9ad3647feef17431b61194259d5"
+  "gitHead": "c2a5b8ed52049b3e302df8043f42ac57ec3321b1"
 }

package/src/useOnClickOutside.test.tsx

@@ -0,0 +1,59 @@
+import React from "react";
+import { render, fireEvent } from "@testing-library/react";
+import { useOnClickOutside } from "./useOnClickOutside";
+
+describe("useOnClickOutside", () => {
+  const handler: (e: Event) => void = jest.fn();
+  afterEach(() => (handler as jest.Mock).mockClear());
+
+  it("should call the handler when clicking outside", () => {
+    // setup
+    const Component: React.FC = ({ children }) => {
+      const ref = useOnClickOutside<HTMLDivElement>(handler);
+      return <div ref={ref}>{children}</div>;
+    };
+    const ref = render(<Component />);
+
+    // act
+    fireEvent.click(ref.container);
+
+    // verify
+    expect(handler).toHaveBeenCalledTimes(1);
+  });
+
+  it("should not call the handler when clicking on the element", () => {
+    // setup
+    const Component: React.FC = ({ children }) => {
+      const ref = useOnClickOutside<HTMLDivElement>(handler);
+      return <div ref={ref}>{children}</div>;
+    };
+    const mutableRef: { current: HTMLDivElement } = { current: undefined };
+    render(
+      <Component>
+        <div ref={mutableRef}></div>
+      </Component>
+    );
+
+    // act
+    fireEvent.click(mutableRef.current);
+
+    // verify
+    expect(handler).not.toHaveBeenCalled();
+  });
+
+  it("should unregister the event listener when unmounted", () => {
+    // setup
+    const Component: React.FC = ({ children }) => {
+      const ref = useOnClickOutside<HTMLDivElement>(handler);
+      return <div ref={ref}>{children}</div>;
+    };
+    const ref = render(<Component />);
+    const spy = jest.spyOn(window, "removeEventListener");
+
+    // act
+    ref.unmount();
+
+    // verify
+    expect(spy).toHaveBeenCalledWith("click", expect.any(Function));
+  });
+});