fix(server-renderer): Fix call to serverPrefetch in server renderer with an async setup #10893
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
… option w/async setup This fixes a bug where the serverPrefetch option would not be called with an async setup method. A `prefetches` reference was created while `instance.sp` was `null`. However, with an async setup, `instance.sp` has the serverPrefetch methods only after setup resolves. The fix is achieved by waiting to for setup to resolve before trying to access the the serverPrefetch options from `instance.sp`.
Size ReportBundles
Usages
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This fixes a bug where the serverPrefetch option would not be called with an async setup method.
About the fix
A
prefetchesreference was created whileinstance.spwasnull. However, with an async setup,instance.sphas the serverPrefetch methods only after setup resolves.The fix is achieved by waiting to for setup to resolve before trying to access the the serverPrefetch options from
instance.sp.I added a unit test that reproduces the problem, by adding an async setup to the component definition. FWIW, I considered and experimented with adding more async setup variations of the existing tests, but backed out after they did not reproduce the problem and decided they weren't critical.
Impact of the bug
The bug can break SSR because the server renderer will not wait long enough to produce serializable state.
Specifically, this bug exists when using:
defineNuxtComponentfrom Nuxt 3 (because it creates an async setup method)serverPrefetchmethod that resolves when all apollo promises resolve)The server will make a request, but the renderer doesn't wait for it to finish. Nuxt dispatches
app:rendered, serializes whatever state it has (which excludes the in-flight apollo graphql requests). Then the page loads in a blank state, then the client in the browser will issue the now redundant graphql requests, and finally render the complete page.This problem affects Nuxt 2 apollo apps that are migrating to Nuxt 3 and is a regression in the ecosystem.