From 453b486ccdeedbcca811b0c11ad68a5d79908e15 Mon Sep 17 00:00:00 2001 From: Lukas Stracke Date: Wed, 15 Jan 2025 12:20:02 +0100 Subject: [PATCH 1/8] fix: Use `window.fetch` for server load fetch requests --- packages/kit/src/runtime/client/client.js | 6 +++++- packages/kit/src/runtime/client/fetcher.js | 2 +- .../patching-server-load-ii/+page.server.js | 4 ++++ .../patching-server-load-ii/+page.svelte | 11 +++++++++++ .../patching-server-load/+page.server.js | 4 ++++ .../patching-server-load/+page.svelte | 19 +++++++++++++++++++ .../kit/test/apps/basics/test/client.test.js | 19 ++++++++++++++++++- 7 files changed, 62 insertions(+), 3 deletions(-) create mode 100644 packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.server.js create mode 100644 packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.svelte create mode 100644 packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.server.js create mode 100644 packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.svelte diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js index f06e45d2d6e4..22cb5fd8cfb6 100644 --- a/packages/kit/src/runtime/client/client.js +++ b/packages/kit/src/runtime/client/client.js @@ -9,6 +9,7 @@ import { normalize_path } from '../../utils/url.js'; import { + dev_fetch, initial_fetch, lock_fetch, native_fetch, @@ -2548,7 +2549,10 @@ async function load_data(url, invalid) { } data_url.searchParams.append(INVALIDATED_PARAM, invalid.map((i) => (i ? '1' : '0')).join('')); - const res = await native_fetch(data_url.href); + // use window.fetch directly to allow using a 3rd party-patched fetch implementation + const fetcher = DEV ? dev_fetch : window.fetch; + // const fetcher = native_fetch; + const res = await fetcher(data_url.href, {}); if (!res.ok) { // error message is a JSON-stringified string which devalue can't handle at the top level diff --git a/packages/kit/src/runtime/client/fetcher.js b/packages/kit/src/runtime/client/fetcher.js index 6cb8ef1b7724..0fea2989519a 100644 --- a/packages/kit/src/runtime/client/fetcher.js +++ b/packages/kit/src/runtime/client/fetcher.js @@ -137,7 +137,7 @@ export function subsequent_fetch(resource, resolved, opts) { * @param {RequestInfo | URL} resource * @param {RequestInit & Record | undefined} opts */ -function dev_fetch(resource, opts) { +export function dev_fetch(resource, opts) { const patched_opts = { ...opts }; // This assigns the __sveltekit_fetch__ flag and makes it non-enumerable Object.defineProperty(patched_opts, '__sveltekit_fetch__', { diff --git a/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.server.js b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.server.js new file mode 100644 index 000000000000..dc99dd247d79 --- /dev/null +++ b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.server.js @@ -0,0 +1,4 @@ +/** @type {import('./$types').PageLoad} */ +export async function load() { + return { msg: 'server load data' }; +} diff --git a/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.svelte b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.svelte new file mode 100644 index 000000000000..d6fd7711073b --- /dev/null +++ b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.svelte @@ -0,0 +1,11 @@ + + +

+ This page makes a fetch request to the server to get the data from the server load function when + users navigate to it. +

+ +

{data.msg}

diff --git a/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.server.js b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.server.js new file mode 100644 index 000000000000..dc99dd247d79 --- /dev/null +++ b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.server.js @@ -0,0 +1,4 @@ +/** @type {import('./$types').PageLoad} */ +export async function load() { + return { msg: 'server load data' }; +} diff --git a/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.svelte b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.svelte new file mode 100644 index 000000000000..16eefe0e315e --- /dev/null +++ b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.svelte @@ -0,0 +1,19 @@ + + +

+ The sole purpose of this page is to apply a `window.fetch` patch before navigating to the next + page. Click the link below to navigate to the next page with a server load function. +

+ +Go To Page with Server Load diff --git a/packages/kit/test/apps/basics/test/client.test.js b/packages/kit/test/apps/basics/test/client.test.js index 6bdad95dc0fa..0da8d1d5a401 100644 --- a/packages/kit/test/apps/basics/test/client.test.js +++ b/packages/kit/test/apps/basics/test/client.test.js @@ -1,4 +1,4 @@ -import process from 'node:process'; +import process, { execPath } from 'node:process'; import { expect } from '@playwright/test'; import { test } from '../../../utils.js'; @@ -252,6 +252,23 @@ test.describe('Load', () => { expect(logs).toContain('Called a patched window.fetch'); }); + test('permits 3rd party patching of server load fetch requests', async ({ page }) => { + const logs = []; + page.on('console', (msg) => { + if (msg.type() === 'log') { + logs.push(msg.text()); + } + }); + + await page.goto('/load/window-fetch/patching-server-load'); + + await page.getByText('Go To Page with Server Load').click(); + + expect(await page.textContent('h1')).toBe('server load data'); + + expect(logs).toEqual(['Called a patched window.fetch for server load request']); + }); + test('does not repeat fetch on hydration when using Request object', async ({ page }) => { const requests = []; page.on('request', (request) => { From e6fee3be8f874f1400652117a7ba1f30aa6cf935 Mon Sep 17 00:00:00 2001 From: Lukas Stracke Date: Wed, 15 Jan 2025 12:23:29 +0100 Subject: [PATCH 2/8] remove unnecessary export --- packages/kit/src/runtime/client/fetcher.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/kit/src/runtime/client/fetcher.js b/packages/kit/src/runtime/client/fetcher.js index 0fea2989519a..c19c9fc2d837 100644 --- a/packages/kit/src/runtime/client/fetcher.js +++ b/packages/kit/src/runtime/client/fetcher.js @@ -5,7 +5,7 @@ import { b64_decode } from '../utils.js'; let loading = 0; /** @type {typeof fetch} */ -export const native_fetch = BROWSER ? window.fetch : /** @type {any} */ (() => {}); +const native_fetch = BROWSER ? window.fetch : /** @type {any} */ (() => {}); export function lock_fetch() { loading += 1; From a11834e6e2c32ce4674b42c91f187ce64b541d51 Mon Sep 17 00:00:00 2001 From: Lukas Stracke Date: Wed, 15 Jan 2025 12:44:31 +0100 Subject: [PATCH 3/8] changeset --- .changeset/funny-moles-scream.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/funny-moles-scream.md diff --git a/.changeset/funny-moles-scream.md b/.changeset/funny-moles-scream.md new file mode 100644 index 000000000000..28eebe0a6cbe --- /dev/null +++ b/.changeset/funny-moles-scream.md @@ -0,0 +1,5 @@ +--- +'@sveltejs/kit': major +--- + +fix: use current `window.fetch` for server load fetch requests From bc4f933a555211a3e3ff74f88f13fa26a09d70f7 Mon Sep 17 00:00:00 2001 From: Lukas Stracke Date: Wed, 15 Jan 2025 13:30:16 +0100 Subject: [PATCH 4/8] remove unused import --- packages/kit/src/runtime/client/client.js | 9 +-------- 1 file changed, 1 insertion(+), 8 deletions(-) diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js index 22cb5fd8cfb6..769409c5dd2c 100644 --- a/packages/kit/src/runtime/client/client.js +++ b/packages/kit/src/runtime/client/client.js @@ -8,14 +8,7 @@ import { make_trackable, normalize_path } from '../../utils/url.js'; -import { - dev_fetch, - initial_fetch, - lock_fetch, - native_fetch, - subsequent_fetch, - unlock_fetch -} from './fetcher.js'; +import { dev_fetch, initial_fetch, lock_fetch, subsequent_fetch, unlock_fetch } from './fetcher.js'; import { parse } from './parse.js'; import * as storage from './session-storage.js'; import { From f49f26f7e8672d5984a602b3078979c4de20a96c Mon Sep 17 00:00:00 2001 From: Lukas Stracke Date: Wed, 15 Jan 2025 13:36:31 +0100 Subject: [PATCH 5/8] remove accidental import --- packages/kit/test/apps/basics/test/client.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/kit/test/apps/basics/test/client.test.js b/packages/kit/test/apps/basics/test/client.test.js index 0da8d1d5a401..e04070676e44 100644 --- a/packages/kit/test/apps/basics/test/client.test.js +++ b/packages/kit/test/apps/basics/test/client.test.js @@ -1,4 +1,4 @@ -import process, { execPath } from 'node:process'; +import process from 'node:process'; import { expect } from '@playwright/test'; import { test } from '../../../utils.js'; From 054343243c1608670744e0cb58c9ee9104211bd1 Mon Sep 17 00:00:00 2001 From: Lukas Stracke Date: Wed, 15 Jan 2025 13:42:00 +0100 Subject: [PATCH 6/8] cleanup --- .../routes/load/window-fetch/patching-server-load/+page.svelte | 1 - packages/kit/test/apps/basics/test/client.test.js | 2 +- 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.svelte b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.svelte index 16eefe0e315e..69c974f193a8 100644 --- a/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.svelte +++ b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.svelte @@ -2,7 +2,6 @@ import { browser } from '$app/environment'; if (browser) { - console.log('patching window.fetch'); const original_fetch = window.fetch; window.fetch = (input, init) => { console.log('Called a patched window.fetch for server load request'); diff --git a/packages/kit/test/apps/basics/test/client.test.js b/packages/kit/test/apps/basics/test/client.test.js index e04070676e44..769de7704cb2 100644 --- a/packages/kit/test/apps/basics/test/client.test.js +++ b/packages/kit/test/apps/basics/test/client.test.js @@ -266,7 +266,7 @@ test.describe('Load', () => { expect(await page.textContent('h1')).toBe('server load data'); - expect(logs).toEqual(['Called a patched window.fetch for server load request']); + expect(logs).toContain('Called a patched window.fetch for server load request'); }); test('does not repeat fetch on hydration when using Request object', async ({ page }) => { From fcb20db9b9178308df194f75d08a68e05ab038b8 Mon Sep 17 00:00:00 2001 From: Lukas Stracke Date: Wed, 15 Jan 2025 17:32:30 +0100 Subject: [PATCH 7/8] fix lint this time? --- .../load/window-fetch/patching-server-load-ii/+page.server.js | 1 - .../load/window-fetch/patching-server-load-ii/+page.svelte | 1 - .../load/window-fetch/patching-server-load/+page.server.js | 1 - 3 files changed, 3 deletions(-) diff --git a/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.server.js b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.server.js index dc99dd247d79..2c62de9478c9 100644 --- a/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.server.js +++ b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.server.js @@ -1,4 +1,3 @@ -/** @type {import('./$types').PageLoad} */ export async function load() { return { msg: 'server load data' }; } diff --git a/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.svelte b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.svelte index d6fd7711073b..5bd930e96a4f 100644 --- a/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.svelte +++ b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load-ii/+page.svelte @@ -1,5 +1,4 @@ diff --git a/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.server.js b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.server.js index dc99dd247d79..2c62de9478c9 100644 --- a/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.server.js +++ b/packages/kit/test/apps/basics/src/routes/load/window-fetch/patching-server-load/+page.server.js @@ -1,4 +1,3 @@ -/** @type {import('./$types').PageLoad} */ export async function load() { return { msg: 'server load data' }; } From 813f05f3e6bef5786bd1285e884d75def0ed98e2 Mon Sep 17 00:00:00 2001 From: Simon H <5968653+dummdidumm@users.noreply.github.com> Date: Wed, 15 Jan 2025 18:11:32 +0100 Subject: [PATCH 8/8] Apply suggestions from code review --- .changeset/funny-moles-scream.md | 2 +- packages/kit/src/runtime/client/client.js | 1 - 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/.changeset/funny-moles-scream.md b/.changeset/funny-moles-scream.md index 28eebe0a6cbe..0a24a721dde5 100644 --- a/.changeset/funny-moles-scream.md +++ b/.changeset/funny-moles-scream.md @@ -1,5 +1,5 @@ --- -'@sveltejs/kit': major +'@sveltejs/kit': patch --- fix: use current `window.fetch` for server load fetch requests diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js index 769409c5dd2c..c91bb818355b 100644 --- a/packages/kit/src/runtime/client/client.js +++ b/packages/kit/src/runtime/client/client.js @@ -2544,7 +2544,6 @@ async function load_data(url, invalid) { // use window.fetch directly to allow using a 3rd party-patched fetch implementation const fetcher = DEV ? dev_fetch : window.fetch; - // const fetcher = native_fetch; const res = await fetcher(data_url.href, {}); if (!res.ok) {