-
-
Notifications
You must be signed in to change notification settings - Fork 2.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Infinite refetching when using usePrefetchQuery
(ensureQueryData
) with Suspense
#7422
Comments
usePrefetchQuery
(ensureQueryData
)usePrefetchQuery
(ensureQueryData
) with Suspense
usePrefetchQuery
(ensureQueryData
) with SuspenseusePrefetchQuery
(ensureQueryData
) with Suspense
yeah I think this is what happens when you think the rules of react don't apply / we can bend them. Doing something during render isn't really safe. In case of To really only trigger it once, we would need to wrap the call to
because we need to only call it once per query, not per query data. As you've seen, in case of error, the query is created, but data isn't there yet. I think at least, we should change the docs around this pattern, or maybe even remove it completely from the docs. @Ephem FYI |
Thanks for your quick reply!
Do you think it also makes sense to add an empty
The docs mention this hook eventually moving into the library, so perhaps a battle-tested version of it could be exported at some point? I think that prefetching in render is fine, e.g. https://react.dev/reference/react-dom/prefetchDNS does that, but what’s not fine is |
yes, that looks good.
Maybe at some point; for now, I think it's enough if we update the example to the version you have proposed. I think ideally, prefetching would happen on route level or in event handlers instead of during render. Would you like to update the docs? |
Thanks for the bug report and the ping, makes sense this fails and I agree we should update the docs. The reason it fails is a bit more straightforward then mentioned above though. It's not because of an extra render because of the (The
I agree with this, but I've also seen enough codebases where this is hard to implement and a (working) |
If you comment out the prefetch, the suspense query does settle though. |
Oh yeah, the At least something along those lines. |
Describe the bug
It appears that when using Suspense and the documented
usePrefetchQuery
(which is essentiallyqueryClient.ensureQueryData()
in the render phase), if the query function throws an error, it will keep getting retried and the error boundary is never shown.Your minimal, reproducible example
https://codesandbox.io/p/devbox/funny-cohen-t4wjhh?file=%2Fsrc%2Fmain.tsx%3A54%2C28
Steps to reproduce
usePrefetchQuery
and you’ll see that the error boundary renders an errorExpected behavior
I’d expect it not to keep retrying the query and for the error boundary to render an error
How often does this bug happen?
Every time
Screenshots or Videos
No response
Platform
Tanstack Query adapter
react-query
TanStack Query version
5.36.0
TypeScript version
No response
Additional context
No response
The text was updated successfully, but these errors were encountered: