Reuse server data if the client load is invalidated

.changeset/selfish-pigs-pull.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+Reuse server data when the client load is invalidated

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

@@ -656,10 +656,9 @@ export function create_client({ target, base, trailing_slash }) {
 
 	/**
 	 * @param {import('types').ServerDataNode | import('types').ServerDataSkippedNode | null} node
-	 * @param {import('./types').DataNode | null} [previous]
 	 * @returns {import('./types').DataNode | null}
 	 */
-	function create_data_node(node, previous) {
+	function create_data_node(node) {
 		if (node?.type === 'data') {
 			return {
 				type: 'data',
@@ -671,8 +670,6 @@ export function create_client({ target, base, trailing_slash }) {
 					url: !!node.uses.url
 				}
 			};
-		} else if (node?.type === 'skip') {
-			return previous ?? null;
 		}
 		return null;
 	}
@@ -759,6 +756,8 @@ export function create_client({ target, base, trailing_slash }) {
 				throw server_data_node;
 			}
 
+			const prev_server_data_node = (!changed?.url && previous?.server) || null;
+
 			return load_node({
 				loader: loader[1],
 				url,
@@ -771,7 +770,7 @@ export function create_client({ target, base, trailing_slash }) {
 					}
 					return data;
 				},
-				server_data_node: create_data_node(server_data_node, previous?.server)
+				server_data_node: create_data_node(server_data_node) ?? prev_server_data_node
 			});
 		});
 

packages/kit/test/apps/basics/src/routes/load/server-data-reuse/with-client-invalidation/+page.js

@@ -0,0 +1,5 @@
+/** @type {import('./$types').PageLoad} */
+export function load({ data, depends }) {
+	depends('isomorphic-load');
+	return { from_server: data };
+}

packages/kit/test/apps/basics/src/routes/load/server-data-reuse/with-client-invalidation/+page.server.js

@@ -0,0 +1,4 @@
+/** @type {import('./$types').PageServerLoad} */
+export function load() {
+	return { server: true };
+}

packages/kit/test/apps/basics/src/routes/load/server-data-reuse/with-client-invalidation/+page.svelte

@@ -0,0 +1,12 @@
+<script>
+	import { invalidate } from '$app/navigation';
+	import { onMount } from 'svelte';
+
+	export let data;
+
+	onMount(() => invalidate('isomorphic-load'));
+</script>
+
+<p>Page with server load and isomorphic-load</p>
+
+<pre>{JSON.stringify(data.from_server)}</pre>

packages/kit/test/apps/basics/src/routes/load/server-data-reuse/with-server-load/+page.svelte

@@ -6,3 +6,5 @@
 <p>Page with server load</p>
 
 <pre>{JSON.stringify(data)}</pre>
+
+<a href="/load/server-data-reuse/no-load">No load page</a>

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

@@ -377,6 +377,11 @@ test.describe('Load', () => {
 		expect(await page.textContent('pre')).toBe(JSON.stringify({ foo: { bar: 'Custom layout' } }));
 	});
 
+	test('server data is reused if client load is invalidated', async ({ page }) => {
+		await page.goto('/load/server-data-reuse/with-client-invalidation');
+		expect(await page.textContent('pre')).toBe(JSON.stringify({ server: true }));
+	});
+
 	test('load does not call fetch if max-age allows it', async ({ page, request }) => {
 		await request.get('/load/cache-control/reset');