Merge branch 'main' into version-3

Author: teemingc

.changeset/clear-deer-doubt.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+fix: ensure CSS URL references are absolute when `paths.relative` is `false`

packages/kit/src/exports/vite/index.js

@@ -1232,7 +1232,7 @@ function kit({ svelte_config }) {
 				let new_config;
 
 				if (is_build) {
-					const prefix = `${kit.appDir}/immutable`;
+					const app_immutable = `${kit.appDir}/immutable`;
 
 					/** @type {Record<string, string>} */
 					const server_input = {
@@ -1313,9 +1313,9 @@ function kit({ svelte_config }) {
 
 					/** @type {string} */
 					const base = (kit.paths.assets || kit.paths.base) + '/';
-					const root_to_assets = prefix + '/assets/';
+					const root_to_assets = app_immutable + '/assets/';
 					const assets_to_root =
-						prefix
+						app_immutable
 							.split('/')
 							.map(() => '..')
 							.join('/') + '/../';
@@ -1338,7 +1338,7 @@ function kit({ svelte_config }) {
 							rolldownOptions: {
 								output: {
 									name: `__sveltekit_${version_hash}.app`,
-									assetFileNames: `${prefix}/assets/[name].[hash][extname]`,
+									assetFileNames: `${app_immutable}/assets/[name].[hash][extname]`,
 									hoistTransitiveImports: false,
 									sourcemapIgnoreList
 								},
@@ -1391,8 +1391,8 @@ function kit({ svelte_config }) {
 										input: inline ? client_input['bundle'] : client_input,
 										output: {
 											format: inline ? 'iife' : 'esm',
-											entryFileNames: `${prefix}/[name].[hash].js`,
-											chunkFileNames: `${prefix}/chunks/[hash].js`,
+											entryFileNames: `${app_immutable}/[name].[hash].js`,
+											chunkFileNames: `${app_immutable}/chunks/[hash].js`,
 											codeSplitting:
 												svelte_config.kit.output.bundleStrategy === 'split' ? undefined : false
 										},
@@ -1428,6 +1428,11 @@ function kit({ svelte_config }) {
 									return { relative };
 								}
 
+								if (!relative) return;
+
+								// ensure assets loaded by CSS files are loaded relative to the
+								// CSS file rather than the default of relative to the root
+
 								// _app/immutable/assets files
 								if (filename.startsWith(root_to_assets)) {
 									return `./${filename.slice(root_to_assets.length)}`;

packages/kit/test/apps/options/package.json

@@ -10,7 +10,10 @@
 		"check": "svelte-kit sync -c vite.custom.config.js && tsc && svelte-check --config vite.custom.config.js",
 		"test": "pnpm test:dev && pnpm test:build",
 		"test:dev": "DEV=true playwright test && DEV=true PATHS_ASSETS=https://cdn.example.com/stuff playwright test",
-		"test:build": "playwright test && PATHS_ASSETS=https://cdn.example.com/stuff playwright test",
+		"test:paths-relative:build": "playwright test",
+		"test:paths-absolute:build": "PATHS_RELATIVE=false playwright test",
+		"test:paths-assets:build": "PATHS_ASSETS=https://cdn.example.com/stuff playwright test",
+		"test:build": "pnpm test:paths-relative:build && pnpm test:paths-absolute:build && pnpm test:paths-assets:build",
 		"test:unit": "vitest run --config vite.custom.config.js",
 		"test:server-side-route-resolution:dev": "rm -rf test/errors.json && DEV=true ROUTER_RESOLUTION=server playwright test",
 		"test:server-side-route-resolution:build": "rm -rf test/errors.json && ROUTER_RESOLUTION=server playwright test"

packages/kit/test/apps/options/playwright.config.js

@@ -9,7 +9,8 @@ export default defineConfig({
 		command: process.env.DEV ? `pnpm dev` : `pnpm build && pnpm preview`,
 		env: {
 			ROUTER_RESOLUTION: process.env.ROUTER_RESOLUTION ?? 'client',
-			PATHS_ASSETS: process.env.PATHS_ASSETS ?? ''
+			PATHS_ASSETS: process.env.PATHS_ASSETS ?? '',
+			PATHS_RELATIVE: process.env.PATHS_RELATIVE ?? 'true'
 		}
 	}
 });

…t/apps/options/test/paths-assets.test.js …kit/test/apps/options/test/paths.test.jspackages/kit/test/apps/options/test/paths-assets.test.js renamed to packages/kit/test/apps/options/test/paths.test.js packages/kit/test/apps/options/test/paths-assets.test.js renamed to packages/kit/test/apps/options/test/paths.test.js

@@ -5,7 +5,7 @@ import { test } from '../../../utils.js';
 
 test.describe.configure({ mode: 'parallel' });
 
-test.skip(!!process.env.PATHS_ASSETS);
+test.skip(!!process.env.PATHS_ASSETS || process.env.PATHS_RELATIVE === 'false');
 
 test.describe('CSP', () => {
 	test('blocks script from external site', async ({ page, start_server }) => {

packages/kit/test/apps/options/test/test.js

@@ -44,13 +44,19 @@ const config = {
 			paths: {
 				base: '/path-base',
 				// @ts-expect-error our env var string can't match the https template literal
-				assets: process.env.PATHS_ASSETS || ''
+				assets: process.env.PATHS_ASSETS,
+				relative: process.env.PATHS_RELATIVE !== 'false'
 			},
 			env: {
 				dir: './env-dir'
 			},
 			router: {
 				resolution: /** @type {'client' | 'server'} */ (process.env.ROUTER_RESOLUTION) || 'client'
+			},
+			typescript: {
+				config(config) {
+					config.include.push('../vite.custom.config.js', '../playwright.config.js');
+				}
 			}
 		})
 	],