@sveltejs/kit 1.0.0-next.224 → 1.0.0-next.229

package/assets/kit.js

@@ -537,12 +537,25 @@ function escape(str, dict, unicode_encoder) {
 
 const s = JSON.stringify;
 
+/** @param {URL} url */
+function create_prerendering_url_proxy(url) {
+	return new Proxy(url, {
+		get: (target, prop, receiver) => {
+			if (prop === 'search' || prop === 'searchParams') {
+				throw new Error(`Cannot access url.${prop} on a page with prerendering enabled`);
+			}
+			return Reflect.get(target, prop, receiver);
+		}
+	});
+}
+
 // TODO rename this function/module
 
 /**
  * @param {{
  *   branch: Array<import('./types').Loaded>;
  *   options: import('types/internal').SSRRenderOptions;
+ *   state: import('types/internal').SSRRenderState;
  *   $session: any;
  *   page_config: { hydrate: boolean, router: boolean };
  *   status: number;
@@ -556,6 +569,7 @@ const s = JSON.stringify;
 async function render_response({
 	branch,
 	options,
+	state,
 	$session,
 	page_config,
 	status,
@@ -567,7 +581,8 @@ async function render_response({
 }) {
 	const css = new Set(options.manifest._.entry.css);
 	const js = new Set(options.manifest._.entry.js);
-	const styles = new Set();
+	/** @type {Map<string, string>} */
+	const styles = new Map();
 
 	/** @type {Array<{ url: string, body: string, json: string }>} */
 	const serialized_data = [];
@@ -585,7 +600,7 @@ async function render_response({
 		branch.forEach(({ node, loaded, fetched, uses_credentials }) => {
 			if (node.css) node.css.forEach((url) => css.add(url));
 			if (node.js) node.js.forEach((url) => js.add(url));
-			if (node.styles) node.styles.forEach((content) => styles.add(content));
+			if (node.styles) Object.entries(node.styles).forEach(([k, v]) => styles.set(k, v));
 
 			// TODO probably better if `fetched` wasn't populated unless `hydrate`
 			if (fetched && page_config.hydrate) serialized_data.push(...fetched);
@@ -604,7 +619,13 @@ async function render_response({
 				navigating: writable(null),
 				session
 			},
-			page: { url, params, status, error, stuff },
+			page: {
+				url: state.prerender ? create_prerendering_url_proxy(url) : url,
+				params,
+				status,
+				error,
+				stuff
+			},
 			components: branch.map(({ node }) => node.module.default)
 		};
 
@@ -646,94 +667,80 @@ async function render_response({
 		rendered = { head: '', html: '', css: { code: '', map: null } };
 	}
 
-	const include_js = page_config.router || page_config.hydrate;
-	if (!include_js) js.clear();
-
-	// TODO strip the AMP stuff out of the build if not relevant
-	const links = options.amp
-		? styles.size > 0 || rendered.css.code.length > 0
-			? `<style amp-custom>${Array.from(styles).concat(rendered.css.code).join('\n')}</style>`
-			: ''
-		: [
-				// From https://web.dev/priority-hints/:
-				// Generally, preloads will load in the order the parser gets to them for anything above "Medium" priority
-				// Thus, we should list CSS first
-				...Array.from(css).map((dep) => `<link rel="stylesheet" href="${options.prefix}${dep}">`),
-				...Array.from(js).map((dep) => `<link rel="modulepreload" href="${options.prefix}${dep}">`)
-		  ].join('\n\t\t');
-
-	/** @type {string} */
-	let init = '';
+	let { head, html: body } = rendered;
+
+	const inlined_style = Array.from(styles.values()).join('\n');
 
 	if (options.amp) {
-		init = `
+		head += `
 		<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style>
 		<noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
-		<script async src="https://cdn.ampproject.org/v0.js"></script>`;
-		init += options.service_worker
-			? '<script async custom-element="amp-install-serviceworker" src="https://cdn.ampproject.org/v0/amp-install-serviceworker-0.1.js"></script>'
-			: '';
-	} else if (include_js) {
-		// prettier-ignore
-		init = `<script type="module">
-			import { start } from ${s(options.prefix + options.manifest._.entry.file)};
-			start({
-				target: ${options.target ? `document.querySelector(${s(options.target)})` : 'document.body'},
-				paths: ${s(options.paths)},
-				session: ${try_serialize($session, (error) => {
-					throw new Error(`Failed to serialize session data: ${error.message}`);
-				})},
-				route: ${!!page_config.router},
-				spa: ${!ssr},
-				trailing_slash: ${s(options.trailing_slash)},
-				hydrate: ${ssr && page_config.hydrate ? `{
-					status: ${status},
-					error: ${serialize_error(error)},
-					nodes: [
-						${(branch || [])
-						.map(({ node }) => `import(${s(options.prefix + node.entry)})`)
-						.join(',\n\t\t\t\t\t\t')}
-					],
-					url: new URL(${s(url.href)}),
-					params: ${devalue(params)}
-				}` : 'null'}
-			});
-		</script>`;
-	}
+		<script async src="https://cdn.ampproject.org/v0.js"></script>
 
-	if (options.service_worker && !options.amp) {
-		init += `<script>
-			if ('serviceWorker' in navigator) {
-				navigator.serviceWorker.register('${options.service_worker}');
-			}
-		</script>`;
-	}
-
-	const head = [
-		rendered.head,
-		styles.size && !options.amp
-			? `<style data-svelte>${Array.from(styles).join('\n')}</style>`
-			: '',
-		links,
-		init
-	].join('\n\n\t\t');
+		<style amp-custom>${inlined_style}\n${rendered.css.code}</style>`;
 
-	let body = rendered.html;
-	if (options.amp) {
 		if (options.service_worker) {
+			head +=
+				'<script async custom-element="amp-install-serviceworker" src="https://cdn.ampproject.org/v0/amp-install-serviceworker-0.1.js"></script>';
+
 			body += `<amp-install-serviceworker src="${options.service_worker}" layout="nodisplay"></amp-install-serviceworker>`;
 		}
 	} else {
-		body += serialized_data
-			.map(({ url, body, json }) => {
-				let attributes = `type="application/json" data-type="svelte-data" data-url=${escape_html_attr(
-					url
-				)}`;
-				if (body) attributes += ` data-body="${hash(body)}"`;
-
-				return `<script ${attributes}>${json}</script>`;
-			})
-			.join('\n\n\t');
+		if (inlined_style) {
+			head += `\n\t<style${options.dev ? ' data-svelte' : ''}>${inlined_style}</style>`;
+		}
+		// prettier-ignore
+		head += Array.from(css)
+				.map((dep) => `\n\t<link${styles.has(dep) ? ' disabled' : ''} rel="stylesheet" href="${options.prefix + dep}">`)
+				.join('');
+
+		if (page_config.router || page_config.hydrate) {
+			head += Array.from(js)
+				.map((dep) => `\n\t<link rel="modulepreload" href="${options.prefix + dep}">`)
+				.join('');
+			// prettier-ignore
+			head += `
+			<script type="module">
+				import { start } from ${s(options.prefix + options.manifest._.entry.file)};
+				start({
+					target: ${options.target ? `document.querySelector(${s(options.target)})` : 'document.body'},
+					paths: ${s(options.paths)},
+					session: ${try_serialize($session, (error) => {
+						throw new Error(`Failed to serialize session data: ${error.message}`);
+					})},
+					route: ${!!page_config.router},
+					spa: ${!ssr},
+					trailing_slash: ${s(options.trailing_slash)},
+					hydrate: ${ssr && page_config.hydrate ? `{
+						status: ${status},
+						error: ${serialize_error(error)},
+						nodes: [
+							${(branch || [])
+							.map(({ node }) => `import(${s(options.prefix + node.entry)})`)
+							.join(',\n\t\t\t\t\t\t')}
+						],
+						url: new URL(${s(url.href)}),
+						params: ${devalue(params)}
+					}` : 'null'}
+				});
+			</script>${options.service_worker ? `
+			<script>
+				if ('serviceWorker' in navigator) {
+					navigator.serviceWorker.register('${options.service_worker}');
+				}
+			</script>` : ''}`;
+
+			body += serialized_data
+				.map(({ url, body, json }) => {
+					let attributes = `type="application/json" data-type="svelte-data" data-url=${escape_html_attr(
+						url
+					)}`;
+					if (body) attributes += ` data-body="${hash(body)}"`;
+
+					return `<script ${attributes}>${json}</script>`;
+				})
+				.join('\n\n\t');
+		}
 	}
 
 	/** @type {import('types/helper').ResponseHeaders} */
@@ -908,7 +915,6 @@ function is_root_relative(path) {
  *   node: import('types/internal').SSRNode;
  *   $session: any;
  *   stuff: Record<string, any>;
- *   prerender_enabled: boolean;
  *   is_error: boolean;
  *   status?: number;
  *   error?: Error;
@@ -925,7 +931,6 @@ async function load_node({
 	node,
 	$session,
 	stuff,
-	prerender_enabled,
 	is_error,
 	status,
 	error
@@ -950,19 +955,10 @@ async function load_node({
 
 	let loaded;
 
-	const url_proxy = new Proxy(url, {
-		get: (target, prop, receiver) => {
-			if (prerender_enabled && (prop === 'search' || prop === 'searchParams')) {
-				throw new Error('Cannot access query on a page with prerendering enabled');
-			}
-			return Reflect.get(target, prop, receiver);
-		}
-	});
-
 	if (module.load) {
 		/** @type {import('types/page').LoadInput | import('types/page').ErrorLoadInput} */
 		const load_input = {
-			url: url_proxy,
+			url: state.prerender ? create_prerendering_url_proxy(url) : url,
 			params,
 			get session() {
 				uses_credentials = true;
@@ -1209,7 +1205,6 @@ async function load_node({
 
 /**
  * @typedef {import('./types.js').Loaded} Loaded
- * @typedef {import('types/internal').SSRNode} SSRNode
  * @typedef {import('types/internal').SSRRenderOptions} SSRRenderOptions
  * @typedef {import('types/internal').SSRRenderState} SSRRenderState
  */
@@ -1252,7 +1247,6 @@ async function respond_with_error({
 				node: default_layout,
 				$session,
 				stuff: {},
-				prerender_enabled: is_prerender_enabled(options, default_error, state),
 				is_error: false
 			})
 		);
@@ -1268,7 +1262,6 @@ async function respond_with_error({
 				node: default_error,
 				$session,
 				stuff: layout_loaded ? layout_loaded.stuff : {},
-				prerender_enabled: is_prerender_enabled(options, default_error, state),
 				is_error: true,
 				status,
 				error
@@ -1277,6 +1270,7 @@ async function respond_with_error({
 
 		return await render_response({
 			options,
+			state,
 			$session,
 			page_config: {
 				hydrate: options.hydrate,
@@ -1303,17 +1297,6 @@ async function respond_with_error({
 	}
 }
 
-/**
- * @param {SSRRenderOptions} options
- * @param {SSRNode} node
- * @param {SSRRenderState} state
- */
-function is_prerender_enabled(options, node, state) {
-	return (
-		options.prerender && (!!node.module.prerender || (!!state.prerender && state.prerender.all))
-	);
-}
-
 /**
  * @typedef {import('./types.js').Loaded} Loaded
  * @typedef {import('types/hooks').ServerResponse} ServerResponse
@@ -1416,7 +1399,6 @@ async function respond$1(opts) {
 						url: request.url,
 						node,
 						stuff,
-						prerender_enabled: is_prerender_enabled(options, node, state),
 						is_error: false
 					});
 
@@ -1471,7 +1453,6 @@ async function respond$1(opts) {
 										url: request.url,
 										node: error_node,
 										stuff: node_loaded.stuff,
-										prerender_enabled: is_prerender_enabled(options, error_node, state),
 										is_error: true,
 										status,
 										error
@@ -1641,8 +1622,9 @@ function read_only_form_data() {
 		 * @param {string} value
 		 */
 		append(key, value) {
-			if (map.has(key)) {
-				(map.get(key) || []).push(value);
+			const existing_values = map.get(key);
+			if (existing_values) {
+				existing_values.push(value);
 			} else {
 				map.set(key, [value]);
 			}
@@ -1664,12 +1646,15 @@ class ReadOnlyFormData {
 	/** @param {string} key */
 	get(key) {
 		const value = this.#map.get(key);
-		return value && value[0];
+		if (!value) {
+			return null;
+		}
+		return value[0];
 	}
 
 	/** @param {string} key */
 	getAll(key) {
-		return this.#map.get(key);
+		return this.#map.get(key) || [];
 	}
 
 	/** @param {string} key */
@@ -1901,6 +1886,7 @@ async function respond(incoming, options, state = {}) {
 						url: request.url,
 						params: request.params,
 						options,
+						state,
 						$session: await options.hooks.getSession(request),
 						page_config: { router: true, hydrate: true },
 						stuff: {},
@@ -1935,9 +1921,25 @@ async function respond(incoming, options, state = {}) {
 								const etag = `"${hash(response.body || '')}"`;
 
 								if (if_none_match_value === etag) {
+									/** @type {import('types/helper').ResponseHeaders} */
+									const headers = { etag };
+
+									// https://datatracker.ietf.org/doc/html/rfc7232#section-4.1
+									for (const key of [
+										'cache-control',
+										'content-location',
+										'date',
+										'expires',
+										'vary'
+									]) {
+										if (key in response.headers) {
+											headers[key] = /** @type {string} */ (response.headers[key]);
+										}
+									}
+
 									return {
 										status: 304,
-										headers: {}
+										headers
 									};
 								}
 

package/assets/runtime/app/navigation.js

@@ -19,6 +19,8 @@ const goto = import.meta.env.SSR ? guard('goto') : goto_;
 const invalidate = import.meta.env.SSR ? guard('invalidate') : invalidate_;
 const prefetch = import.meta.env.SSR ? guard('prefetch') : prefetch_;
 const prefetchRoutes = import.meta.env.SSR ? guard('prefetchRoutes') : prefetchRoutes_;
+const beforeNavigate = import.meta.env.SSR ? () => {} : beforeNavigate_;
+const afterNavigate = import.meta.env.SSR ? () => {} : afterNavigate_;
 
 /**
  * @type {import('$app/navigation').goto}
@@ -62,4 +64,18 @@ async function prefetchRoutes_(pathnames) {
 	await Promise.all(promises);
 }
 
-export { disableScrollHandling, goto, invalidate, prefetch, prefetchRoutes };
+/**
+ * @type {import('$app/navigation').beforeNavigate}
+ */
+function beforeNavigate_(fn) {
+	if (router) router.before_navigate(fn);
+}
+
+/**
+ * @type {import('$app/navigation').afterNavigate}
+ */
+function afterNavigate_(fn) {
+	if (router) router.after_navigate(fn);
+}
+
+export { afterNavigate, beforeNavigate, disableScrollHandling, goto, invalidate, prefetch, prefetchRoutes };