-
-
Notifications
You must be signed in to change notification settings - Fork 3.5k
[WIP] repro hydrate() causes unhandled promise rejection with a throwing prefetchQuery
#7867
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
[WIP] repro hydrate() causes unhandled promise rejection with a throwing prefetchQuery
#7867
Conversation
hydrate() causes unhandled promise rejection with a throwing prefetchQuery
|
@alvarlagerlof is this happening because of the Ideally, what we wanted to achieve is if the promise from the server fails, it would get retried on the client (since we pass it to the retryer). I'm wondering if adding a |
Yes the lack of
I realised the same about the retries. I tried adding Test log``` |
|
Not sure why it's "unhandled" then. The retryer does handle it 😅 - on the client |
I just tried this: // Note: `Promise.resolve` required cause
// RSC transformed promises are not thenable
const initialPromise = Promise.resolve(promise).then(deserializeData)
// this doesn't actually fetch - it just creates a retryer
// which will re-use the passed `initialPromise`
void query.fetch(undefined, { initialPromise }).catch(() => {
/* noop */
}It also resolved the unhandled promise rejection. So maybe something in the But the added sleep seems to cause a test fail regardless: Test log
|
Ephem
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@alvarlagerlof Thanks again for reporting this back when! I tried reproducing the unhandled error now but can't, so as your last comment suggested, this might not have been hydration-specific after all and seems to have been fixed by other work meanwhile (because I'm sure I've also seen unhandled errors around this in the past). The test error turns out to be unrelated as described in another comment.
I'll go ahead and close this, but do feel free to verify and reopen if you are still seeing unhandled promise rejection errors!
| defaultOptions: { hydrate: { queries: { retry: 1, retryDelay: 10 } } }, | ||
| }) | ||
| hydrate(clientQueryClient, dehydrated) | ||
| await sleep(400) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is causing the fetch to fail before rendering, which means the client can immediately retry on rendering, putting the query in a fetching state, so the redacted will never get printed to the DOM.
If you instead inspect the queryCache directly, it's there.
If you instead put the await between the two waitFor below, the test succeeds again.
So while this might have surfaced an unhandled error in the past, the actual test fail seems to be unrelated.
Debugging an issue where I see
A query that was dehydrated as pending ended up rejecting. [${query?.queryHash}]: Error: server error; The error will be redacted in production buildslogged, but my SSR render also returned a status code of 500.Upon digging into the code, I think I found that
hydrate()can cause an unhandled promise rejection from here when dehydrateQuery catches an error and returns a Promise.reject because aqueryFnthrew.It seems like no tests are covering this, due to them ending before the rejection happens, but when I run the tests with the change in this PR, I get the following:
Test run
✔ nx run @tanstack/query-core:build [existing outputs match the cache, left as is] ✔ nx run @tanstack/query-persist-client-core:build [existing outputs match the cache, left as is] ✔ nx run @tanstack/react-query:build [existing outputs match the cache, left as is] ✔ nx run @tanstack/query-devtools:build [existing outputs match the cache, left as is] ✔ nx run @tanstack/react-query-persist-client:test:lib [existing outputs match the cache, left as is] ✔ nx run @tanstack/react-query-devtools:test:lib [existing outputs match the cache, left as is]———————————————————————————————————————————————————————————————————————————————————————————————————————————————————————
✖ nx run @tanstack/react-query:test:lib
> @tanstack/[email protected] test:lib /Users/alvar/Code/query/packages/react-query
> vitest --retry=3
———————————————————————————————————————————————————————————————————————————————————————————————————————————————————————
NX Ran target test:lib for 3 projects and 4 tasks they depend on (19s)
✔ 6/7 succeeded [6 read from cache]
✖ 1/7 targets failed, including the following:
View structured, searchable error logs at https://nx.app/runs/yruFhd2Ecu
ELIFECYCLE Command failed with exit code 1.