@sveltejs/kit 1.0.0-next.46 → 1.0.0-next.460

package/src/runtime/client/fetcher.js

@@ -0,0 +1,60 @@
+import { hash } from '../hash.js';
+
+let loading = 0;
+
+export const native_fetch = window.fetch;
+
+export function lock_fetch() {
+	loading += 1;
+}
+
+export function unlock_fetch() {
+	loading -= 1;
+}
+
+if (import.meta.env.DEV) {
+	let can_inspect_stack_trace = false;
+
+	const check_stack_trace = async () => {
+		const stack = /** @type {string} */ (new Error().stack);
+		can_inspect_stack_trace = stack.includes('check_stack_trace');
+	};
+
+	check_stack_trace();
+
+	window.fetch = (input, init) => {
+		const url = input instanceof Request ? input.url : input.toString();
+		const stack = /** @type {string} */ (new Error().stack);
+
+		const heuristic = can_inspect_stack_trace ? stack.includes('load_node') : loading;
+		if (heuristic) {
+			console.warn(
+				`Loading ${url} using \`window.fetch\`. For best results, use the \`fetch\` that is passed to your \`load\` function: https://kit.svelte.dev/docs/load#input-fetch`
+			);
+		}
+
+		return native_fetch(input, init);
+	};
+}
+
+/**
+ * @param {RequestInfo} resource
+ * @param {RequestInit} [opts]
+ */
+export function initial_fetch(resource, opts) {
+	const url = JSON.stringify(typeof resource === 'string' ? resource : resource.url);
+
+	let selector = `script[data-sveltekit-fetched][data-url=${url}]`;
+
+	if (opts && typeof opts.body === 'string') {
+		selector += `[data-hash="${hash(opts.body)}"]`;
+	}
+
+	const script = document.querySelector(selector);
+	if (script && script.textContent) {
+		const { body, ...init } = JSON.parse(script.textContent);
+		return Promise.resolve(new Response(body, init));
+	}
+
+	return native_fetch(resource, opts);
+}

package/src/runtime/client/parse.js

@@ -0,0 +1,60 @@
+import { exec, parse_route_id } from '../../utils/routing.js';
+
+/**
+ * @param {import('types').CSRPageNodeLoader[]} nodes
+ * @param {number[]} server_loads
+ * @param {typeof import('__GENERATED__/client-manifest.js').dictionary} dictionary
+ * @param {Record<string, (param: string) => boolean>} matchers
+ * @returns {import('types').CSRRoute[]}
+ */
+export function parse(nodes, server_loads, dictionary, matchers) {
+	const layouts_with_server_load = new Set(server_loads);
+
+	return Object.entries(dictionary).map(([id, [leaf, layouts, errors]]) => {
+		const { pattern, names, types } = parse_route_id(id);
+
+		const route = {
+			id,
+			/** @param {string} path */
+			exec: (path) => {
+				const match = pattern.exec(path);
+				if (match) return exec(match, names, types, matchers);
+			},
+			errors: [1, ...(errors || [])].map((n) => nodes[n]),
+			layouts: [0, ...(layouts || [])].map(create_layout_loader),
+			leaf: create_leaf_loader(leaf)
+		};
+
+		// bit of a hack, but ensures that layout/error node lists are the same
+		// length, without which the wrong data will be applied if the route
+		// manifest looks like `[[a, b], [c,], d]`
+		route.errors.length = route.layouts.length = Math.max(
+			route.errors.length,
+			route.layouts.length
+		);
+
+		return route;
+	});
+
+	/**
+	 * @param {number} id
+	 * @returns {[boolean, import('types').CSRPageNodeLoader]}
+	 */
+	function create_leaf_loader(id) {
+		// whether or not the route uses the server data is
+		// encoded using the ones' complement, to save space
+		const uses_server_data = id < 0;
+		if (uses_server_data) id = ~id;
+		return [uses_server_data, nodes[id]];
+	}
+
+	/**
+	 * @param {number | undefined} id
+	 * @returns {[boolean, import('types').CSRPageNodeLoader] | undefined}
+	 */
+	function create_layout_loader(id) {
+		// whether or not the layout uses the server data is
+		// encoded in the layouts array, to save space
+		return id === undefined ? id : [layouts_with_server_load.has(id), nodes[id]];
+	}
+}

