fix: create new URL when calling goto(...), to handle case where UR…

…L is mutated (#13196)

* fix: create new URL when calling `goto(...)`, to handle case where URL is mutated

* add test

* format

---------

Co-authored-by: Chew Tee Ming <[email protected]>

.changeset/smooth-weeks-rhyme.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+fix: create new URL when calling `goto(...)`, to handle case where URL is mutated

packages/kit/src/runtime/client/client.js

@@ -1800,7 +1800,7 @@ export function goto(url, opts = {}) {
 		throw new Error('Cannot call goto(...) on the server');
 	}
 
-	url = resolve_url(url);
+	url = new URL(resolve_url(url));
 
 	if (url.origin !== origin) {
 		return Promise.reject(

packages/kit/test/apps/basics/src/routes/state/url/+page.svelte

@@ -0,0 +1,16 @@
+<script>
+	import { page } from '$app/state';
+	import { goto } from '$app/navigation';
+
+	const q = $derived(page.url.searchParams.get('q') || undefined);
+</script>
+
+<button
+	type="button"
+	onclick={() => {
+		page.url.searchParams.set('q', 'test');
+		goto(page.url);
+	}}>test</button
+>
+
+<p>{`${q}`}</p>

packages/kit/test/apps/basics/test/client.test.js

@@ -421,6 +421,13 @@ test.describe('$app/state', () => {
 		await app.goto('/state/data/state-update/same-keys');
 		await expect(page.locator('p')).toHaveText('page.data was updated 1 time(s)');
 	});
+
+	test('page.url does update when used with goto', async ({ page }) => {
+		await page.goto('/state/url');
+		await expect(page.locator('p')).toHaveText('undefined');
+		await page.locator('button').click();
+		await expect(page.locator('p')).toHaveText('test');
+	});
 });
 
 test.describe('Invalidation', () => {