From 3a8a989230525fd911c39c9e78cf41c686cad9d5 Mon Sep 17 00:00:00 2001
From: Martin Trapp <94928215+martrapp@users.noreply.github.com>
Date: Tue, 16 Apr 2024 23:16:32 +0200
Subject: [PATCH 1/2] Fixes an issue with persisted non-text input fields that
 have the focus during view transition navigation.

---
 .changeset/itchy-donuts-destroy.md            |  5 ++++
 .../src/pages/persist-1.astro                 | 26 +++++++++++++++++++
 .../src/pages/persist-2.astro                 | 17 ++++++++++++
 packages/astro/e2e/view-transitions.test.js   | 17 ++++++++++++
 packages/astro/src/transitions/router.ts      |  4 +--
 5 files changed, 67 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/itchy-donuts-destroy.md
 create mode 100644 packages/astro/e2e/fixtures/view-transitions/src/pages/persist-1.astro
 create mode 100644 packages/astro/e2e/fixtures/view-transitions/src/pages/persist-2.astro

diff --git a/.changeset/itchy-donuts-destroy.md b/.changeset/itchy-donuts-destroy.md
new file mode 100644
index 000000000000..655b27a26565
--- /dev/null
+++ b/.changeset/itchy-donuts-destroy.md
@@ -0,0 +1,5 @@
+---
+"astro": patch
+---
+
+Fixes an issue with persisted non-text input fields that have the focus during view transition navigation.
diff --git a/packages/astro/e2e/fixtures/view-transitions/src/pages/persist-1.astro b/packages/astro/e2e/fixtures/view-transitions/src/pages/persist-1.astro
new file mode 100644
index 000000000000..830667b3e635
--- /dev/null
+++ b/packages/astro/e2e/fixtures/view-transitions/src/pages/persist-1.astro
@@ -0,0 +1,26 @@
+---
+import Layout from '../components/Layout.astro';
+---
+<Layout>
+	<p id="one">Persist 1</p>
+	<form transition:persist="form" action="/persist-2">
+		<input type="text" name="name" />
+		<input type="checkbox" />
+	</form>
+	<div id="test">test content</div>
+</Layout>
+<script>
+	const input = document.querySelector<HTMLInputElement>("form input")!;
+	input.focus();
+	input.value = "some cool text";
+	input.selectionStart=5;
+	input.selectionEnd=9;
+
+	document.addEventListener('astro:after-swap', () => {
+		const textInput = document.querySelector<HTMLInputElement>("form input:first-of-type")!;
+		console.log(textInput === document.activeElement, textInput.value, textInput.selectionStart, textInput.selectionEnd);
+		const checkBox = document.querySelector<HTMLInputElement>("form input:nth-of-type(2)")!;
+		checkBox.checked = true;
+		checkBox.focus();
+	}, {once:true});
+</script>
diff --git a/packages/astro/e2e/fixtures/view-transitions/src/pages/persist-2.astro b/packages/astro/e2e/fixtures/view-transitions/src/pages/persist-2.astro
new file mode 100644
index 000000000000..f79dedcd5ed6
--- /dev/null
+++ b/packages/astro/e2e/fixtures/view-transitions/src/pages/persist-2.astro
@@ -0,0 +1,17 @@
+---
+import Layout from '../components/Layout.astro';
+---
+<Layout>
+	<p id="two">Persist 2</p>
+	<a id="click-persist-one" href="/persist-1">go to 3</a>
+	<div transition:persist="form"/>
+	<div id="test">test content</div>
+</Layout>
+<script>
+	document.addEventListener('astro:after-swap', () => {
+		const checkBox = document.querySelector<HTMLInputElement>("form input:nth-of-type(2)")!;
+		console.log(checkBox === document.activeElement, checkBox.checked);
+	}, {once:true});
+</script>
+
+
diff --git a/packages/astro/e2e/view-transitions.test.js b/packages/astro/e2e/view-transitions.test.js
index b963bf2fd7f4..14cb8668d236 100644
--- a/packages/astro/e2e/view-transitions.test.js
+++ b/packages/astro/e2e/view-transitions.test.js
@@ -1403,3 +1403,20 @@ test.describe('View Transitions', () => {
 		).toEqual(0);
 	});
 });
+
+test('transition:persist persists selection', async ({ page, astro }) => {
+	let text = "";
+	page.on('console', (msg) => {
+		text=msg.text();
+	});
+	await page.goto(astro.resolveUrl('/persist-1'));
+	await expect(page.locator('#one'), 'should have content').toHaveText('Persist 1');
+	// go to page 2
+	await page.press('input[name="name"]', 'Enter');
+	await expect(page.locator('#two'), 'should have content').toHaveText('Persist 2');
+	expect(text).toBe('true some cool text 5 9');
+
+	await page.goBack();
+	await expect(page.locator('#one'), 'should have content').toHaveText('Persist 1');
+	expect(text).toBe('true true');
+});
diff --git a/packages/astro/src/transitions/router.ts b/packages/astro/src/transitions/router.ts
index e0ffb4d7eef4..1e97fa1c898f 100644
--- a/packages/astro/src/transitions/router.ts
+++ b/packages/astro/src/transitions/router.ts
@@ -305,8 +305,8 @@ async function updateDOM(
 				activeElement instanceof HTMLInputElement ||
 				activeElement instanceof HTMLTextAreaElement
 			) {
-				activeElement.selectionStart = start!;
-				activeElement.selectionEnd = end!;
+				start && (activeElement.selectionStart = start);
+				end && (activeElement.selectionEnd = end);
 			}
 		}
 	};

From 53177987632596778b2f248a2c094efefa3a7edb Mon Sep 17 00:00:00 2001
From: Martin Trapp <94928215+martrapp@users.noreply.github.com>
Date: Tue, 16 Apr 2024 23:31:16 +0200
Subject: [PATCH 2/2] better check

---
 packages/astro/src/transitions/router.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/astro/src/transitions/router.ts b/packages/astro/src/transitions/router.ts
index 1e97fa1c898f..a5d06d5c769c 100644
--- a/packages/astro/src/transitions/router.ts
+++ b/packages/astro/src/transitions/router.ts
@@ -305,8 +305,8 @@ async function updateDOM(
 				activeElement instanceof HTMLInputElement ||
 				activeElement instanceof HTMLTextAreaElement
 			) {
-				start && (activeElement.selectionStart = start);
-				end && (activeElement.selectionEnd = end);
+				if (typeof start === 'number') activeElement.selectionStart = start;
+				if (typeof end === 'number') activeElement.selectionEnd = end;
 			}
 		}
 	};