package/src/runtime/client/singletons.js

@@ -0,0 +1,21 @@
+import { writable } from 'svelte/store';
+import { create_updated_store, notifiable_store } from './utils.js';
+
+/** @type {import('./types').Client} */
+export let client;
+
+/**
+ * @param {{
+ *   client: import('./types').Client;
+ * }} opts
+ */
+export function init(opts) {
+	client = opts.client;
+}
+
+export const stores = {
+	url: notifiable_store({}),
+	page: notifiable_store({}),
+	navigating: writable(/** @type {import('types').Navigation | null} */ (null)),
+	updated: create_updated_store()
+};

package/src/runtime/client/start.js

@@ -0,0 +1,45 @@
+import { create_client } from './client.js';
+import { init } from './singletons.js';
+import { set_paths } from '../paths.js';
+import { set_public_env } from '../env-public.js';
+
+/**
+ * @param {{
+ *   env: Record<string, string>;
+ *   hydrate: {
+ *     status: number;
+ *     error: Error | (import('../server/page/types').SerializedHttpError);
+ *     node_ids: number[];
+ *     params: Record<string, string>;
+ *     routeId: string | null;
+ *     data: Array<import('types').ServerDataNode | null>;
+ *     errors: Record<string, any> | null;
+ *   };
+ *   paths: {
+ *     assets: string;
+ *     base: string;
+ *   },
+ *   target: Element;
+ *   trailing_slash: import('types').TrailingSlash;
+ * }} opts
+ */
+export async function start({ env, hydrate, paths, target, trailing_slash }) {
+	set_public_env(env);
+	set_paths(paths);
+
+	const client = create_client({
+		target,
+		base: paths.base,
+		trailing_slash
+	});
+
+	init({ client });
+
+	if (hydrate) {
+		await client._hydrate(hydrate);
+	} else {
+		client.goto(location.href, { replaceState: true });
+	}
+
+	client._start_router();
+}

package/src/runtime/client/types.d.ts

@@ -0,0 +1,88 @@
+import {
+	afterNavigate,
+	beforeNavigate,
+	goto,
+	invalidate,
+	prefetch,
+	prefetchRoutes
+} from '$app/navigation';
+import { CSRPageNode, CSRPageNodeLoader, CSRRoute, Uses } from 'types';
+import { HttpError } from '../control.js';
+import { SerializedHttpError } from '../server/page/types.js';
+
+export interface Client {
+	// public API, exposed via $app/navigation
+	after_navigate: typeof afterNavigate;
+	before_navigate: typeof beforeNavigate;
+	disable_scroll_handling: () => void;
+	goto: typeof goto;
+	invalidate: typeof invalidate;
+	prefetch: typeof prefetch;
+	prefetch_routes: typeof prefetchRoutes;
+
+	// private API
+	_hydrate: (opts: {
+		status: number;
+		error: Error | SerializedHttpError;
+		node_ids: number[];
+		params: Record<string, string>;
+		routeId: string | null;
+		data: Array<import('types').ServerDataNode | null>;
+		errors: Record<string, any> | null;
+	}) => Promise<void>;
+	_start_router: () => void;
+}
+
+export type NavigationIntent = {
+	/**
+	 * `url.pathname + url.search`
+	 */
+	id: string;
+	/**
+	 * The route parameters
+	 */
+	params: Record<string, string>;
+	/**
+	 * The route that matches `path`
+	 */
+	route: CSRRoute;
+	/**
+	 * The destination URL
+	 */
+	url: URL;
+};
+
+export type NavigationResult = NavigationRedirect | NavigationFinished;
+
+export type NavigationRedirect = {
+	type: 'redirect';
+	location: string;
+};
+
+export type NavigationFinished = {
+	type: 'loaded';
+	state: NavigationState;
+	props: Record<string, any>;
+};
+
+export type BranchNode = {
+	node: CSRPageNode;
+	loader: CSRPageNodeLoader;
+	server: DataNode | null;
+	shared: DataNode | null;
+	data: Record<string, any> | null;
+};
+
+export interface DataNode {
+	type: 'data';
+	data: Record<string, any> | null;
+	uses: Uses;
+}
+
+export type NavigationState = {
+	branch: Array<BranchNode | undefined>;
+	error: HttpError | Error | null;
+	params: Record<string, string>;
+	session_id: number;
+	url: URL;
+};

