fix(nuxt): prevent initial scroll jump when loading page #25483
Merged
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.
π Linked issue
resolves #19664
resolves #25030
resolves #22487
β Type of change
π Description
When performing an initial load of a page, there are two navigation events that happen, first when the router plugin initialises, and then after all plugins run (to give a chance for plugins to register middleware).
This causes a jump of the scroll to the top and then after all plugins run, it restores the scroll position. However, this is unaesthetic and a bad user experience.
Rather than adjusting the scrollBehavior itself, we can set
window.history.scrollRestoration
toauto
until these first two navigations have taken place.https://github.com/vuejs/router/blob/main/packages/router/src/router.ts#L378-L381
This supersedes some of #24960 but by no means all. (cc: @bernhardberger)
π Checklist