@sveltejs/kit 1.0.12 → 1.1.0

package/src/runtime/server/page/render.js

@@ -1,12 +1,14 @@
 import * as devalue from 'devalue';
 import { readable, writable } from 'svelte/store';
+import { DEV } from 'esm-env';
 import { hash } from '../../hash.js';
 import { serialize_data } from './serialize_data.js';
 import { s } from '../../../utils/misc.js';
 import { Csp } from './csp.js';
 import { uneval_action_response } from './actions.js';
 import { clarify_devalue_error } from '../utils.js';
-import { DEV } from 'esm-env';
+import { assets, base, version } from '../../shared.js';
+import { env } from '../../env-public.js';
 
 // TODO rename this function/module
 
@@ -21,6 +23,7 @@ const updated = {
  *   branch: Array<import('./types').Loaded>;
  *   fetched: Array<import('./types').Fetched>;
  *   options: import('types').SSROptions;
+ *   manifest: import('types').SSRManifest;
  *   state: import('types').SSRState;
  *   page_config: { ssr: boolean; csr: boolean };
  *   status: number;
@@ -34,6 +37,7 @@ export async function render_response({
 	branch,
 	fetched,
 	options,
+	manifest,
 	state,
 	page_config,
 	status,
@@ -52,11 +56,11 @@ export async function render_response({
 		}
 	}
 
-	const { entry } = options.manifest._;
+	const { entry } = manifest._;
 
 	const stylesheets = new Set(entry.stylesheets);
 	const modulepreloads = new Set(entry.imports);
-	const fonts = new Set(options.manifest._.entry.fonts);
+	const fonts = new Set(manifest._.entry.fonts);
 
 	/** @type {Set<string>} */
 	const link_header_preloads = new Set();
@@ -73,6 +77,11 @@ export async function render_response({
 			: null;
 
 	if (page_config.ssr) {
+		if (__SVELTEKIT_DEV__ && !branch.at(-1)?.node.component) {
+			// Can only be the leaf, layouts have a fallback component generated
+			throw new Error(`Missing +page.svelte component for route ${event.route.id}`);
+		}
+
 		/** @type {Record<string, any>} */
 		const props = {
 			stores: {
@@ -130,7 +139,6 @@ export async function render_response({
 	let body = rendered.html;
 
 	const csp = new Csp(options.csp, {
-		dev: options.dev,
 		prerender: !!state.prerendering
 	});
 
@@ -140,23 +148,23 @@ export async function render_response({
 	 * The prefix to use for static assets. Replaces `%sveltekit.assets%` in the template
 	 * @type {string}
 	 */
-	let assets;
+	let resolved_assets;
 
-	if (options.paths.assets) {
+	if (assets) {
 		// if an asset path is specified, use it
-		assets = options.paths.assets;
+		resolved_assets = assets;
 	} else if (state.prerendering?.fallback) {
 		// if we're creating a fallback page, asset paths need to be root-relative
-		assets = options.paths.base;
+		resolved_assets = base;
 	} else {
 		// otherwise we want asset paths to be relative to the page, so that they
 		// will work in odd contexts like IPFS, the internet archive, and so on
-		const segments = event.url.pathname.slice(options.paths.base.length).split('/').slice(2);
-		assets = segments.length > 0 ? segments.map(() => '..').join('/') : '.';
+		const segments = event.url.pathname.slice(base.length).split('/').slice(2);
+		resolved_assets = segments.length > 0 ? segments.map(() => '..').join('/') : '.';
 	}
 
 	/** @param {string} path */
-	const prefixed = (path) => (path.startsWith('/') ? path : `${assets}/${path}`);
+	const prefixed = (path) => (path.startsWith('/') ? path : `${resolved_assets}/${path}`);
 
 	const serialized = { data: '', form: 'null', error: 'null' };
 
@@ -203,8 +211,7 @@ export async function render_response({
 	if (inline_styles.size > 0) {
 		const content = Array.from(inline_styles.values()).join('\n');
 
-		const attributes = [];
-		if (options.dev) attributes.push(' data-sveltekit');
+		const attributes = __SVELTEKIT_DEV__ ? [' data-sveltekit'] : [];
 		if (csp.style_needs_nonce) attributes.push(` nonce="${csp.nonce}"`);
 
 		csp.add_style(content);
@@ -250,10 +257,10 @@ export async function render_response({
 
 	if (page_config.csr) {
 		const opts = [
-			`env: ${s(options.public_env)}`,
-			`paths: ${s(options.paths)}`,
+			`env: ${s(env)}`,
+			`paths: ${s({ assets, base })}`,
 			`target: document.querySelector('[data-sveltekit-hydrate="${target}"]').parentNode`,
-			`version: ${s(options.version)}`
+			`version: ${s(version)}`
 		];
 
 		if (page_config.ssr) {
@@ -315,7 +322,7 @@ export async function render_response({
 	}
 
 	if (options.service_worker) {
-		const opts = options.dev ? `, { type: 'module' }` : '';
+		const opts = __SVELTEKIT_DEV__ ? `, { type: 'module' }` : '';
 
 		// we use an anonymous function instead of an arrow function to support
 		// older browsers (https://github.com/sveltejs/kit/pull/5417)
@@ -355,10 +362,10 @@ export async function render_response({
 	// add the content after the script/css links so the link elements are parsed first
 	head += rendered.head;
 
-	const html = options.app_template({
+	const html = options.templates.app({
 		head,
 		body,
-		assets,
+		assets: resolved_assets,
 		nonce: /** @type {string} */ (csp.nonce)
 	});
 

package/src/runtime/server/page/respond_with_error.js

@@ -11,27 +11,34 @@ import { HttpError, Redirect } from '../../control.js';
 
 /**
  * @typedef {import('./types.js').Loaded} Loaded
- * @typedef {import('types').SSROptions} SSROptions
- * @typedef {import('types').SSRState} SSRState
  */
 
 /**
  * @param {{
  *   event: import('types').RequestEvent;
- *   options: SSROptions;
- *   state: SSRState;
+ *   options: import('types').SSROptions;
+ *   manifest: import('types').SSRManifest;
+ *   state: import('types').SSRState;
  *   status: number;
  *   error: unknown;
  *   resolve_opts: import('types').RequiredResolveOptions;
  * }} opts
  */
-export async function respond_with_error({ event, options, state, status, error, resolve_opts }) {
+export async function respond_with_error({
+	event,
+	options,
+	manifest,
+	state,
+	status,
+	error,
+	resolve_opts
+}) {
 	/** @type {import('./types').Fetched[]} */
 	const fetched = [];
 
 	try {
 		const branch = [];
-		const default_layout = await options.manifest._.nodes[0](); // 0 is always the root layout
+		const default_layout = await manifest._.nodes[0](); // 0 is always the root layout
 		const ssr = get_option([default_layout], 'ssr') ?? true;
 		const csr = get_option([default_layout], 'csr') ?? true;
 
@@ -40,7 +47,6 @@ export async function respond_with_error({ event, options, state, status, error,
 
 			const server_data_promise = load_server_data({
 				event,
-				options,
 				state,
 				node: default_layout,
 				parent: async () => ({})
@@ -66,7 +72,7 @@ export async function respond_with_error({ event, options, state, status, error,
 					data
 				},
 				{
-					node: await options.manifest._.nodes[1](), // 1 is always the root error
+					node: await manifest._.nodes[1](), // 1 is always the root error
 					data: null,
 					server_data: null
 				}
@@ -75,6 +81,7 @@ export async function respond_with_error({ event, options, state, status, error,
 
 		return await render_response({
 			options,
+			manifest,
 			state,
 			page_config: {
 				ssr,
@@ -87,17 +94,17 @@ export async function respond_with_error({ event, options, state, status, error,
 			event,
 			resolve_opts
 		});
-	} catch (error) {
+	} catch (e) {
 		// Edge case: If route is a 404 and the user redirects to somewhere from the root layout,
 		// we end up here.
-		if (error instanceof Redirect) {
-			return redirect_response(error.status, error.location);
+		if (e instanceof Redirect) {
+			return redirect_response(e.status, e.location);
 		}
 
 		return static_error_page(
 			options,
-			error instanceof HttpError ? error.status : 500,
-			(await handle_error_and_jsonify(event, options, error)).message
+			e instanceof HttpError ? e.status : 500,
+			(await handle_error_and_jsonify(event, options, e)).message
 		);
 	}
 }

package/src/runtime/server/page/types.d.ts

@@ -24,7 +24,6 @@ export interface CspConfig {
 }
 
 export interface CspOpts {
-	dev: boolean;
 	prerender: boolean;
 }
 

package/src/runtime/server/respond.js

@@ -0,0 +1,419 @@
+import { DEV } from 'esm-env';
+import { is_endpoint_request, render_endpoint } from './endpoint.js';
+import { render_page } from './page/index.js';
+import { render_response } from './page/render.js';
+import { respond_with_error } from './page/respond_with_error.js';
+import { is_form_content_type } from '../../utils/http.js';
+import { GENERIC_ERROR, get_option, handle_fatal_error, redirect_response } from './utils.js';
+import {
+	decode_pathname,
+	decode_params,
+	disable_search,
+	has_data_suffix,
+	normalize_path,
+	strip_data_suffix
+} from '../../utils/url.js';
+import { exec } from '../../utils/routing.js';
+import { INVALIDATED_PARAM, redirect_json_response, render_data } from './data/index.js';
+import { add_cookies_to_headers, get_cookies } from './cookie.js';
+import { create_fetch } from './fetch.js';
+import { Redirect } from '../control.js';
+import {
+	validate_common_exports,
+	validate_page_server_exports,
+	validate_server_exports
+} from '../../utils/exports.js';
+import { error, json } from '../../exports/index.js';
+import * as paths from '../shared.js';
+
+/* global __SVELTEKIT_ADAPTER_NAME__ */
+
+/** @type {import('types').RequiredResolveOptions['transformPageChunk']} */
+const default_transform = ({ html }) => html;
+
+/** @type {import('types').RequiredResolveOptions['filterSerializedResponseHeaders']} */
+const default_filter = () => false;
+
+/** @type {import('types').RequiredResolveOptions['preload']} */
+const default_preload = ({ type }) => type === 'js' || type === 'css';
+
+/** @type {import('types').Respond} */
+export async function respond(request, options, manifest, state) {
+	/** URL but stripped from the potential `/__data.json` suffix and its search param  */
+	let url = new URL(request.url);
+
+	if (options.csrf_check_origin) {
+		const forbidden =
+			request.method === 'POST' &&
+			request.headers.get('origin') !== url.origin &&
+			is_form_content_type(request);
+
+		if (forbidden) {
+			const csrf_error = error(403, `Cross-site ${request.method} form submissions are forbidden`);
+			if (request.headers.get('accept') === 'application/json') {
+				return json(csrf_error.body, { status: csrf_error.status });
+			}
+			return new Response(csrf_error.body.message, { status: csrf_error.status });
+		}
+	}
+
+	let decoded;
+	try {
+		decoded = decode_pathname(url.pathname);
+	} catch {
+		return new Response('Malformed URI', { status: 400 });
+	}
+
+	/** @type {import('types').SSRRoute | null} */
+	let route = null;
+
+	/** @type {Record<string, string>} */
+	let params = {};
+
+	if (paths.base && !state.prerendering?.fallback) {
+		if (!decoded.startsWith(paths.base)) {
+			return new Response('Not found', { status: 404 });
+		}
+		decoded = decoded.slice(paths.base.length) || '/';
+	}
+
+	const is_data_request = has_data_suffix(decoded);
+	/** @type {boolean[] | undefined} */
+	let invalidated_data_nodes;
+	if (is_data_request) {
+		decoded = strip_data_suffix(decoded) || '/';
+		url.pathname = strip_data_suffix(url.pathname) || '/';
+		invalidated_data_nodes = url.searchParams.get(INVALIDATED_PARAM)?.split('_').map(Boolean);
+		url.searchParams.delete(INVALIDATED_PARAM);
+	}
+
+	if (!state.prerendering?.fallback) {
+		// TODO this could theoretically break — should probably be inside a try-catch
+		const matchers = await manifest._.matchers();
+
+		for (const candidate of manifest._.routes) {
+			const match = candidate.pattern.exec(decoded);
+			if (!match) continue;
+
+			const matched = exec(match, candidate.params, matchers);
+			if (matched) {
+				route = candidate;
+				params = decode_params(matched);
+				break;
+			}
+		}
+	}
+
+	/** @type {import('types').TrailingSlash | void} */
+	let trailing_slash = undefined;
+
+	/** @type {Record<string, string>} */
+	const headers = {};
+
+	/** @type {import('types').RequestEvent} */
+	const event = {
+		// @ts-expect-error `cookies` and `fetch` need to be created after the `event` itself
+		cookies: null,
+		// @ts-expect-error
+		fetch: null,
+		getClientAddress:
+			state.getClientAddress ||
+			(() => {
+				throw new Error(
+					`${__SVELTEKIT_ADAPTER_NAME__} does not specify getClientAddress. Please raise an issue`
+				);
+			}),
+		locals: {},
+		params,
+		platform: state.platform,
+		request,
+		route: { id: route?.id ?? null },
+		setHeaders: (new_headers) => {
+			for (const key in new_headers) {
+				const lower = key.toLowerCase();
+				const value = new_headers[key];
+
+				if (lower === 'set-cookie') {
+					throw new Error(
+						`Use \`event.cookies.set(name, value, options)\` instead of \`event.setHeaders\` to set cookies`
+					);
+				} else if (lower in headers) {
+					throw new Error(`"${key}" header is already set`);
+				} else {
+					headers[lower] = value;
+
+					if (state.prerendering && lower === 'cache-control') {
+						state.prerendering.cache = /** @type {string} */ (value);
+					}
+				}
+			}
+		},
+		url,
+		isDataRequest: is_data_request
+	};
+
+	/** @type {import('types').RequiredResolveOptions} */
+	let resolve_opts = {
+		transformPageChunk: default_transform,
+		filterSerializedResponseHeaders: default_filter,
+		preload: default_preload
+	};
+
+	try {
+		// determine whether we need to redirect to add/remove a trailing slash
+		if (route && !is_data_request) {
+			if (route.page) {
+				const nodes = await Promise.all([
+					// we use == here rather than === because [undefined] serializes as "[null]"
+					...route.page.layouts.map((n) => (n == undefined ? n : manifest._.nodes[n]())),
+					manifest._.nodes[route.page.leaf]()
+				]);
+
+				if (DEV) {
+					const layouts = nodes.slice(0, -1);
+					const page = nodes.at(-1);
+
+					for (const layout of layouts) {
+						if (layout) {
+							validate_common_exports(layout.server, /** @type {string} */ (layout.server_id));
+							validate_common_exports(
+								layout.universal,
+								/** @type {string} */ (layout.universal_id)
+							);
+						}
+					}
+
+					if (page) {
+						validate_page_server_exports(page.server, /** @type {string} */ (page.server_id));
+						validate_common_exports(page.universal, /** @type {string} */ (page.universal_id));
+					}
+				}
+
+				trailing_slash = get_option(nodes, 'trailingSlash');
+			} else if (route.endpoint) {
+				const node = await route.endpoint();
+				trailing_slash = node.trailingSlash;
+
+				if (DEV) {
+					validate_server_exports(node, /** @type {string} */ (route.endpoint_id));
+				}
+			}
+
+			const normalized = normalize_path(url.pathname, trailing_slash ?? 'never');
+
+			if (normalized !== url.pathname && !state.prerendering?.fallback) {
+				return new Response(undefined, {
+					status: 301,
+					headers: {
+						'x-sveltekit-normalize': '1',
+						location:
+							// ensure paths starting with '//' are not treated as protocol-relative
+							(normalized.startsWith('//') ? url.origin + normalized : normalized) +
+							(url.search === '?' ? '' : url.search)
+					}
+				});
+			}
+		}
+
+		const { cookies, new_cookies, get_cookie_header } = get_cookies(
+			request,
+			url,
+			trailing_slash ?? 'never'
+		);
+
+		event.cookies = cookies;
+		event.fetch = create_fetch({ event, options, manifest, state, get_cookie_header });
+
+		if (state.prerendering && !state.prerendering.fallback) disable_search(url);
+
+		const response = await options.hooks.handle({
+			event,
+			resolve: (event, opts) =>
+				resolve(event, opts).then((response) => {
+					// add headers/cookies here, rather than inside `resolve`, so that we
+					// can do it once for all responses instead of once per `return`
+					for (const key in headers) {
+						const value = headers[key];
+						response.headers.set(key, /** @type {string} */ (value));
+					}
+
+					add_cookies_to_headers(response.headers, Object.values(new_cookies));
+
+					if (state.prerendering && event.route.id !== null) {
+						response.headers.set('x-sveltekit-routeid', encodeURI(event.route.id));
+					}
+
+					return response;
+				})
+		});
+
+		// respond with 304 if etag matches
+		if (response.status === 200 && response.headers.has('etag')) {
+			let if_none_match_value = request.headers.get('if-none-match');
+
+			// ignore W/ prefix https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/If-None-Match#directives
+			if (if_none_match_value?.startsWith('W/"')) {
+				if_none_match_value = if_none_match_value.substring(2);
+			}
+
+			const etag = /** @type {string} */ (response.headers.get('etag'));
+
+			if (if_none_match_value === etag) {
+				const headers = new Headers({ etag });
+
+				// https://datatracker.ietf.org/doc/html/rfc7232#section-4.1 + set-cookie
+				for (const key of [
+					'cache-control',
+					'content-location',
+					'date',
+					'expires',
+					'vary',
+					'set-cookie'
+				]) {
+					const value = response.headers.get(key);
+					if (value) headers.set(key, value);
+				}
+
+				return new Response(undefined, {
+					status: 304,
+					headers
+				});
+			}
+		}
+
+		// Edge case: If user does `return Response(30x)` in handle hook while processing a data request,
+		// we need to transform the redirect response to a corresponding JSON response.
+		if (is_data_request && response.status >= 300 && response.status <= 308) {
+			const location = response.headers.get('location');
+			if (location) {
+				return redirect_json_response(new Redirect(/** @type {any} */ (response.status), location));
+			}
+		}
+
+		return response;
+	} catch (e) {
+		if (e instanceof Redirect) {
+			if (is_data_request) {
+				return redirect_json_response(e);
+			} else {
+				return redirect_response(e.status, e.location);
+			}
+		}
+		return await handle_fatal_error(event, options, e);
+	}
+
+	/**
+	 *
+	 * @param {import('types').RequestEvent} event
+	 * @param {import('types').ResolveOptions} [opts]
+	 */
+	async function resolve(event, opts) {
+		try {
+			if (opts) {
+				if ('ssr' in opts) {
+					throw new Error(
+						'ssr has been removed, set it in the appropriate +layout.js instead. See the PR for more information: https://github.com/sveltejs/kit/pull/6197'
+					);
+				}
+
+				resolve_opts = {
+					transformPageChunk: opts.transformPageChunk || default_transform,
+					filterSerializedResponseHeaders: opts.filterSerializedResponseHeaders || default_filter,
+					preload: opts.preload || default_preload
+				};
+			}
+
+			if (state.prerendering?.fallback) {
+				return await render_response({
+					event,
+					options,
+					manifest,
+					state,
+					page_config: { ssr: false, csr: true },
+					status: 200,
+					error: null,
+					branch: [],
+					fetched: [],
+					resolve_opts
+				});
+			}
+
+			if (route) {
+				/** @type {Response} */
+				let response;
+
+				if (is_data_request) {
+					response = await render_data(
+						event,
+						route,
+						options,
+						manifest,
+						state,
+						invalidated_data_nodes,
+						trailing_slash ?? 'never'
+					);
+				} else if (route.endpoint && (!route.page || is_endpoint_request(event))) {
+					response = await render_endpoint(event, await route.endpoint(), state);
+				} else if (route.page) {
+					response = await render_page(
+						event,
+						route,
+						route.page,
+						options,
+						manifest,
+						state,
+						resolve_opts
+					);
+				} else {
+					// a route will always have a page or an endpoint, but TypeScript
+					// doesn't know that
+					throw new Error('This should never happen');
+				}
+
+				return response;
+			}
+
+			if (state.initiator === GENERIC_ERROR) {
+				return new Response('Internal Server Error', {
+					status: 500
+				});
+			}
+
+			// if this request came direct from the user, rather than
+			// via a `fetch` in a `load`, render a 404 page
+			if (!state.initiator) {
+				return await respond_with_error({
+					event,
+					options,
+					manifest,
+					state,
+					status: 404,
+					error: new Error(`Not found: ${event.url.pathname}`),
+					resolve_opts
+				});
+			}
+
+			if (state.prerendering) {
+				return new Response('not found', { status: 404 });
+			}
+
+			// we can't load the endpoint from our own manifest,
+			// so we need to make an actual HTTP request
+			return await fetch(request);
+		} catch (e) {
+			// TODO if `e` is instead named `error`, some fucked up Vite transformation happens
+			// and I don't even know how to describe it. need to investigate at some point
+
+			// HttpError from endpoint can end up here - TODO should it be handled there instead?
+			return await handle_fatal_error(event, options, e);
+		} finally {
+			event.cookies.set = () => {
+				throw new Error('Cannot use `cookies.set(...)` after the response has been generated');
+			};
+
+			event.setHeaders = () => {
+				throw new Error('Cannot use `setHeaders(...)` after the response has been generated');
+			};
+		}
+	}
+}

package/src/runtime/server/utils.js

@@ -3,6 +3,7 @@ import { coalesce_to_error } from '../../utils/error.js';
 import { negotiate } from '../../utils/http.js';
 import { has_data_suffix } from '../../utils/url.js';
 import { HttpError } from '../control.js';
+import { fix_stack_trace } from '../shared.js';
 
 /** @param {any} body */
 export function is_pojo(body) {
@@ -74,7 +75,7 @@ export function get_option(nodes, option) {
  * @param {string} message
  */
 export function static_error_page(options, status, message) {
-	return new Response(options.error_template({ status, message }), {
+	return new Response(options.templates.error({ status, message }), {
 		headers: { 'content-type': 'text/html; charset=utf-8' },
 		status
 	});
@@ -110,13 +111,29 @@ export async function handle_fatal_error(event, options, error) {
  * @param {import('types').RequestEvent} event
  * @param {import('types').SSROptions} options
  * @param {any} error
- * @returns {import('types').MaybePromise<App.Error>}
+ * @returns {Promise<App.Error>}
  */
-export function handle_error_and_jsonify(event, options, error) {
+export async function handle_error_and_jsonify(event, options, error) {
 	if (error instanceof HttpError) {
 		return error.body;
 	} else {
-		return options.handle_error(error, event);
+		if (__SVELTEKIT_DEV__) {
+			error = new Proxy(error, {
+				get: (target, property) => {
+					if (property === 'stack') {
+						return fix_stack_trace(target.stack);
+					}
+
+					return Reflect.get(target, property, target);
+				}
+			});
+		}
+
+		return (
+			(await options.hooks.handleError({ error, event })) ?? {
+				message: event.route.id != null ? 'Internal Error' : 'Not Found'
+			}
+		);
 	}
 }