package/src/runtime/client/utils.js

@@ -0,0 +1,140 @@
+import { writable } from 'svelte/store';
+import { assets } from '../paths.js';
+
+/* global __SVELTEKIT_APP_VERSION__, __SVELTEKIT_APP_VERSION_FILE__, __SVELTEKIT_APP_VERSION_POLL_INTERVAL__ */
+
+/** @param {HTMLDocument} doc */
+export function get_base_uri(doc) {
+	let baseURI = doc.baseURI;
+
+	if (!baseURI) {
+		const baseTags = doc.getElementsByTagName('base');
+		baseURI = baseTags.length ? baseTags[0].href : doc.URL;
+	}
+
+	return baseURI;
+}
+
+export function scroll_state() {
+	return {
+		x: pageXOffset,
+		y: pageYOffset
+	};
+}
+
+/** @param {Event} event */
+export function find_anchor(event) {
+	/** @type {HTMLAnchorElement | SVGAElement | undefined} */
+	let a;
+
+	const options = {
+		/** @type {string | null} */
+		noscroll: null,
+
+		/** @type {string | null} */
+		prefetch: null,
+
+		/** @type {string | null} */
+		reload: null
+	};
+
+	for (const element of event.composedPath()) {
+		if (!(element instanceof Element)) continue;
+
+		if (!a && element.nodeName.toUpperCase() === 'A') {
+			// SVG <a> elements have a lowercase name
+			a = /** @type {HTMLAnchorElement | SVGAElement} */ (element);
+		}
+
+		if (options.noscroll === null) {
+			options.noscroll = element.getAttribute('data-sveltekit-noscroll');
+		}
+
+		if (options.prefetch === null) {
+			options.prefetch = element.getAttribute('data-sveltekit-prefetch');
+		}
+
+		if (options.reload === null) {
+			options.reload = element.getAttribute('data-sveltekit-reload');
+		}
+	}
+
+	const url = a && new URL(a instanceof SVGAElement ? a.href.baseVal : a.href, document.baseURI);
+
+	return { a, url, options };
+}
+
+/** @param {any} value */
+export function notifiable_store(value) {
+	const store = writable(value);
+	let ready = true;
+
+	function notify() {
+		ready = true;
+		store.update((val) => val);
+	}
+
+	/** @param {any} new_value */
+	function set(new_value) {
+		ready = false;
+		store.set(new_value);
+	}
+
+	/** @param {(value: any) => void} run */
+	function subscribe(run) {
+		/** @type {any} */
+		let old_value;
+		return store.subscribe((new_value) => {
+			if (old_value === undefined || (ready && new_value !== old_value)) {
+				run((old_value = new_value));
+			}
+		});
+	}
+
+	return { notify, set, subscribe };
+}
+
+export function create_updated_store() {
+	const { set, subscribe } = writable(false);
+
+	const interval = __SVELTEKIT_APP_VERSION_POLL_INTERVAL__;
+
+	/** @type {NodeJS.Timeout} */
+	let timeout;
+
+	async function check() {
+		if (import.meta.env.DEV || import.meta.env.SSR) return false;
+
+		clearTimeout(timeout);
+
+		if (interval) timeout = setTimeout(check, interval);
+
+		const res = await fetch(`${assets}/${__SVELTEKIT_APP_VERSION_FILE__}`, {
+			headers: {
+				pragma: 'no-cache',
+				'cache-control': 'no-cache'
+			}
+		});
+
+		if (res.ok) {
+			const { version } = await res.json();
+			const updated = version !== __SVELTEKIT_APP_VERSION__;
+
+			if (updated) {
+				set(true);
+				clearTimeout(timeout);
+			}
+
+			return updated;
+		} else {
+			throw new Error(`Version check failed: ${res.status}`);
+		}
+	}
+
+	if (interval) timeout = setTimeout(check, interval);
+
+	return {
+		subscribe,
+		check
+	};
+}

