Fix history navigation to hash fragment on Firefox when using view tr…

…ansitions (#9563) * Fix history navigation to hash fragment on Firefox when using view transitions * Edit changeset * Improve changeset, add co-authors
withastro · Jan 2, 2024 · d48ab90 · d48ab90
1 parent d854330
commit d48ab90
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/.changeset/breezy-eyes-teach.md b/.changeset/breezy-eyes-teach.md
@@ -0,0 +1,8 @@
+---
+"astro": patch
+---
+
+Fixes back navigation to fragment links (e.g. `#about`) in Firefox when using view transitions
+
+Co-authored-by: Florian Lefebvre <[email protected]>
+Co-authored-by: Sarah Rainsberger <[email protected]>
diff --git a/packages/astro/src/transitions/router.ts b/packages/astro/src/transitions/router.ts
@@ -213,7 +213,9 @@ const moveToLocation = (to: URL, from: URL, options: Options, historyState?: Sta
 			// ... what comes next is a intra-page navigation
 			// that won't reload the page but instead scroll to the fragment
 			history.scrollRestoration = 'auto';
-			location.href = to.href;
+			const savedState = history.state;
+			location.href = to.href; // this kills the history state on Firefox
+			history.state || history.replaceState(savedState, ''); // this restores the history state
 		} else {
 			if (!scrolledToTop) {
 				scrollTo({ left: 0, top: 0, behavior: 'instant' });