diff --git a/.changeset/friendly-flies-battle.md b/.changeset/friendly-flies-battle.md new file mode 100644 index 00000000000..094ee40d3cc --- /dev/null +++ b/.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 diff --git a/packages/graphiql-react/src/schema.tsx b/packages/graphiql-react/src/schema.tsx index 98a1c53147f..d439aca08ef 100644 --- a/packages/graphiql-react/src/schema.tsx +++ b/packages/graphiql-react/src/schema.tsx @@ -168,6 +168,7 @@ export function SchemaContextProvider(props: SchemaContextProviderProps) { } setIsFetching(true); + setFetchError(null); let result = await fetch; diff --git a/packages/graphiql/src/components/__tests__/GraphiQL.spec.tsx b/packages/graphiql/src/components/__tests__/GraphiQL.spec.tsx index 3ef6d1a9a66..19d9229cb5e 100644 --- a/packages/graphiql/src/components/__tests__/GraphiQL.spec.tsx +++ b/packages/graphiql/src/components/__tests__/GraphiQL.spec.tsx @@ -98,6 +98,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(); + await wait(); + + expect( + container.querySelector('.doc-explorer-contents .error-container'), + ).toBeTruthy(); + + // Re-render with valid fetcher + rerender(); + 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(),