-
-
Notifications
You must be signed in to change notification settings - Fork 2.2k
Disabling scroll restoration when doing history.back() after pushState() #11452
Description
Describe the problem
I'm trying to use the new shallow routing feature to make it possible for users to close an app-like sidebar by using the back button, which I'd presume is the quintessential use case for this feature.
Things are working well apart from the fact that closing the sidebar (i.e. history.back()) often changes the document's scroll position, similar to how it's done upon page navigation, but in this particular case it's annoying and very much feels disruptive and inappropriate UX-wise.
You can see a basic example of this happening in the video below. Notice how the page underneath the sidebar is suddenly scrolled up as soon as the sidebar is closed (i.e. history.back() is invoked):
Rec.0006.mp4
Describe the proposed solution
I'm not quite sure if it's the browser doing this on its own (apparently not since SvelteKit seems to set history.scrollRestoration to manual) or if it's something SvelteKit is internally doing or at least has control over; if it's the latter, then it would be useful if, for example, pushState received an option similar to goto's noscroll, which disables this behavior. This can be desirable in cases where shallow routing is being used for opening and closing components such as modals and sidebars and so forth, where one normally doesn't expect the document's scroll position to change when closing the component.
Alternatives considered
No response
Importance
nice to have
Additional Information
No response