fix: clone page.params in Pyramid component

.changeset/modern-clowns-bet.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+Cloned page.params in Pyramid component for Svelte 5+ to prevent async updates from clearing them.

packages/kit/src/core/sync/write_root.js

@@ -25,7 +25,7 @@ export function write_root(manifest_data, output) {
 	${
 		isSvelte5Plus()
 			? `<!-- svelte-ignore binding_property_non_reactive -->
-		<Pyramid_${l} bind:this={components[${l}]} data={data_${l}} {form} params={page.params} />`
+		<Pyramid_${l} bind:this={components[${l}]} data={data_${l}} {form} params={{...page.params}} />`
 			: `<svelte:component this={constructors[${l}]} bind:this={components[${l}]} data={data_${l}} {form} params={page.params} />`
 	}`;
 
@@ -36,7 +36,7 @@ export function write_root(manifest_data, output) {
 					isSvelte5Plus()
 						? dedent`{@const Pyramid_${l} = constructors[${l}]}
 						<!-- svelte-ignore binding_property_non_reactive -->
-						<Pyramid_${l} bind:this={components[${l}]} data={data_${l}} {form} params={page.params}>
+						<Pyramid_${l} bind:this={components[${l}]} data={data_${l}} {form} params={{...page.params}}>
 							${pyramid}
 						</Pyramid_${l}>`
 						: dedent`<svelte:component this={constructors[${l}]} bind:this={components[${l}]} data={data_${l}} params={page.params}>
@@ -50,7 +50,7 @@ export function write_root(manifest_data, output) {
 						? dedent`
 					{@const Pyramid_${l} = constructors[${l}]}
 					<!-- svelte-ignore binding_property_non_reactive -->
-					<Pyramid_${l} bind:this={components[${l}]} data={data_${l}} {form} params={page.params} />
+					<Pyramid_${l} bind:this={components[${l}]} data={data_${l}} {form} params={{...page.params}} />
 					`
 						: dedent`<svelte:component this={constructors[${l}]} bind:this={components[${l}]} data={data_${l}} {form} params={page.params} />`
 				}

packages/kit/test/apps/basics/src/routes/params-prop-async/+layout.svelte

@@ -0,0 +1,8 @@
+<script>
+	let { children } = $props();
+</script>
+
+<a href="/params-prop-async/123" data-sveltekit-preload-data="hover">123</a>
+<a href="/params-prop-async/456" data-sveltekit-preload-data="hover">456</a>
+
+{@render children()}

packages/kit/test/apps/basics/src/routes/params-prop-async/[x]/+page.svelte

@@ -0,0 +1,7 @@
+<script>
+	let { params } = $props();
+
+	await Promise.resolve();
+</script>
+
+<p>x: {params.x}</p>

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

@@ -2039,6 +2039,27 @@ test.describe('params prop', () => {
 	});
 });
 
+test.describe('params prop async', () => {
+	test('params prop is passed to the page and persists after async updates', async ({
+		page,
+		clicknav
+	}) => {
+		await page.goto('/params-prop-async');
+
+		await page.hover('[href="/params-prop-async/123"]');
+		await page.waitForTimeout(100);
+		await clicknav('[href="/params-prop-async/123"]');
+		await page.waitForTimeout(100);
+		await expect(page.locator('p')).toHaveText('x: 123');
+
+		await page.hover('[href="/params-prop-async/456"]');
+		await page.waitForTimeout(100);
+		await clicknav('[href="/params-prop-async/456"]');
+		await page.waitForTimeout(100);
+		await expect(page.locator('p')).toHaveText('x: 456');
+	});
+});
+
 test.describe('service worker option', () => {
 	test('pass the options to the service worker', async ({ page }) => {
 		await page.goto('/');