Repository: tannerlinsley/react-query
Pull request #2935 (2021-11-12 19:28:34)

fix(useQuery): don't throw error if errorBoundary has just been reset
the fix for disabled queries was wrong, because disabled queries still need to throw if they are fetching due to some other means, like `refetch`. However, if a query has just been reset, we want to skip throwing for one render cycle. The useEffect that clears the reset will then make sure that further errors will be thrown

vercel[bot]: This pull request is being automatically deployed with Vercel ([learn more](https://vercel.link/github-learn-more)).  
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: [https://vercel.com/tanstack/react-query/5WWq937PQ59BjwFADxoPoNK57TYt](https://vercel.com/tanstack/react-query/5WWq937PQ59BjwFADxoPoNK57TYt)  
✅ Preview: *In Progress*


codesandbox[bot]: This pull request is automatically built and testable in [CodeSandbox](https://codesandbox.io).

  To see build info of the built libraries, click [here](https://ci.codesandbox.io/status/tannerlinsley/react-query/pr/2935/builds/187727) or the icon next to each commit SHA.

Latest deployment of this branch, based on commit df2ea3914138613e3f601c55038dd5352c05d823:

|Sandbox| Source |
|--|--|
|[tannerlinsley/react-query: basic](https://codesandbox.io/s/tannerlinsley-react-query-basic-0rd07)| Configuration |
|[tannerlinsley/react-query: basic-typescript](https://codesandbox.io/s/tannerlinsley-react-query-basic-typescript-2tkdb)| Configuration |

codecov[bot]: # [Codecov](https://codecov.io/gh/tannerlinsley/react-query/pull/2935?src=pr&el=h1&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=Tanner+Linsley) Report
> Merging [#2935](https://codecov.io/gh/tannerlinsley/react-query/pull/2935?src=pr&el=desc&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=Tanner+Linsley) (df2ea39) into [master](https://codecov.io/gh/tannerlinsley/react-query/commit/d3d7fc4451184b9744ceb1bdb1b351ca706aab61?el=desc&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=Tanner+Linsley) (d3d7fc4) will **not change** coverage.
> The diff coverage is `100.00%`.

[![Impacted file tree graph](https://codecov.io/gh/tannerlinsley/react-query/pull/2935/graphs/tree.svg?width=650&height=150&src=pr&token=jqEbswkEDQ&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=Tanner+Linsley)](https://codecov.io/gh/tannerlinsley/react-query/pull/2935?src=pr&el=tree&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=Tanner+Linsley)

```diff
@@           Coverage Diff           @@
##           master    #2935   +/-   ##
=======================================
  Coverage   96.40%   96.40%           
=======================================
  Files          45       45           
  Lines        2227     2227           
  Branches      637      637           
=======================================
  Hits         2147     2147           
  Misses         77       77           
  Partials        3        3           
```


| [Impacted Files](https://codecov.io/gh/tannerlinsley/react-query/pull/2935?src=pr&el=tree&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=Tanner+Linsley) | Coverage Δ | |
|---|---|---|
| [src/react/useBaseQuery.ts](https://codecov.io/gh/tannerlinsley/react-query/pull/2935/diff?src=pr&el=tree&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=Tanner+Linsley#diff-c3JjL3JlYWN0L3VzZUJhc2VRdWVyeS50cw==) | `100.00% <100.00%> (ø)` | |

------

[Continue to review full report at Codecov](https://codecov.io/gh/tannerlinsley/react-query/pull/2935?src=pr&el=continue&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=Tanner+Linsley).
> **Legend** - [Click here to learn more](https://docs.codecov.io/docs/codecov-delta?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=Tanner+Linsley)
> `Δ = absolute <relative> (impact)`, `ø = not affected`, `? = missing data`
> Powered by [Codecov](https://codecov.io/gh/tannerlinsley/react-query/pull/2935?src=pr&el=footer&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=Tanner+Linsley). Last update [d3d7fc4...df2ea39](https://codecov.io/gh/tannerlinsley/react-query/pull/2935?src=pr&el=lastupdated&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=Tanner+Linsley). Read the [comment docs](https://docs.codecov.io/docs/pull-request-comments?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=Tanner+Linsley).

TkDodo: @WeiShengv99 I tried your lates example with this preview, and it seems to work fine:

https://codesandbox.io/s/tannerlinsley-react-query-basic-forked-vspe0?file=/src/index.js

Patch:
diff --git a/src/react/useBaseQuery.ts b/src/react/useBaseQuery.ts
index 149d80320..693944fc3 100644
--- a/src/react/useBaseQuery.ts
+++ b/src/react/useBaseQuery.ts
@@ -131,7 +131,7 @@ export function useBaseQuery<
   // Handle error boundary
   if (
     result.isError &&
-    defaultedOptions.enabled !== false &&
+    !errorResetBoundary.isReset() &&
     !result.isFetching &&
     shouldThrowError(
       defaultedOptions.suspense,


Test patch:
diff --git a/src/react/tests/QueryResetErrorBoundary.test.tsx b/src/react/tests/QueryResetErrorBoundary.test.tsx
index 1ee596669..f73210d25 100644
--- a/src/react/tests/QueryResetErrorBoundary.test.tsx
+++ b/src/react/tests/QueryResetErrorBoundary.test.tsx
@@ -204,6 +204,65 @@ describe('QueryErrorResetBoundary', () => {
     consoleMock.mockRestore()
   })
 
+  it('should throw error if query is disabled and manually refetched', async () => {
+    const key = queryKey()
+
+    const consoleMock = mockConsoleError()
+
+    function Page() {
+      const { data, refetch, status } = useQuery(
+        key,
+        async () => {
+          throw new Error('Error')
+        },
+        {
+          retry: false,
+          enabled: false,
+          useErrorBoundary: true,
+        }
+      )
+
+      return (
+        <div>
+          <button onClick={() => refetch()}>refetch</button>
+          <div>status: {status}</div>
+          <div>{data}</div>
+        </div>
+      )
+    }
+
+    const rendered = renderWithClient(
+      queryClient,
+      <QueryErrorResetBoundary>
+        {({ reset }) => (
+          <ErrorBoundary
+            onReset={reset}
+            fallbackRender={({ resetErrorBoundary }) => (
+              <div>
+                <div>error boundary</div>
+                <button
+                  onClick={() => {
+                    resetErrorBoundary()
+                  }}
+                >
+                  retry
+                </button>
+              </div>
+            )}
+          >
+            <Page />
+          </ErrorBoundary>
+        )}
+      </QueryErrorResetBoundary>
+    )
+
+    await waitFor(() => rendered.getByText('status: idle'))
+    rendered.getByRole('button', { name: /refetch/i }).click()
+    await waitFor(() => rendered.getByText('error boundary'))
+
+    consoleMock.mockRestore()
+  })
+
   it('should not retry fetch if the reset error boundary has not been reset', async () => {
     const key = queryKey()