Skip to content

Commit 207528e

Browse files
chargomeclaude
chargome
and
claude
authored
test(sveltekit): Add SvelteKit 3 e2e app (#21540)
Adds a dedicated e2e test application for SvelteKit 3 so we can guard Kit 3 compatibility as the framework moves toward a stable release. It mirrors the existing `sveltekit-2` app's coverage (client/server errors, tracing, load functions, form actions, server routes) against `@sveltejs/kit@next`. Still optional atm, tests will be unskipped with the follow up prs ref #21502 --------- Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
1 parent 00df5fc commit 207528e

56 files changed

Lines changed: 1437 additions & 0 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎dev-packages/e2e-tests/test-applications/sveltekit-3/.gitignore‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
.DS_Store
2+
node_modules
3+
/build
4+
/.svelte-kit
5+
/package
6+
.env
7+
.env.*
8+
!.env.example
9+
vite.config.js.timestamp-*
10+
vite.config.ts.timestamp-*

‎dev-packages/e2e-tests/test-applications/sveltekit-3/package.json‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
{
2+
"name": "sveltekit-3",
3+
"version": "0.0.1",
4+
"private": true,
5+
"scripts": {
6+
"dev": "vite dev",
7+
"build": "vite build",
8+
"preview": "vite preview",
9+
"proxy": "node start-event-proxy.mjs",
10+
"clean": "npx rimraf node_modules pnpm-lock.yaml",
11+
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
12+
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
13+
"test:prod": "TEST_ENV=production playwright test",
14+
"test:build": "pnpm install && pnpm build",
15+
"test:assert": "pnpm test:prod"
16+
},
17+
"dependencies": {
18+
"@sentry/sveltekit": "file:../../packed/sentry-sveltekit-packed.tgz"
19+
},
20+
"devDependencies": {
21+
"@playwright/test": "~1.56.0",
22+
"@sentry-internal/test-utils": "link:../../../test-utils",
23+
"@sveltejs/adapter-auto": "next",
24+
"@sveltejs/adapter-node": "next",
25+
"@sveltejs/kit": "next",
26+
"@sveltejs/vite-plugin-svelte": "^7.1.2",
27+
"svelte": "^5.48.0",
28+
"svelte-check": "^4.6.0",
29+
"typescript": "^6.0.0",
30+
"vite": "^8.0.0"
31+
},
32+
"volta": {
33+
"node": "22.20.0",
34+
"extends": "../../package.json"
35+
},
36+
"sentryTest": {
37+
"optional": true
38+
},
39+
"type": "module"
40+
}

‎dev-packages/e2e-tests/test-applications/sveltekit-3/playwright.config.mjs‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { getPlaywrightConfig } from '@sentry-internal/test-utils';
2+
3+
const testEnv = process.env.TEST_ENV;
4+
5+
if (!testEnv) {
6+
throw new Error('No test env defined');
7+
}
8+
9+
const config = getPlaywrightConfig({
10+
startCommand: testEnv === 'development' ? `pnpm dev --port 3030` : `node build`,
11+
});
12+
13+
export default config;

‎dev-packages/e2e-tests/test-applications/sveltekit-3/src/app.d.ts‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
// See https://kit.svelte.dev/docs/types#app
2+
// for information about these interfaces
3+
declare global {
4+
namespace App {
5+
// interface Error {}
6+
// interface Locals {}
7+
// interface PageData {}
8+
// interface PageState {}
9+
// interface Platform {}
10+
}
11+
}
12+
13+
export {};

‎dev-packages/e2e-tests/test-applications/sveltekit-3/src/app.html‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
6+
<meta name="viewport" content="width=device-width" />
7+
%sveltekit.head%
8+
</head>
9+
<body data-sveltekit-preload-data="off">
10+
<div style="display: contents">%sveltekit.body%</div>
11+
</body>
12+
</html>

‎dev-packages/e2e-tests/test-applications/sveltekit-3/src/env.ts‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { defineEnvVars } from '@sveltejs/kit/hooks';
2+
3+
// SvelteKit 3 makes "explicit environment variables" the default and removes the
4+
// legacy `$env/*` virtual modules. Declared vars are imported from `$app/env/private`
5+
// (server only) and `$app/env/public` (client-safe).
6+
export const variables = defineEnvVars({
7+
// `static: true` inlines the value at build time (the value is present in the
8+
// build environment). A dynamic private var (`{}`) currently resolves to
9+
// `undefined` at runtime under Kit 3's adapter-node, even though it is set in
10+
// `process.env` — so the DSN would never reach the server SDK.
11+
E2E_TEST_DSN: { static: true },
12+
PUBLIC_E2E_TEST_DSN: { public: true },
13+
});

‎dev-packages/e2e-tests/test-applications/sveltekit-3/src/hooks.client.ts‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { PUBLIC_E2E_TEST_DSN } from '$app/env/public';
2+
import * as Sentry from '@sentry/sveltekit';
3+
4+
Sentry.init({
5+
environment: 'qa', // dynamic sampling bias to keep transactions
6+
dsn: PUBLIC_E2E_TEST_DSN,
7+
tunnel: `http://localhost:3031/`, // proxy server
8+
tracesSampleRate: 1.0,
9+
});
10+
11+
const myErrorHandler = ({ error, event }: any) => {
12+
console.error('An error occurred on the client side:', error, event);
13+
};
14+
15+
export const handleError = Sentry.handleErrorWithSentry(myErrorHandler);

‎dev-packages/e2e-tests/test-applications/sveltekit-3/src/hooks.server.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import * as Sentry from '@sentry/sveltekit';
2+
import { sequence } from '@sveltejs/kit/hooks';
3+
4+
// not logging anything to console to avoid noise in the test output
5+
export const handleError = Sentry.handleErrorWithSentry(() => {});
6+
7+
export const handle = sequence(Sentry.sentryHandle());

‎dev-packages/e2e-tests/test-applications/sveltekit-3/src/instrumentation.server.ts‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { E2E_TEST_DSN } from '$app/env/private';
2+
import * as Sentry from '@sentry/sveltekit';
3+
4+
// With SvelteKit 3 native instrumentation enabled (`experimental.instrumentation.server`),
5+
// `Sentry.init` runs here instead of in `hooks.server.ts`.
6+
Sentry.init({
7+
environment: 'qa', // dynamic sampling bias to keep transactions
8+
dsn: E2E_TEST_DSN,
9+
debug: !!process.env.DEBUG,
10+
tunnel: `http://localhost:3031/`, // proxy server
11+
tracesSampleRate: 1.0,
12+
});

‎dev-packages/e2e-tests/test-applications/sveltekit-3/src/routes/+layout.svelte‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<script lang="ts">
2+
import { onMount } from "svelte";
3+
4+
import { navigating } from "$app/stores";
5+
6+
onMount(() => {
7+
// Indicate that the SvelteKit app was hydrated
8+
document.body.classList.add("hydrated");
9+
});
10+
11+
12+
</script>
13+
14+
<h1>Sveltekit E2E Test app</h1>
15+
<div data-sveltekit-preload-data="off">
16+
<slot></slot>
17+
</div>

0 commit comments

Comments
 (0)