breaking: undefined is no longer a valid value for paths.relative (#1…

…1185) Co-authored-by: Rich Harris <[email protected]> Co-authored-by: Rich Harris <[email protected]>
sveltejs · Dec 10, 2023 · 61626de · 61626de
1 parent ffca61d
commit 61626de
Show file tree

Hide file tree

Showing 6 changed files with 23 additions and 29 deletions.
diff --git a/.changeset/tall-suns-protect.md b/.changeset/tall-suns-protect.md
@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': major
+---
+
+breaking: undefined is no longer a valid value for paths.relative
diff --git a/packages/kit/src/core/config/index.spec.js b/packages/kit/src/core/config/index.spec.js
@@ -99,7 +99,7 @@ const get_defaults = (prefix = '') => ({
 		paths: {
 			base: '',
 			assets: '',
-			relative: undefined
+			relative: true
 		},
 		prerender: {
 			concurrency: 1,
@@ -318,7 +318,7 @@ validate_paths(
 	{
 		base: '/path/to/base',
 		assets: '',
-		relative: undefined
+		relative: true
 	}
 );
 
@@ -330,7 +330,7 @@ validate_paths(
 	{
 		base: '',
 		assets: 'https://cdn.example.com',
-		relative: undefined
+		relative: true
 	}
 );
 
@@ -343,7 +343,7 @@ validate_paths(
 	{
 		base: '/path/to/base',
 		assets: 'https://cdn.example.com',
-		relative: undefined
+		relative: true
 	}
 );
 

diff --git a/packages/kit/src/core/config/options.js b/packages/kit/src/core/config/options.js
@@ -174,13 +174,7 @@ const options = object(
 
 					return input;
 				}),
-				relative: validate(undefined, (input, keypath) => {
-					if (typeof input !== 'boolean') {
-						throw new Error(`${keypath} option must be a boolean or undefined`);
-					}
-
-					return input;
-				})
+				relative: boolean(true)
 			}),
 
 			prerender: object({

diff --git a/packages/kit/src/exports/public.d.ts b/packages/kit/src/exports/public.d.ts
@@ -463,15 +463,18 @@ export interface KitConfig {
 		 */
 		base?: '' | `/${string}`;
 		/**
-		 * Whether to use relative asset paths. By default, if `paths.assets` is not external, SvelteKit will replace `%sveltekit.assets%` with a relative path and use relative paths to reference build artifacts, but `base` and `assets` imported from `$app/paths` will be as specified in your config.
+		 * Whether to use relative asset paths.
 		 *
-		 * If `true`, `base` and `assets` imported from `$app/paths` will be replaced with relative asset paths during server-side rendering, resulting in portable HTML.
+		 * If `true`, `base` and `assets` imported from `$app/paths` will be replaced with relative asset paths during server-side rendering, resulting in more portable HTML.
 		 * If `false`, `%sveltekit.assets%` and references to build artifacts will always be root-relative paths, unless `paths.assets` is an external URL
 		 *
 		 * If your app uses a `<base>` element, you should set this to `false`, otherwise asset URLs will incorrectly be resolved against the `<base>` URL rather than the current page.
-		 * @default undefined
+		 *
+		 * In 1.0, `undefined` was a valid value, which was set by default. In that case, if `paths.assets` was not external, SvelteKit would replace `%sveltekit.assets%` with a relative path and use relative paths to reference build artifacts, but `base` and `assets` imported from `$app/paths` would be as specified in your config.
+		 *
+		 * @default true
 		 */
-		relative?: boolean | undefined;
+		relative?: boolean;
 	};
 	/**
 	 * See [Prerendering](https://kit.svelte.dev/docs/page-options#prerender).

diff --git a/packages/kit/src/runtime/server/page/render.js b/packages/kit/src/runtime/server/page/render.js
@@ -95,7 +95,7 @@ export async function render_response({
 	let base_expression = s(paths.base);
 
 	// if appropriate, use relative paths for greater portability
-	if (paths.relative !== false && !state.prerendering?.fallback) {
+	if (paths.relative && !state.prerendering?.fallback) {
 		const segments = event.url.pathname.slice(paths.base.length).split('/').slice(2);
 
 		base = segments.map(() => '..').join('/') || '.';

diff --git a/packages/kit/test/apps/basics/test/test.js b/packages/kit/test/apps/basics/test/test.js
@@ -642,24 +642,16 @@ test.describe('$app/environment', () => {
 });
 
 test.describe('$app/paths', () => {
-	test('includes paths', async ({ page }) => {
+	test('includes paths', async ({ page, javaScriptEnabled }) => {
 		await page.goto('/paths');
 
-		expect(await page.innerHTML('pre')).toBe(
-			JSON.stringify({
-				base: '',
-				assets: ''
-			})
-		);
+		let base = javaScriptEnabled ? '' : '.';
+		expect(await page.innerHTML('pre')).toBe(JSON.stringify({ base, assets: base }));
 
 		await page.goto('/paths/deeply/nested');
 
-		expect(await page.innerHTML('pre')).toBe(
-			JSON.stringify({
-				base: '',
-				assets: ''
-			})
-		);
+		base = javaScriptEnabled ? '' : '../..';
+		expect(await page.innerHTML('pre')).toBe(JSON.stringify({ base, assets: base }));
 	});
 
 	// some browsers will re-request assets after a `pushState`