copy some tests from Query

apollographql · Aug 5, 2021 · 7a401a7 · 7a401a7
1 parent c1b01f1
commit 7a401a7
Showing 1 changed file with 128 additions and 3 deletions.
diff --git a/src/react/hooks/__tests__/useQuery.test.tsx b/src/react/hooks/__tests__/useQuery.test.tsx
@@ -1187,6 +1187,66 @@ describe('useQuery Hook', () => {
       expect(catchFn.mock.calls[0][0]).toBeInstanceOf(ApolloError);
       expect(catchFn.mock.calls[0][0].message).toBe('same error');
     });
+
+    it('should call onCompleted when variables change', async () => {
+      const query = gql`
+        query people($first: Int) {
+          allPeople(first: $first) {
+            people {
+              name
+            }
+          }
+        }
+      `;
+
+      const data1 = { allPeople: { people: [{ name: 'Luke Skywalker' }] } };
+      const data2 = { allPeople: { people: [{ name: 'Han Solo' }] } };
+      const mocks = [
+        {
+          request: { query, variables: { first: 1 } },
+          result: { data: data1 },
+        },
+        {
+          request: { query, variables: { first: 2 } },
+          result: { data: data2 },
+        },
+      ];
+
+      const onCompleted = jest.fn();
+
+      const { result, rerender, waitForNextUpdate } = renderHook(
+        ({ variables }) => useQuery(query, { variables, onCompleted }),
+        {
+          wrapper: ({ children }) => (
+            <MockedProvider mocks={mocks}>
+              {children}
+            </MockedProvider>
+          ),
+          initialProps: {
+            variables: { first: 1 },
+          },
+        },
+      );
+
+      expect(result.current.loading).toBe(true);
+
+      await waitForNextUpdate();
+      expect(result.current.loading).toBe(false);
+      expect(result.current.data).toEqual(data1);
+
+      rerender({ variables: { first: 2 } });
+      expect(result.current.loading).toBe(true);
+
+      await waitForNextUpdate();
+      expect(result.current.loading).toBe(false);
+      expect(result.current.data).toEqual(data2);
+
+      rerender({ variables: { first: 1 } });
+      expect(result.current.loading).toBe(false);
+      expect(result.current.data).toEqual(data1);
+
+      expect(onCompleted).toHaveBeenCalledTimes(3);
+    });
   });
 
   describe('Pagination', () => {
@@ -1443,6 +1503,71 @@ describe('useQuery Hook', () => {
       expect(result.current.data).toEqual({ hello: 'world 2' });
     });
 
+    it('refetching after an error', async () => {
+      const query = gql`{ hello }`;
+      const mocks = [
+        {
+          request: { query },
+          result: { data: { hello: 'world 1' } },
+        },
+        {
+          request: { query },
+          error: new Error('This is an error!'),
+          delay: 10,
+        },
+        {
+          request: { query },
+          result: { data: { hello: 'world 2' } },
+          delay: 10,
+        },
+      ];
+
+      const cache = new InMemoryCache();
+
+      const { result, waitForNextUpdate } = renderHook(
+        () => useQuery(query, {
+          notifyOnNetworkStatusChange: true,
+        }),
+        {
+          wrapper: ({ children }) => (
+            <MockedProvider mocks={mocks} cache={cache}>
+              {children}
+            </MockedProvider>
+          ),
+        },
+      );
+
+      expect(result.current.loading).toBe(true);
+      expect(result.current.data).toBe(undefined);
+
+      await waitForNextUpdate();
+      expect(result.current.loading).toBe(false);
+      expect(result.current.error).toBe(undefined);
+      expect(result.current.data).toEqual({ hello: 'world 1' });
+
+      result.current.refetch();
+      await waitForNextUpdate();
+      expect(result.current.loading).toBe(true);
+      expect(result.current.error).toBe(undefined);
+      expect(result.current.data).toEqual({ hello: 'world 1' });
+
+      await waitForNextUpdate();
+      expect(result.current.loading).toBe(false);
+      expect(result.current.error).toBeInstanceOf(ApolloError);
+      expect(result.current.data).toEqual({ hello: 'world 1' });
+
+      result.current.refetch();
+      await waitForNextUpdate();
+      expect(result.current.loading).toBe(true);
+      expect(result.current.error).toBe(undefined);
+      expect(result.current.data).toEqual({ hello: 'world 1' });
+
+      await waitForNextUpdate();
+      expect(result.current.loading).toBe(false);
+      expect(result.current.error).toBe(undefined);
+      expect(result.current.data).toEqual({ hello: 'world 2' });
+    });
+
     describe('refetchWritePolicy', () => {
       const query = gql`
         query GetPrimes ($min: number, $max: number) {
@@ -2048,7 +2173,7 @@ describe('useQuery Hook', () => {
           request: {
             query,
             variables: {
-              someVar: 'abc123'
+              name: 'Luke'
             }
           },
           result: { data: undefined },
@@ -2057,7 +2182,7 @@ describe('useQuery Hook', () => {
           request: {
             query,
             variables: {
-              someVar: 'abc123'
+              name: 'Luke'
             }
           },
           result: { data: peopleData },
@@ -2078,7 +2203,7 @@ describe('useQuery Hook', () => {
 
       const { result, waitForNextUpdate } = renderHook(
         () => useQuery(query, {
-          variables: { someVar: 'abc123' },
+          variables: { name: 'Luke' },
           partialRefetch: true,
           notifyOnNetworkStatusChange: true,
         }),