package/src/runtime/components/error.svelte

@@ -0,0 +1,16 @@
+<script>
+	import { page } from '$app/stores';
+</script>
+
+<h1>{$page.status}</h1>
+
+<pre>{$page.error.message}</pre>
+
+<!-- TODO figure out what to do with frames/stacktraces in prod -->
+<!-- frame is populated by Svelte in its CompileError and is a Rollup/Vite convention -->
+{#if $page.error.frame}
+	<pre>{$page.error.frame}</pre>
+{/if}
+{#if $page.error.stack}
+	<pre>{$page.error.stack}</pre>
+{/if}

package/src/runtime/control.js

@@ -0,0 +1,33 @@
+export class HttpError {
+	// without these, things like `$page.error.stack` will error. we don't want to
+	// include a stack for these sorts of errors, but we also don't want red
+	// squigglies everywhere, so this feels like a not-terribile compromise
+	name = 'HttpError';
+
+	/** @type {void} */
+	stack = undefined;
+
+	/**
+	 * @param {number} status
+	 * @param {string | undefined} message
+	 */
+	constructor(status, message) {
+		this.status = status;
+		this.message = message ?? `Error: ${status}`;
+	}
+
+	toString() {
+		return this.message;
+	}
+}
+
+export class Redirect {
+	/**
+	 * @param {number} status
+	 * @param {string} location
+	 */
+	constructor(status, location) {
+		this.status = status;
+		this.location = location;
+	}
+}

package/src/runtime/env/dynamic/private.js

@@ -0,0 +1 @@
+export { env } from '../../env-private.js';

package/src/runtime/env/dynamic/public.js

@@ -0,0 +1 @@
+export { env } from '../../env-public.js';

package/src/runtime/env-private.js

@@ -0,0 +1,6 @@
+export let env = {};
+
+/** @type {(environment: Record<string, string>) => void} */
+export function set_private_env(environment) {
+	env = environment;
+}

package/src/runtime/env-public.js

@@ -0,0 +1,6 @@
+export let env = {};
+
+/** @type {(environment: Record<string, string>) => void} */
+export function set_public_env(environment) {
+	env = environment;
+}

package/src/runtime/env.js

@@ -0,0 +1,6 @@
+export let prerendering = false;
+
+/** @param {boolean} value */
+export function set_prerendering(value) {
+	prerendering = value;
+}

package/src/runtime/hash.js

@@ -0,0 +1,16 @@
+/**
+ * Hash using djb2
+ * @param {import('types').StrictBody} value
+ */
+export function hash(value) {
+	let hash = 5381;
+	let i = value.length;
+
+	if (typeof value === 'string') {
+		while (i) hash = (hash * 33) ^ value.charCodeAt(--i);
+	} else {
+		while (i) hash = (hash * 33) ^ value[--i];
+	}
+
+	return (hash >>> 0).toString(36);
+}

package/src/runtime/paths.js

@@ -0,0 +1,11 @@
+/** @type {string} */
+export let base = '';
+
+/** @type {string} */
+export let assets = '';
+
+/** @param {{ base: string, assets: string }} paths */
+export function set_paths(paths) {
+	base = paths.base;
+	assets = paths.assets || base;
+}

package/src/runtime/server/data/index.js

@@ -0,0 +1,146 @@
+import { HttpError, Redirect } from '../../control.js';
+import { normalize_error } from '../../../utils/error.js';
+import { once } from '../../../utils/functions.js';
+import { load_server_data } from '../page/load_data.js';
+import { data_response, error_to_pojo } from '../utils.js';
+import { normalize_path } from '../../../utils/url.js';
+import { DATA_SUFFIX } from '../../../constants.js';
+
+/**
+ * @param {import('types').RequestEvent} event
+ * @param {import('types').SSRRoute} route
+ * @param {import('types').SSROptions} options
+ * @param {import('types').SSRState} state
+ * @returns {Promise<Response>}
+ */
+export async function render_data(event, route, options, state) {
+	if (!route.page) {
+		// requesting /__data.js should fail for a +server.js
+		return new Response(undefined, {
+			status: 404
+		});
+	}
+
+	try {
+		const node_ids = [...route.page.layouts, route.page.leaf];
+
+		const invalidated =
+			event.url.searchParams
+				.get('__invalid')
+				?.split('')
+				.map((x) => x === 'y') ?? node_ids.map(() => true);
+
+		let aborted = false;
+
+		const url = new URL(event.url);
+		url.pathname = normalize_path(
+			url.pathname.slice(0, -DATA_SUFFIX.length),
+			options.trailing_slash
+		);
+
+		url.searchParams.delete('__invalid');
+		url.searchParams.delete('__id');
+
+		const new_event = { ...event, url };
+
+		const functions = node_ids.map((n, i) => {
+			return once(async () => {
+				try {
+					if (aborted) {
+						return /** @type {import('types').ServerDataSkippedNode} */ ({
+							type: 'skip'
+						});
+					}
+
+					// == because it could be undefined (in dev) or null (in build, because of JSON.stringify)
+					const node = n == undefined ? n : await options.manifest._.nodes[n]();
+					return load_server_data({
+						event: new_event,
+						state,
+						node,
+						parent: async () => {
+							/** @type {Record<string, any>} */
+							const data = {};
+							for (let j = 0; j < i; j += 1) {
+								const parent = /** @type {import('types').ServerDataNode | null} */ (
+									await functions[j]()
+								);
+
+								if (parent) {
+									Object.assign(data, parent.data);
+								}
+							}
+							return data;
+						}
+					});
+				} catch (e) {
+					aborted = true;
+					throw e;
+				}
+			});
+		});
+
+		const promises = functions.map(async (fn, i) => {
+			if (!invalidated[i]) {
+				return /** @type {import('types').ServerDataSkippedNode} */ ({
+					type: 'skip'
+				});
+			}
+
+			return fn();
+		});
+
+		let length = promises.length;
+		const nodes = await Promise.all(
+			promises.map((p, i) =>
+				p.catch((e) => {
+					const error = normalize_error(e);
+
+					if (error instanceof Redirect) {
+						throw error;
+					}
+
+					// Math.min because array isn't guaranteed to resolve in order
+					length = Math.min(length, i + 1);
+
+					if (error instanceof HttpError) {
+						return /** @type {import('types').ServerErrorNode} */ ({
+							type: 'error',
+							httperror: { ...error }
+						});
+					}
+
+					options.handle_error(error, event);
+
+					return /** @type {import('types').ServerErrorNode} */ ({
+						type: 'error',
+						error: error_to_pojo(error, options.get_stack)
+					});
+				})
+			)
+		);
+
+		/** @type {import('types').ServerData} */
+		const server_data = {
+			type: 'data',
+			nodes: nodes.slice(0, length)
+		};
+
+		return data_response(server_data);
+	} catch (e) {
+		const error = normalize_error(e);
+
+		if (error instanceof Redirect) {
+			/** @type {import('types').ServerData} */
+			const server_data = {
+				type: 'redirect',
+				location: error.location
+			};
+
+			return data_response(server_data);
+		} else {
+			// TODO make it clearer that this was an unexpected error
+			return data_response(error_to_pojo(error, options.get_stack));
+		}
+	}
+}