@sveltejs/kit 1.1.1 → 1.1.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sveltejs/kit",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "repository": {
     "type": "git",
     "url": "https://github.com/sveltejs/kit",

package/src/cli.js

@@ -24,7 +24,7 @@ const prog = sade('svelte-kit').version(pkg.version);
 
 prog
 	.command('sync')
-	.describe('Synchronise generated files')
+	.describe('Synchronise generated type definitions')
 	.option('--mode', 'Specify a mode for loading environment variables', 'development')
 	.action(async ({ mode }) => {
 		if (!fs.existsSync('svelte.config.js')) {
@@ -35,7 +35,7 @@ prog
 		try {
 			const config = await load_config();
 			const sync = await import('./core/sync/sync.js');
-			await sync.all(config, mode);
+			await sync.all_types(config, mode);
 		} catch (error) {
 			handle_error(error);
 		}

package/src/core/sync/sync.js

@@ -51,7 +51,7 @@ export async function update(config, manifest_data, file) {
 }
 
 /**
- * Run sync.init and sync.update in series, returning the result from sync.update.
+ * Run sync.init and sync.create in series, returning the result from sync.create.
  * @param {import('types').ValidatedConfig} config
  * @param {string} mode The Vite mode
  */
@@ -60,6 +60,17 @@ export async function all(config, mode) {
 	return await create(config);
 }
 
+/**
+ * Run sync.init and then generate all type files.
+ * @param {import('types').ValidatedConfig} config
+ * @param {string} mode The Vite mode
+ */
+export async function all_types(config, mode) {
+	init(config, mode);
+	const manifest_data = create_manifest_data({ config });
+	await write_all_types(config, manifest_data);
+}
+
 /**
  * Regenerate server-internal.js in response to src/{app.html,error.html,service-worker.js} changing
  * @param {import('types').ValidatedConfig} config

package/src/core/sync/write_tsconfig.js

@@ -35,19 +35,48 @@ function remove_trailing_slashstar(file) {
 
 /**
  * Writes the tsconfig that the user's tsconfig inherits from.
- * @param {import('types').ValidatedKitConfig} config
+ * @param {import('types').ValidatedKitConfig} kit
  */
-export function write_tsconfig(config, cwd = process.cwd()) {
-	const out = path.join(config.outDir, 'tsconfig.json');
-	const user_file = maybe_file(cwd, 'tsconfig.json') || maybe_file(cwd, 'jsconfig.json');
+export function write_tsconfig(kit, cwd = process.cwd()) {
+	const out = path.join(kit.outDir, 'tsconfig.json');
+
+	const user_config = load_user_tsconfig(cwd);
+	if (user_config) validate_user_config(kit, cwd, out, user_config);
+
+	// only specify baseUrl if a) the user doesn't specify their own baseUrl
+	// and b) they have non-relative paths. this causes problems with auto-imports,
+	// so we print a suggestion that they use relative paths instead
+	// TODO(v2): never include base URL, and skip the check below
+	let include_base_url = false;
+
+	if (user_config && !user_config.options.compilerOptions?.baseUrl) {
+		const non_relative_paths = new Set();
+		for (const paths of Object.values(user_config?.options.compilerOptions?.paths || {})) {
+			for (const path of paths) {
+				if (!path.startsWith('.')) non_relative_paths.add(path);
+			}
+		}
+
+		if (non_relative_paths.size) {
+			include_base_url = true;
 
-	if (user_file) validate(config, cwd, out, user_file);
+			console.log(colors.bold().yellow('Please replace non-relative compilerOptions.paths:\n'));
+
+			for (const path of non_relative_paths) {
+				console.log(`  - "${path}" -> "./${path}"`);
+			}
+
+			console.log(
+				'\nDoing so allows us to omit "baseUrl" — which causes problems with imports — from the generated tsconfig.json. See https://github.com/sveltejs/kit/pull/8437 for more information.'
+			);
+		}
+	}
 
 	/** @param {string} file */
-	const config_relative = (file) => posixify(path.relative(config.outDir, file));
+	const config_relative = (file) => posixify(path.relative(kit.outDir, file));
 
 	const include = ['ambient.d.ts', './types/**/$types.d.ts', config_relative('vite.config.ts')];
-	for (const dir of [config.files.routes, config.files.lib]) {
+	for (const dir of [kit.files.routes, kit.files.lib]) {
 		const relative = project_relative(path.dirname(dir));
 		include.push(config_relative(`${relative}/**/*.js`));
 		include.push(config_relative(`${relative}/**/*.ts`));
@@ -61,12 +90,12 @@ export function write_tsconfig(config, cwd = process.cwd()) {
 	include.push(config_relative(`${test_folder}/**/*.svelte`));
 
 	const exclude = [config_relative('node_modules/**'), './[!ambient.d.ts]**'];
-	if (path.extname(config.files.serviceWorker)) {
-		exclude.push(config_relative(config.files.serviceWorker));
+	if (path.extname(kit.files.serviceWorker)) {
+		exclude.push(config_relative(kit.files.serviceWorker));
 	} else {
-		exclude.push(config_relative(`${config.files.serviceWorker}.js`));
-		exclude.push(config_relative(`${config.files.serviceWorker}.ts`));
-		exclude.push(config_relative(`${config.files.serviceWorker}.d.ts`));
+		exclude.push(config_relative(`${kit.files.serviceWorker}.js`));
+		exclude.push(config_relative(`${kit.files.serviceWorker}.ts`));
+		exclude.push(config_relative(`${kit.files.serviceWorker}.d.ts`));
 	}
 
 	write_if_changed(
@@ -75,8 +104,8 @@ export function write_tsconfig(config, cwd = process.cwd()) {
 			{
 				compilerOptions: {
 					// generated options
-					baseUrl: config_relative('.'),
-					paths: get_tsconfig_paths(config),
+					baseUrl: include_base_url ? config_relative('.') : undefined,
+					paths: get_tsconfig_paths(kit, include_base_url),
 					rootDirs: [config_relative('.'), './types'],
 
 					// essential options
@@ -105,43 +134,56 @@ export function write_tsconfig(config, cwd = process.cwd()) {
 	);
 }
 
+/** @param {string} cwd */
+function load_user_tsconfig(cwd) {
+	const file = maybe_file(cwd, 'tsconfig.json') || maybe_file(cwd, 'jsconfig.json');
+
+	if (!file) return;
+
+	// we have to eval the file, since it's not parseable as JSON (contains comments)
+	const json = fs.readFileSync(file, 'utf-8');
+
+	return {
+		kind: path.basename(file),
+		options: (0, eval)(`(${json})`)
+	};
+}
+
 /**
- * @param {import('types').ValidatedKitConfig} config
+ * @param {import('types').ValidatedKitConfig} kit
  * @param {string} cwd
  * @param {string} out
- * @param {string} user_file
+ * @param {{ kind: string, options: any }} config
  */
-function validate(config, cwd, out, user_file) {
-	// we have to eval the file, since it's not parseable as JSON (contains comments)
-	const user_tsconfig_json = fs.readFileSync(user_file, 'utf-8');
-	const user_tsconfig = (0, eval)(`(${user_tsconfig_json})`);
-
+function validate_user_config(kit, cwd, out, config) {
 	// we need to check that the user's tsconfig extends the framework config
-	const extend = user_tsconfig.extends;
+	const extend = config.options.extends;
 	const extends_framework_config = extend && path.resolve(cwd, extend) === out;
 
-	const kind = path.basename(user_file);
+	const options = config.options.compilerOptions || {};
 
 	if (extends_framework_config) {
-		const { paths: user_paths } = user_tsconfig.compilerOptions || {};
+		const { paths: user_paths } = options;
 
-		if (user_paths && fs.existsSync(config.files.lib)) {
+		if (user_paths && fs.existsSync(kit.files.lib)) {
 			/** @type {string[]} */
 			const lib = user_paths['$lib'] || [];
 			/** @type {string[]} */
 			const lib_ = user_paths['$lib/*'] || [];
 
+			// TODO(v2): check needs to be adjusted when we remove the base path
 			const missing_lib_paths =
-				!lib.some((relative) => path.resolve(cwd, relative) === config.files.lib) ||
-				!lib_.some((relative) => path.resolve(cwd, relative) === path.join(config.files.lib, '/*'));
+				!lib.some((relative) => path.resolve(cwd, relative) === kit.files.lib) ||
+				!lib_.some((relative) => path.resolve(cwd, relative) === path.join(kit.files.lib, '/*'));
 
 			if (missing_lib_paths) {
 				console.warn(
 					colors
 						.bold()
-						.yellow(`Your compilerOptions.paths in ${kind} should include the following:`)
+						.yellow(`Your compilerOptions.paths in ${config.kind} should include the following:`)
 				);
-				const relative = posixify(path.relative('.', config.files.lib));
+				let relative = posixify(path.relative('.', kit.files.lib));
+				if (!relative.startsWith('.')) relative = `./${relative}`;
 				console.warn(`{\n  "$lib":["${relative}"],\n  "$lib/*":["${relative}/*"]\n}`);
 			}
 		}
@@ -150,7 +192,9 @@ function validate(config, cwd, out, user_file) {
 		if (!relative.startsWith('./')) relative = './' + relative;
 
 		console.warn(
-			colors.bold().yellow(`Your ${kind} should extend the configuration generated by SvelteKit:`)
+			colors
+				.bold()
+				.yellow(`Your ${config.kind} should extend the configuration generated by SvelteKit:`)
 		);
 		console.warn(`{\n  "extends": "${relative}"\n}`);
 	}
@@ -166,11 +210,13 @@ const value_regex = /^(.*?)((\/\*)|(\.\w+))?$/;
  * Related to vite alias creation.
  *
  * @param {import('types').ValidatedKitConfig} config
+ * @param {boolean} include_base_url
  */
-export function get_tsconfig_paths(config) {
-	const alias = {
-		...config.alias
-	};
+export function get_tsconfig_paths(config, include_base_url) {
+	/** @param {string} file */
+	const config_relative = (file) => posixify(path.relative(config.outDir, file));
+
+	const alias = { ...config.alias };
 	if (fs.existsSync(project_relative(config.files.lib))) {
 		alias['$lib'] = project_relative(config.files.lib);
 	}
@@ -185,7 +231,9 @@ export function get_tsconfig_paths(config) {
 		const value_match = value_regex.exec(value);
 		if (!value_match) throw new Error(`Invalid alias value: ${value}`);
 
-		const rel_path = project_relative(remove_trailing_slashstar(value));
+		const rel_path = (include_base_url ? project_relative : config_relative)(
+			remove_trailing_slashstar(value)
+		);
 		const slashstar = key_match[2];
 
 		if (slashstar) {

package/src/exports/index.js

@@ -48,8 +48,3 @@ export function json(data, init) {
 export function fail(status, data) {
 	return new ActionFailure(status, data);
 }
-
-// TODO remove for 1.0
-export function invalid() {
-	throw new Error('invalid(...) is now fail(...)');
-}

package/src/runtime/client/client.js

@@ -32,6 +32,7 @@ import { unwrap_promises } from '../../utils/promises.js';
 import * as devalue from 'devalue';
 import { INDEX_KEY, PRELOAD_PRIORITIES, SCROLL_KEY } from './constants.js';
 import { validate_common_exports } from '../../utils/exports.js';
+import { compact } from '../../utils/array.js';
 
 const routes = parse(nodes, server_loads, dictionary, matchers);
 
@@ -414,8 +415,6 @@ export function create_client({ target, base }) {
 		route,
 		form
 	}) {
-		const filtered = /** @type {import('./types').BranchNode[] } */ (branch.filter(Boolean));
-
 		/** @type {import('types').TrailingSlash} */
 		let slash = 'never';
 		for (const node of branch) {
@@ -436,7 +435,7 @@ export function create_client({ target, base }) {
 			},
 			props: {
 				// @ts-ignore Somehow it's getting SvelteComponent and SvelteComponentDev mixed up
-				components: filtered.map((branch_node) => branch_node.node.component)
+				components: compact(branch).map((branch_node) => branch_node.node.component)
 			}
 		};
 
@@ -446,21 +445,24 @@ export function create_client({ target, base }) {
 
 		let data = {};
 		let data_changed = !page;
-		for (let i = 0; i < filtered.length; i += 1) {
-			const node = filtered[i];
+
+		let p = 0;
+
+		for (let i = 0; i < Math.max(branch.length, current.branch.length); i += 1) {
+			const node = branch[i];
+			const prev = current.branch[i];
+
+			if (node?.data !== prev?.data) data_changed = true;
+			if (!node) continue;
+
 			data = { ...data, ...node.data };
 
 			// Only set props if the node actually updated. This prevents needless rerenders.
-			if (data_changed || !current.branch.some((previous) => previous === node)) {
-				result.props[`data_${i}`] = data;
-				data_changed = data_changed || Object.keys(node.data ?? {}).length > 0;
+			if (data_changed) {
+				result.props[`data_${p}`] = data;
 			}
-		}
-		if (!data_changed) {
-			// If nothing was added, and the object entries are the same length, this means
-			// that nothing was removed either and therefore the data is the same as the previous one.
-			// This would be more readable with a separate boolean but that would cost us some bytes.
-			data_changed = Object.keys(page.data).length !== Object.keys(data).length;
+
+			p += 1;
 		}
 
 		const page_changed =
@@ -1387,10 +1389,17 @@ export function create_client({ target, base }) {
 				const a = find_anchor(/** @type {Element} */ (event.composedPath()[0]), container);
 				if (!a) return;
 
-				const { url, external, has } = get_link_info(a, base);
-				const options = get_router_options(a);
+				const { url, external, target } = get_link_info(a, base);
 				if (!url) return;
 
+				// bail out before `beforeNavigate` if link opens in a different tab
+				if (target === '_parent' || target === '_top') {
+					if (window.parent !== window) return;
+				} else if (target && target !== '_self') {
+					return;
+				}
+
+				const options = get_router_options(a);
 				const is_svg_a_element = a instanceof SVGAElement;
 
 				// Ignore URL protocols that differ to the current one and are not http(s) (e.g. `mailto:`, `tel:`, `myapp:`, etc.)
@@ -1408,8 +1417,6 @@ export function create_client({ target, base }) {
 				)
 					return;
 
-				if (has.download) return;
-
 				// Ignore the following but fire beforeNavigate
 				if (external || options.reload) {
 					const navigation = before_navigate({ url, type: 'link' });

package/src/runtime/client/utils.js

@@ -124,16 +124,16 @@ export function get_link_info(a, base) {
 		url = new URL(a instanceof SVGAElement ? a.href.baseVal : a.href, document.baseURI);
 	} catch {}
 
-	const has = {
-		rel_external: (a.getAttribute('rel') || '').split(/\s+/).includes('external'),
-		download: a.hasAttribute('download'),
-		target: !!(a instanceof SVGAElement ? a.target.baseVal : a.target)
-	};
+	const target = a instanceof SVGAElement ? a.target.baseVal : a.target;
 
 	const external =
-		!url || is_external_url(url, base) || has.rel_external || has.target || has.download;
+		!url ||
+		!!target ||
+		is_external_url(url, base) ||
+		(a.getAttribute('rel') || '').split(/\s+/).includes('external') ||
+		a.hasAttribute('download');
 
-	return { url, has, external };
+	return { url, external, target };
 }
 
 /**

package/types/ambient.d.ts

@@ -11,9 +11,12 @@
  * 	}
  * }
  *
- * export default undefined;
+ * export {};
  * ```
  *
+ * The `export {}` line exists because without it, the file would be treated as an _ambient module_ which prevents you from adding `import` declarations.
+ * If you need to add ambient `declare module` declarations, do so in a separate file like `src/ambient.d.ts`.
+ *
  * By populating these interfaces, you will gain type safety when using `event.locals`, `event.platform`, and `data` from `load` functions.
  */
 declare namespace App {
@@ -243,7 +246,8 @@ declare module '$app/navigation' {
 
 	/**
 	 * A navigation interceptor that triggers before we navigate to a new URL, whether by clicking a link, calling `goto(...)`, or using the browser back/forward controls.
-	 * Calling `cancel()` will prevent the navigation from completing.
+	 * Calling `cancel()` will prevent the navigation from completing. If the navigation would have directly unloaded the current page, calling `cancel` will trigger the native
+	 * browser unload confirmation dialog. In these cases, `navigation.willUnload` is `true`.
 	 *
 	 * When a navigation isn't client side, `navigation.to.route.id` will be `null`.
 	 *

package/types/index.d.ts

@@ -1044,7 +1044,7 @@ export interface ServerLoadEvent<
 
 /**
  * Shape of a form action method that is part of `export const actions = {..}` in `+page.server.js`.
- * See [form actions](https://kit-svelte-d4b3r0pff-svelte.vercel.app/docs/form-actions) for more information.
+ * See [form actions](https://kit.svelte.dev/docs/form-actions) for more information.
  */
 export interface Action<
 	Params extends Partial<Record<string, string>> = Partial<Record<string, string>>,
@@ -1056,7 +1056,7 @@ export interface Action<
 
 /**
  * Shape of the `export const actions = {..}` object in `+page.server.js`.
- * See [form actions](https://kit-svelte-d4b3r0pff-svelte.vercel.app/docs/form-actions) for more information.
+ * See [form actions](https://kit.svelte.dev/docs/form-actions) for more information.
  */
 export type Actions<
 	Params extends Partial<Record<string, string>> = Partial<Record<string, string>>,