Refactor common signed in and signed out user sessions into util func…

…tions
gadget-inc · Jul 4, 2023 · 6b29bd9 · 6b29bd9
1 parent ae2c10c
commit 6b29bd9
Show file tree

Hide file tree

Showing 12 changed files with 71 additions and 184 deletions.
diff --git a/packages/react/spec/auth/useIsSignedIn.spec.ts b/packages/react/spec/auth/useIsSignedIn.spec.ts
@@ -1,28 +1,14 @@
 import { renderHook } from "@testing-library/react";
 import { superAuthApi } from "../../spec/apis";
 import { useIsSignedIn } from "../../src/auth/useIsSignedIn";
-import { TestWrapper, mockUrqlClient } from "../testWrapper";
+import { TestWrapper } from "../testWrapper";
+import { expectMockSignedInUser, expectMockSignedOutUser } from "../../spec/utils";
 
 describe("useIsSignedIn", () => {
   test("returns true if the user is signed in", async () => {
     const { result, rerender } = renderHook(() => useIsSignedIn(), { wrapper: TestWrapper(superAuthApi) });
 
-    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
-    mockUrqlClient.executeQuery.pushResponse("currentSession", {
-      data: {
-        currentSession: {
-          id: "123",
-          userId: "321",
-          user: {
-            id: "321",
-            firstName: "Jane",
-            lastName: "Doe",
-          },
-        },
-      },
-      stale: false,
-      hasNext: false,
-    });
+    expectMockSignedInUser();
 
     rerender();
     expect(result.current).toBe(true);
@@ -31,18 +17,7 @@ describe("useIsSignedIn", () => {
   test("returns false if the user is signed out", async () => {
     const { result, rerender } = renderHook(() => useIsSignedIn(), { wrapper: TestWrapper(superAuthApi) });
 
-    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
-    mockUrqlClient.executeQuery.pushResponse("currentSession", {
-      data: {
-        currentSession: {
-          id: "123",
-          userId: null,
-          user: null,
-        },
-      },
-      stale: false,
-      hasNext: false,
-    });
+    expectMockSignedOutUser();
 
     rerender();
     expect(result.current).toBe(false);

diff --git a/packages/react/spec/auth/useSession.spec.ts b/packages/react/spec/auth/useSession.spec.ts
@@ -1,28 +1,14 @@
 import { renderHook } from "@testing-library/react";
 import { superAuthApi } from "../../spec/apis";
 import { useSession } from "../../src/auth/useSession";
-import { TestWrapper, mockUrqlClient } from "../testWrapper";
+import { TestWrapper } from "../testWrapper";
+import { expectMockSignedInUser, expectMockSignedOutUser } from "../../spec/utils";
 
 describe("useSession", () => {
   test("it returns the current session when the user is logged in", async () => {
     const { result, rerender } = renderHook(() => useSession(), { wrapper: TestWrapper(superAuthApi) });
 
-    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
-    mockUrqlClient.executeQuery.pushResponse("currentSession", {
-      data: {
-        currentSession: {
-          id: "123",
-          userId: "321",
-          user: {
-            id: "321",
-            firstName: "Jane",
-            lastName: "Doe",
-          },
-        },
-      },
-      stale: false,
-      hasNext: false,
-    });
+    expectMockSignedInUser();
 
     rerender();
 
@@ -36,18 +22,7 @@ describe("useSession", () => {
   test("it returns the current session when the user is logged out", async () => {
     const { result } = renderHook(() => useSession(), { wrapper: TestWrapper(superAuthApi) });
 
-    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
-    mockUrqlClient.executeQuery.pushResponse("currentSession", {
-      data: {
-        currentSession: {
-          id: "123",
-          userId: null,
-          user: null,
-        },
-      },
-      stale: false,
-      hasNext: false,
-    });
+    expectMockSignedOutUser();
 
     expect(result.current).toBeDefined();
     expect(result.current!.id).toEqual("123");

diff --git a/packages/react/spec/auth/useUser.spec.ts b/packages/react/spec/auth/useUser.spec.ts
@@ -1,28 +1,14 @@
 import { renderHook } from "@testing-library/react";
 import { superAuthApi } from "../../spec/apis";
 import { useUser } from "../../src/auth/useUser";
-import { TestWrapper, mockUrqlClient } from "../testWrapper";
+import { TestWrapper } from "../testWrapper";
+import { expectMockSignedInUser, expectMockSignedOutUser } from "../../spec/utils";
 
 describe("useUser", () => {
   test("it returns the current user when the user is logged in", async () => {
     const { result, rerender } = renderHook(() => useUser(), { wrapper: TestWrapper(superAuthApi) });
 
-    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
-    mockUrqlClient.executeQuery.pushResponse("currentSession", {
-      data: {
-        currentSession: {
-          id: "123",
-          userId: "321",
-          user: {
-            id: "321",
-            firstName: "Jane",
-            lastName: "Doe",
-          },
-        },
-      },
-      stale: false,
-      hasNext: false,
-    });
+    expectMockSignedInUser();
 
     rerender();
     expect(result.current!.id).toEqual("321");
@@ -33,18 +19,7 @@ describe("useUser", () => {
   test("it returns null when the user is logged out", async () => {
     const { result, rerender } = renderHook(() => useUser(), { wrapper: TestWrapper(superAuthApi) });
 
-    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
-    mockUrqlClient.executeQuery.pushResponse("currentSession", {
-      data: {
-        currentSession: {
-          id: "123",
-          userId: null,
-          user: null,
-        },
-      },
-      stale: false,
-      hasNext: false,
-    });
+    expectMockSignedOutUser();
 
     rerender();
     expect(result.current).toBe(null);

diff --git a/packages/react/spec/components/SignedIn.spec.tsx b/packages/react/spec/components/SignedIn.spec.tsx
@@ -2,8 +2,9 @@ import "@testing-library/jest-dom";
 import { render } from "@testing-library/react";
 import React from "react";
 import { superAuthApi } from "../../spec/apis";
+import { expectMockSignedInUser, expectMockSignedOutUser } from "../../spec/utils";
 import { SignedIn } from "../../src/components/SignedIn";
-import { TestWrapper, mockUrqlClient } from "../testWrapper";
+import { TestWrapper } from "../testWrapper";
 
 describe("SignedIn", () => {
   test("renders children when signed in", () => {
@@ -15,22 +16,7 @@ describe("SignedIn", () => {
 
     const { container, rerender } = render(component, { wrapper: TestWrapper(superAuthApi) });
 
-    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
-    mockUrqlClient.executeQuery.pushResponse("currentSession", {
-      data: {
-        currentSession: {
-          id: "123",
-          userId: "321",
-          user: {
-            id: "321",
-            firstName: "Jane",
-            lastName: "Doe",
-          },
-        },
-      },
-      stale: false,
-      hasNext: false,
-    });
+    expectMockSignedInUser();
 
     rerender(component);
 
@@ -47,18 +33,7 @@ describe("SignedIn", () => {
 
     const { container, rerender } = render(component, { wrapper: TestWrapper(superAuthApi) });
 
-    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
-    mockUrqlClient.executeQuery.pushResponse("currentSession", {
-      data: {
-        currentSession: {
-          id: "123",
-          userId: null,
-          user: null,
-        },
-      },
-      stale: false,
-      hasNext: false,
-    });
+    expectMockSignedOutUser();
     rerender(component);
     expect(container.outerHTML).toMatchInlineSnapshot(`"<div><h1>Hello</h1></div>"`);
   });

diff --git a/packages/react/spec/components/SignedInOrRedirect.spec.tsx b/packages/react/spec/components/SignedInOrRedirect.spec.tsx
@@ -2,15 +2,18 @@ import "@testing-library/jest-dom";
 import { render } from "@testing-library/react";
 import React from "react";
 import { superAuthApi } from "../../spec/apis";
-import { TestWrapper, mockUrqlClient } from "../../spec/testWrapper";
+import { TestWrapper } from "../../spec/testWrapper";
+import { expectMockSignedInUser, expectMockSignedOutUser } from "../../spec/utils";
 import { SignedInOrRedirect } from "../../src/components/SignedInOrRedirect";
 
 describe("SignedInOrRedirectOrRedirect", () => {
   const { location } = window;
   const mockAssign = jest.fn();
 
   beforeAll(() => {
+    // @ts-expect-error mock
     delete window.location;
+    // @ts-expect-error mock
     window.location = { assign: mockAssign };
   });
 
@@ -30,19 +33,7 @@ describe("SignedInOrRedirectOrRedirect", () => {
     );
 
     const { rerender } = render(component, { wrapper: TestWrapper(superAuthApi) });
-
-    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
-    mockUrqlClient.executeQuery.pushResponse("currentSession", {
-      data: {
-        currentSession: {
-          id: "123",
-          userId: null,
-          user: null,
-        },
-      },
-      stale: false,
-      hasNext: false,
-    });
+    expectMockSignedOutUser();
 
     rerender(component);
     expect(mockAssign).toHaveBeenCalledTimes(1);
@@ -58,22 +49,7 @@ describe("SignedInOrRedirectOrRedirect", () => {
 
     const { container, rerender } = render(component, { wrapper: TestWrapper(superAuthApi) });
 
-    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
-    mockUrqlClient.executeQuery.pushResponse("currentSession", {
-      data: {
-        currentSession: {
-          id: "123",
-          userId: "321",
-          user: {
-            id: "321",
-            firstName: "Jane",
-            lastName: "Doe",
-          },
-        },
-      },
-      stale: false,
-      hasNext: false,
-    });
+    expectMockSignedInUser();
 
     rerender(component);
 

diff --git a/packages/react/spec/components/SignedOut.spec.tsx b/packages/react/spec/components/SignedOut.spec.tsx
@@ -2,7 +2,8 @@ import "@testing-library/jest-dom";
 import { render } from "@testing-library/react";
 import React from "react";
 import { superAuthApi } from "../../spec/apis";
-import { TestWrapper, mockUrqlClient } from "../../spec/testWrapper";
+import { TestWrapper } from "../../spec/testWrapper";
+import { expectMockSignedInUser, expectMockSignedOutUser } from "../../spec/utils";
 import { SignedOut } from "../../src/components/SignedOut";
 
 describe("SignedOut", () => {
@@ -15,18 +16,7 @@ describe("SignedOut", () => {
 
     const { container, rerender } = render(component, { wrapper: TestWrapper(superAuthApi) });
 
-    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
-    mockUrqlClient.executeQuery.pushResponse("currentSession", {
-      data: {
-        currentSession: {
-          id: "123",
-          userId: null,
-          user: null,
-        },
-      },
-      stale: false,
-      hasNext: false,
-    });
+    expectMockSignedOutUser();
 
     rerender(component);
     expect(container.outerHTML).toMatchInlineSnapshot(`"<div><h1>Hello, Jane!</h1></div>"`);
@@ -41,22 +31,7 @@ describe("SignedOut", () => {
 
     const { container, rerender } = render(component, { wrapper: TestWrapper(superAuthApi) });
 
-    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
-    mockUrqlClient.executeQuery.pushResponse("currentSession", {
-      data: {
-        currentSession: {
-          id: "123",
-          userId: "321",
-          user: {
-            id: "321",
-            firstName: "Jane",
-            lastName: "Doe",
-          },
-        },
-      },
-      stale: false,
-      hasNext: false,
-    });
+    expectMockSignedInUser();
 
     rerender(component);
     expect(container.outerHTML).toMatchInlineSnapshot(`"<div><h1>Hello</h1></div>"`);

diff --git a/packages/react/spec/testWrapper.tsx b/packages/react/spec/testWrapper.tsx
@@ -150,14 +150,13 @@ export const createMockUrqlCient = (assertions?: {
 };
 
 export const TestWrapper = (api: AnyClient) => (props: { children: ReactNode }) => {
-  // any individual test will only use one of those, but mock them all out for simplicity
-  jest.spyOn(relatedProductsApi.connection, "currentClient", "get").mockReturnValue(mockUrqlClient);
-  jest.spyOn(bulkExampleApi.connection, "currentClient", "get").mockReturnValue(mockUrqlClient);
-  jest.spyOn(superAuthApi.connection, "currentClient", "get").mockReturnValue(mockUrqlClient);
+  jest.spyOn(api.connection, "currentClient", "get").mockReturnValue(mockUrqlClient);
 
   return (
     <Provider api={api}>
-      <Suspense fallback={<div>Loading...</div>}>{props.children}</Suspense>
+      <Suspense fallback={<div>Loading...</div>}>
+        {props.children}
+      </Suspense>
     </Provider>
   );
 };
diff --git a/packages/react/spec/utils.ts b/packages/react/spec/utils.ts
@@ -0,0 +1,35 @@
+import { mockUrqlClient } from "./testWrapper";
+
+export const expectMockSignedInUser = () => {
+  expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
+  mockUrqlClient.executeQuery.pushResponse("currentSession", {
+    data: {
+      currentSession: {
+        id: "123",
+        userId: "321",
+        user: {
+          id: "321",
+          firstName: "Jane",
+          lastName: "Doe",
+        },
+      },
+    },
+    stale: false,
+    hasNext: false,
+  });
+};
+
+export const expectMockSignedOutUser = () => {
+  expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
+  mockUrqlClient.executeQuery.pushResponse("currentSession", {
+    data: {
+      currentSession: {
+        id: "123",
+        userId: null,
+        user: null,
+      },
+    },
+    stale: false,
+    hasNext: false,
+  });
+};
diff --git a/packages/react/src/auth/useSession.ts b/packages/react/src/auth/useSession.ts
@@ -35,4 +35,3 @@ export const useSession = (): GadgetSession | undefined => {
   const [{ data: session }] = useGetSessionAndUser();
   return session;
 };
-