diff --git a/.changeset/mighty-kiwis-laugh.md b/.changeset/mighty-kiwis-laugh.md
new file mode 100644
index 000000000000..6b7869bbc2a7
--- /dev/null
+++ b/.changeset/mighty-kiwis-laugh.md
@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+fix: correctly preload links on `mousedown`/`touchstart`
diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js
index def673a01d20..16cecc7fe092 100644
--- a/packages/kit/src/runtime/client/client.js
+++ b/packages/kit/src/runtime/client/client.js
@@ -1677,8 +1677,6 @@ function setup_preload() {
const a = find_anchor(element, container);
if (!a || a === current_a) return;
- current_a = a;
-
const { url, external, download } = get_link_info(a, base, app.hash);
if (external || download) return;
@@ -1689,6 +1687,7 @@ function setup_preload() {
if (!options.reload && !same_url) {
if (priority <= options.preload_data) {
+ current_a = a;
const intent = await get_navigation_intent(url, false);
if (intent) {
if (DEV) {
@@ -1707,6 +1706,7 @@ function setup_preload() {
}
}
} else if (priority <= options.preload_code) {
+ current_a = a;
void _preload_code(/** @type {URL} */ (url));
}
}
diff --git a/packages/kit/test/apps/basics/src/routes/data-sveltekit/preload-code/+page.svelte b/packages/kit/test/apps/basics/src/routes/data-sveltekit/preload-code/+page.svelte
index dbe1987a91d8..55687b739bfd 100644
--- a/packages/kit/test/apps/basics/src/routes/data-sveltekit/preload-code/+page.svelte
+++ b/packages/kit/test/apps/basics/src/routes/data-sveltekit/preload-code/+page.svelte
@@ -1,3 +1,7 @@
+eager
+
three
+
+tap
diff --git a/packages/kit/test/apps/basics/test/client.test.js b/packages/kit/test/apps/basics/test/client.test.js
index 53f16cc2b158..df67597356a2 100644
--- a/packages/kit/test/apps/basics/test/client.test.js
+++ b/packages/kit/test/apps/basics/test/client.test.js
@@ -827,32 +827,56 @@ test.describe('Invalidation', () => {
test.describe('data-sveltekit attributes', () => {
test('data-sveltekit-preload-code', async ({ page }) => {
/** @type {string[]} */
- const requests = [];
- page.on('request', (r) => {
- requests.push(r.url());
+ const responses = [];
+
+ const nodes_location = process.env.DEV
+ ? '.svelte-kit/generated/client/nodes/'
+ : '/_app/immutable/nodes/';
+
+ page.on('response', async (response) => {
+ const url = response.url();
+ if (url.includes(nodes_location)) {
+ responses.push(url);
+ }
});
// eager
await page.goto('/data-sveltekit/preload-code');
- expect(requests.length).toBeGreaterThanOrEqual(1);
+ await page.locator('#eager').hover();
+ await page.locator('#eager').dispatchEvent('touchstart');
+ // expect 4 nodes on initial load: root layout, root error, current page, and eager preload
+ expect(responses.length).toEqual(4);
// viewport
- requests.length = 0;
+ responses.length = 0;
page.locator('#viewport').scrollIntoViewIfNeeded();
- await Promise.all([page.waitForTimeout(100), page.waitForLoadState('networkidle')]);
- expect(requests.length).toBeGreaterThanOrEqual(1);
+ await page.locator('#viewport').hover();
+ await page.locator('#viewport').dispatchEvent('touchstart');
+ await Promise.all([
+ page.waitForTimeout(100), // wait for preloading to start
+ page.waitForLoadState('networkidle') // wait for preloading to finish
+ ]);
+ expect(responses.length).toEqual(1);
// hover
- requests.length = 0;
- await page.locator('#hover').dispatchEvent('mousemove');
- await Promise.all([page.waitForTimeout(100), page.waitForLoadState('networkidle')]);
- expect(requests.length).toBeGreaterThanOrEqual(1);
+ responses.length = 0;
+ await page.locator('#hover').hover();
+ await page.locator('#hover').dispatchEvent('touchstart');
+ await Promise.all([
+ page.waitForTimeout(100), // wait for preloading to start
+ page.waitForLoadState('networkidle') // wait for preloading to finish
+ ]);
+ expect(responses.length).toEqual(1);
// tap
- requests.length = 0;
+ responses.length = 0;
+ await page.locator('#tap').hover();
await page.locator('#tap').dispatchEvent('touchstart');
- await Promise.all([page.waitForTimeout(100), page.waitForLoadState('networkidle')]);
- expect(requests.length).toBeGreaterThanOrEqual(1);
+ await Promise.all([
+ page.waitForTimeout(100), // wait for preloading to start
+ page.waitForLoadState('networkidle') // wait for preloading to finish
+ ]);
+ expect(responses.length).toEqual(1);
});
test('data-sveltekit-preload-data', async ({ page }) => {
@@ -875,7 +899,7 @@ test.describe('data-sveltekit attributes', () => {
});
await page.goto('/data-sveltekit/preload-data');
- await page.locator('#one').dispatchEvent('mousemove');
+ await page.locator('#one').hover();
await Promise.all([
page.waitForTimeout(100), // wait for preloading to start
page.waitForLoadState('networkidle') // wait for preloading to finish
@@ -884,7 +908,7 @@ test.describe('data-sveltekit attributes', () => {
requests.length = 0;
await page.goto('/data-sveltekit/preload-data');
- await page.locator('#two').dispatchEvent('mousemove');
+ await page.locator('#two').hover();
await Promise.all([
page.waitForTimeout(100), // wait for preloading to start
page.waitForLoadState('networkidle') // wait for preloading to finish
@@ -893,12 +917,22 @@ test.describe('data-sveltekit attributes', () => {
requests.length = 0;
await page.goto('/data-sveltekit/preload-data');
- await page.locator('#three').dispatchEvent('mousemove');
+ await page.locator('#three').hover();
await Promise.all([
page.waitForTimeout(100), // wait for preloading to start
page.waitForLoadState('networkidle') // wait for preloading to finish
]);
expect(requests.length).toBe(0);
+
+ requests.length = 0;
+ await page.goto('/data-sveltekit/preload-data');
+ await page.locator('#tap').hover();
+ await page.locator('#tap').dispatchEvent('touchstart');
+ await Promise.all([
+ page.waitForTimeout(100), // wait for preloading to start
+ page.waitForLoadState('networkidle') // wait for preloading to finish
+ ]);
+ expect(requests.length).toBe(1);
});
test('data-sveltekit-preload-data network failure does not trigger navigation', async ({