From 201d32dcfc58ca82468ac9be43b07cdc60abad88 Mon Sep 17 00:00:00 2001
From: Matthew Phillips <matthew@skypack.dev>
Date: Fri, 21 Jul 2023 10:40:36 -0400
Subject: [PATCH] Handle back navigation from page without VT (#7750)

* Handle back navigation from page without VT

* Adding a changeset
---
 .changeset/sixty-peas-join.md                 |  5 ++++
 .../astro/components/ViewTransitions.astro    |  7 ++++-
 packages/astro/e2e/view-transitions.test.js   | 26 +++++++++++++++++++
 3 files changed, 37 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/sixty-peas-join.md

diff --git a/.changeset/sixty-peas-join.md b/.changeset/sixty-peas-join.md
new file mode 100644
index 000000000..62d6d184d
--- /dev/null
+++ b/.changeset/sixty-peas-join.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Trigger full page refresh on back nav from page without VT enabled
diff --git a/packages/astro/components/ViewTransitions.astro b/packages/astro/components/ViewTransitions.astro
index f94383f4d..8b22671b9 100644
--- a/packages/astro/components/ViewTransitions.astro
+++ b/packages/astro/components/ViewTransitions.astro
@@ -128,7 +128,12 @@ const { fallback = 'animate' } = Astro.props as Props;
 			}
 		});
 		window.addEventListener('popstate', () => {
-			if (!transitionEnabledOnThisPage()) return;
+			if (!transitionEnabledOnThisPage()) {
+				// The current page doesn't haven't View Transitions,
+				// respect that with a full page reload
+				location.reload();
+				return;
+			}
 			const nextIndex = history.state?.index ?? currentHistoryIndex + 1;
 			const direction: Direction = nextIndex > currentHistoryIndex ? 'forward' : 'back';
 			navigate(direction, location.href);
diff --git a/packages/astro/e2e/view-transitions.test.js b/packages/astro/e2e/view-transitions.test.js
index f42e21d12..15cc52a0f 100644
--- a/packages/astro/e2e/view-transitions.test.js
+++ b/packages/astro/e2e/view-transitions.test.js
@@ -104,4 +104,30 @@ test.describe('View Transitions', () => {
 			'There should be 2 page loads. The original, then going from 3 to 2'
 		).toEqual(2);
 	});
+
+	test('Moving from a page without ViewTransitions w/ back button', async ({
+		page,
+		astro,
+	}) => {
+		const loads = [];
+		page.addListener('load', (p) => {
+			loads.push(p.title());
+		});
+
+		// Go to page 1
+		await page.goto(astro.resolveUrl('/one'));
+		let p = page.locator('#one');
+		await expect(p, 'should have content').toHaveText('Page 1');
+
+		// Go to page 3 which does *not* have ViewTransitions enabled
+		await page.click('#click-three');
+		p = page.locator('#three');
+		await expect(p, 'should have content').toHaveText('Page 3');
+
+
+		// Back to page 1
+		await page.goBack();
+		p = page.locator('#one');
+		await expect(p, 'should have content').toHaveText('Page 1');
+	});
 });