diff --git a/.changeset/small-nails-try.md b/.changeset/small-nails-try.md new file mode 100644 index 000000000000..3f6f591f133f --- /dev/null +++ b/.changeset/small-nails-try.md @@ -0,0 +1,5 @@ +--- +'astro': patch +--- + +On back navigation only animate view transitions that were animated going forward. diff --git a/packages/astro/components/ViewTransitions.astro b/packages/astro/components/ViewTransitions.astro index 3967d0aeef2c..4b7a465517ff 100644 --- a/packages/astro/components/ViewTransitions.astro +++ b/packages/astro/components/ViewTransitions.astro @@ -306,10 +306,11 @@ const { fallback = 'animate' } = Astro.props as Props; return; } - // hash change creates no state. + // History entries without state are created by the browser (e.g. for hash links) + // Our view transition entries always have state. + // Just ignore stateless entries. + // The browser will handle navigation fine without our help if (ev.state === null) { - persistState({ index: currentHistoryIndex, scrollY }); - ev.preventDefault(); return; } @@ -344,6 +345,8 @@ const { fallback = 'animate' } = Astro.props as Props; addEventListener( 'scroll', throttle(() => { + // only updste history entries that are managed by us + // leave other entries alone and do not accidently add state. if (history.state) { persistState({ ...history.state, scrollY }); }