fix: fix fetchError persisting across different fetchers (#2653)

* fix: fix fetchError persisting across different fetchers

* Update packages/graphiql-react/src/schema.tsx

Co-authored-by: Thomas Heyenbrock <[email protected]>

* review comments and added a changeset

Co-authored-by: Thomas Heyenbrock <[email protected]>

.changeset/friendly-flies-battle.md

@@ -0,0 +1,6 @@
+---
+'graphiql': patch
+'@graphiql/react': patch
+---
+
+Fix `fetchError` not being cleared when a new `fetcher` is used

packages/graphiql-react/src/schema.tsx

@@ -227,6 +227,7 @@ export function SchemaContextProvider(props: SchemaContextProviderProps) {
       }
 
       setIsFetching(true);
+      setFetchError(null);
 
       let result = await fetch;
 

packages/graphiql/src/components/__tests__/GraphiQL.spec.tsx

@@ -99,6 +99,31 @@ describe('GraphiQL', () => {
     expect(secondCalled).toEqual(true);
   });
 
+  it('should refresh schema with new fetcher after a fetchError', async () => {
+    function firstFetcher() {
+      return Promise.reject('Schema Error');
+    }
+    function secondFetcher() {
+      return Promise.resolve(simpleIntrospection);
+    }
+
+    // Use a bad fetcher for our initial render
+    const { rerender, container } = render(<GraphiQL fetcher={firstFetcher} />);
+    await wait();
+
+    expect(
+      container.querySelector('.doc-explorer-contents .error-container'),
+    ).toBeTruthy();
+
+    // Re-render with valid fetcher
+    rerender(<GraphiQL fetcher={secondFetcher} />);
+    await wait();
+
+    expect(
+      container.querySelector('.doc-explorer-contents .error-container'),
+    ).not.toBeTruthy();
+  });
+
   it('should not throw error if schema missing and query provided', () => {
     expect(() =>
       render(<GraphiQL fetcher={noOpFetcher} query="{}" />),