fix: use correct cache result when fetching same url multiple times (#12355)

* Added test

* Fix

* Changeset

* Update packages/kit/src/runtime/client/fetcher.js

Co-authored-by: Simon H <[email protected]>

---------

Co-authored-by: Simon H <[email protected]>
Co-authored-by: Rich Harris <[email protected]>

Author: 3 people

.changeset/seven-gorillas-protect.md

@@ -0,0 +1,5 @@
+---
+"@sveltejs/kit": patch
+---
+
+fix: use correct cache result when fetching same url multiple times

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

@@ -90,6 +90,7 @@ export function initial_fetch(resource, opts) {
 
 	const script = document.querySelector(selector);
 	if (script?.textContent) {
+		script.remove(); // In case multiple script tags match the same selector
 		let { body, ...init } = JSON.parse(script.textContent);
 
 		const ttl = script.getAttribute('data-ttl');

packages/kit/test/apps/basics/src/routes/load/fetch-same-url/+page.js

@@ -0,0 +1,12 @@
+/** @type {import('@sveltejs/kit').Load} */
+export async function load({ fetch, url }) {
+	const results = [];
+
+	for (let i = 0; i < 3; i++) {
+		const res = await fetch(`${url.origin}/load/fetch-same-url/data.json`);
+		const json = await res.json();
+		results.push(json.result);
+	}
+
+	return { results };
+}

packages/kit/test/apps/basics/src/routes/load/fetch-same-url/+page.svelte

@@ -0,0 +1,5 @@
+<script>
+	export let data;
+</script>
+
+<h1>the result is {data.results.join(',')}</h1>

packages/kit/test/apps/basics/src/routes/load/fetch-same-url/data.json/+server.js

@@ -0,0 +1,9 @@
+import { json } from '@sveltejs/kit';
+
+let result = 0;
+
+/** @type {import('./$types').RequestHandler} */
+export function GET() {
+	result++;
+	return json({ result });
+}

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

@@ -239,6 +239,11 @@ test.describe('Load', () => {
 		expect(requests.filter((r) => !r.includes('/__route.js'))).toEqual([]);
 	});
 
+	test('use correct cache result when fetching same url multiple times', async ({ page }) => {
+		await page.goto('/load/fetch-same-url');
+		expect(await page.textContent('h1')).toBe('the result is 1,2,3');
+	});
+
 	test('permits 3rd party patching of fetch in universal load functions', async ({ page }) => {
 		/** @type {string[]} */
 		const logs = [];