From 410e1caa7c5efb8b256490e63fbb2fd25e9af5dc Mon Sep 17 00:00:00 2001
From: Brian Kim <briankimpossible@gmail.com>
Date: Wed, 18 Aug 2021 14:19:07 -0400
Subject: [PATCH] add a test for #8497

---
 src/react/hooks/__tests__/useQuery.test.tsx | 69 +++++++++++++++++++++
 1 file changed, 69 insertions(+)

diff --git a/src/react/hooks/__tests__/useQuery.test.tsx b/src/react/hooks/__tests__/useQuery.test.tsx
index 7b7fabd1b09..cb612a50859 100644
--- a/src/react/hooks/__tests__/useQuery.test.tsx
+++ b/src/react/hooks/__tests__/useQuery.test.tsx
@@ -1030,6 +1030,75 @@ describe('useQuery Hook', () => {
       await expect(waitForNextUpdate({ timeout: 20 })).rejects.toThrow('Timed out');
     });
 
+    it('should not persist errors when variables change', async () => {
+      const query = gql`
+        query hello($id: ID) { hello }
+      `;
+
+      const mocks = [
+        {
+          request: {
+            query,
+            variables: { id: 1 },
+          },
+          result: {
+            errors: [new GraphQLError('error')]
+          },
+        },
+        {
+          request: {
+            query,
+            variables: { id: 2 },
+          },
+          result: {
+            data: { hello: 'world' },
+          },
+        }
+      ];
+
+      const cache = new InMemoryCache();
+      const wrapper = ({ children }: any) => (
+        <MockedProvider mocks={mocks} cache={cache}>
+          {children}
+        </MockedProvider>
+      );
+
+      const { result, rerender, waitForNextUpdate } = renderHook(
+        ({ id }) => useQuery(
+          query, {
+            variables: {
+              id,
+            },
+          },
+        ),
+        {
+          wrapper,
+          initialProps: { id: 1 },
+        },
+      );
+
+      expect(result.current.loading).toBe(true);
+      expect(result.current.data).toBe(undefined);
+      expect(result.current.error).toBe(undefined);
+
+      await waitForNextUpdate();
+
+      expect(result.current.loading).toBe(false);
+      expect(result.current.data).toBe(undefined);
+      expect(result.current.error).toBeInstanceOf(ApolloError);
+      expect(result.current.error!.message).toBe('error');
+
+      rerender({ id: 2 });
+      expect(result.current.loading).toBe(true);
+      expect(result.current.data).toBe(undefined);
+      expect(result.current.error).toBe(undefined);
+
+      await waitForNextUpdate();
+      expect(result.current.loading).toBe(false);
+      expect(result.current.data).toEqual({ hello: 'world' });
+      expect(result.current.error).toBe(undefined);
+    });
+
     it('should render multiple errors when refetching', async () => {
       const query = gql`{ hello }`;
       const mocks = [