0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2024-12-16 21:46:22 -05:00

View Transitions: use history.scrollRestoration="manual" (#8231)

* View Transitions: use history.scrollRestoration="manual"

* Update changeset

* Set scrollRestoration to manual before popState

Co-authored-by: Martin Trapp <94928215+martrapp@users.noreply.github.com>

---------

Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
Co-authored-by: Martin Trapp <94928215+martrapp@users.noreply.github.com>
This commit is contained in:
Justin Beaty 2023-08-31 09:20:26 -07:00 committed by GitHub
parent c58472756e
commit af41b03d05
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 0 deletions

View file

@ -0,0 +1,5 @@
---
'astro': patch
---
Fixes scroll behavior when using View Transitions by enabling `manual` scroll restoration

View file

@ -347,9 +347,18 @@ const { fallback = 'animate' } = Astro.props as Props;
// Just ignore stateless entries.
// The browser will handle navigation fine without our help
if (ev.state === null) {
if (history.scrollRestoration) {
history.scrollRestoration = "auto";
}
return;
}
// With the default "auto", the browser will jump to the old scroll position
// before the ViewTransition is complete.
if (history.scrollRestoration) {
history.scrollRestoration = "manual";
}
const state: State | undefined = history.state;
const nextIndex = state?.index ?? currentHistoryIndex + 1;
const direction: Direction = nextIndex > currentHistoryIndex ? 'forward' : 'back';