@sveltejs/kit 2.55.0 → 2.56.1

package/src/runtime/client/remote-functions/shared.svelte.js

@@ -1,12 +1,18 @@
-/** @import { RemoteQueryOverride } from '@sveltejs/kit' */
-/** @import { RemoteFunctionResponse } from 'types' */
-/** @import { Query } from './query.svelte.js' */
+/** @import { RemoteFunctionResponse, RemoteRefreshMap } from 'types' */
+/** @import { RemoteQueryUpdate } from '@sveltejs/kit' */
 import * as devalue from 'devalue';
-import { app, goto, query_map, remote_responses } from '../client.js';
+import { app, goto, query_map } from '../client.js';
 import { HttpError, Redirect } from '@sveltejs/kit/internal';
-import { tick, untrack } from 'svelte';
-import { create_remote_key, stringify_remote_arg } from '../../shared.js';
-import { page } from '../state.svelte.js';
+import { untrack } from 'svelte';
+import { create_remote_key, split_remote_key } from '../../shared.js';
+import { navigating, page } from '../state.svelte.js';
+
+/** Indicates a query function, as opposed to a query instance */
+export const QUERY_FUNCTION_ID = Symbol('sveltekit.query_function_id');
+/** Indicates a query override callback, used to release the override */
+export const QUERY_OVERRIDE_KEY = Symbol('sveltekit.query_override_key');
+/** Indicates a query instance */
+export const QUERY_RESOURCE_KEY = Symbol('sveltekit.query_resource_key');
 
 /**
  * @returns {{ 'x-sveltekit-pathname': string, 'x-sveltekit-search': string }}
@@ -15,10 +21,14 @@ export function get_remote_request_headers() {
 	// This will be the correct value of the current or soon-current url,
 	// even in forks because it's state-based - therefore not using window.location.
 	// Use untrack(...) to Avoid accidental reactive dependency on pathname/search
-	return untrack(() => ({
-		'x-sveltekit-pathname': page.url.pathname,
-		'x-sveltekit-search': page.url.search
-	}));
+	return untrack(() => {
+		const url = navigating.current?.to?.url ?? page.url;
+
+		return {
+			'x-sveltekit-pathname': url.pathname,
+			'x-sveltekit-search': url.search
+		};
+	});
 }
 
 /**
@@ -52,103 +62,94 @@ export async function remote_request(url, headers) {
 }
 
 /**
- * Client-version of the `query`/`prerender`/`cache` function from `$app/server`.
- * @param {string} id
- * @param {(key: string, args: string) => any} create
+ * Given an array of updates, which could be query instances, query functions, or query override release functions,
+ * categorize them into overrides (which need to be released after the command completes), refreshes (which
+ * just need to be refreshed after the command completes), or both.
+ *
+ * @param {RemoteQueryUpdate[]} updates
+ * @returns {{ overrides: Array<() => void>, refreshes: Set<string> }}
  */
-export function create_remote_function(id, create) {
-	return (/** @type {any} */ arg) => {
-		const payload = stringify_remote_arg(arg, app.hooks.transport);
-		const cache_key = create_remote_key(id, payload);
-		let entry = query_map.get(cache_key);
-
-		let tracking = true;
-		try {
-			$effect.pre(() => {
-				if (entry) entry.count++;
-				return () => {
-					const entry = query_map.get(cache_key);
-					if (entry) {
-						entry.count--;
-						void tick().then(() => {
-							if (!entry.count && entry === query_map.get(cache_key)) {
-								query_map.delete(cache_key);
-								delete remote_responses[cache_key];
-							}
-						});
+export function categorize_updates(updates) {
+	/** @type {Set<string>} */
+	const override_keys = new Set();
+	/** @type {Array<() => void>} */
+	const overrides = [];
+	/** @type {Set<string>} */
+	const refreshes = new Set();
+
+	for (const update of updates) {
+		if (typeof update === 'function') {
+			if (Object.hasOwn(update, QUERY_FUNCTION_ID)) {
+				// this is a query function (not instance), so we need to find all active instances
+				// of this functionand request that they be refreshed by the command handler
+				// @ts-expect-error
+				const id = /** @type {string} */ (update[QUERY_FUNCTION_ID]);
+				const entries = query_map.get(id);
+
+				if (entries) {
+					for (const payload of entries.keys()) {
+						refreshes.add(create_remote_key(id, payload));
 					}
-				};
-			});
-		} catch {
-			tracking = false;
+				}
+
+				continue;
+			}
+
+			if (Object.hasOwn(update, QUERY_OVERRIDE_KEY)) {
+				// this is a query override release function, so we need to both request that the query instance
+				// be refreshed _and_ stash the release function so we can release the override after the command completes
+				// @ts-expect-error
+				const key = /** @type {string} */ (update[QUERY_OVERRIDE_KEY]);
+				refreshes.add(key);
+
+				if (override_keys.has(key)) {
+					throw new Error(
+						'Multiple overrides for the same query are not allowed in a single updates() invocation'
+					);
+				}
+
+				override_keys.add(key);
+				overrides.push(/** @type {() => void} */ (update));
+				continue;
+			}
 		}
 
-		let resource = entry?.resource;
-		if (!resource) {
-			resource = create(cache_key, payload);
-
-			Object.defineProperty(resource, '_key', {
-				value: cache_key
-			});
-
-			query_map.set(
-				cache_key,
-				(entry = {
-					count: tracking ? 1 : 0,
-					resource
-				})
-			);
-
-			resource
-				.then(() => {
-					void tick().then(() => {
-						if (
-							!(/** @type {NonNullable<typeof entry>} */ (entry).count) &&
-							entry === query_map.get(cache_key)
-						) {
-							// If no one is tracking this resource anymore, we can delete it from the cache
-							query_map.delete(cache_key);
-						}
-					});
-				})
-				.catch(() => {
-					// error delete the resource from the cache
-					// TODO is that correct?
-					query_map.delete(cache_key);
-				});
+		if (
+			typeof update === 'object' &&
+			update !== null &&
+			Object.hasOwn(update, QUERY_RESOURCE_KEY)
+		) {
+			// this is a query instance, so we just need to request that it be refreshed
+			// @ts-expect-error
+			refreshes.add(/** @type {string} */ (update[QUERY_RESOURCE_KEY]));
+			continue;
 		}
 
-		return resource;
-	};
-}
-
-/**
- * @param {Array<Query<any> | RemoteQueryOverride>} updates
- */
-export function release_overrides(updates) {
-	for (const update of updates) {
-		if ('release' in update) {
-			update.release();
-		}
+		throw new Error('updates() expects a query function, query resource, or query override');
 	}
+
+	return { overrides, refreshes };
 }
 
 /**
+ * Apply refresh data from the server to the relevant queries
+ *
  * @param {string} stringified_refreshes
- * @param {Array<Query<any> | RemoteQueryOverride>} updates
  */
-export function refresh_queries(stringified_refreshes, updates = []) {
-	const refreshes = Object.entries(devalue.parse(stringified_refreshes, app.decoders));
+export function apply_refreshes(stringified_refreshes) {
+	const refreshes = Object.entries(
+		/** @type {RemoteRefreshMap} */ (devalue.parse(stringified_refreshes, app.decoders))
+	);
 
-	// `refreshes` is a superset of `updates`
 	for (const [key, value] of refreshes) {
-		// If there was an optimistic update, release it right before we update the query
-		const update = updates.find((u) => u._key === key);
-		if (update && 'release' in update) {
-			update.release();
+		const parts = split_remote_key(key);
+
+		const entry = query_map.get(parts.id)?.get(parts.payload);
+
+		if (value.type === 'result') {
+			entry?.resource.set(value.data);
+		} else {
+			entry?.resource.fail(new HttpError(value.status ?? 500, value.error));
 		}
-		// Update the query with the new value
-		const entry = query_map.get(key);
-		entry?.resource.set(value);
 	}
 }

package/src/runtime/components/svelte-5/error.svelte

@@ -1,3 +1,5 @@
+<svelte:options runes={true} />
+
 <script>
 	import { page } from '$app/state';
 </script>

package/src/runtime/form-utils.js

@@ -84,10 +84,6 @@ export function serialize_binary_form(data, meta) {
 	/** @type {Array<[file: File, index: number]>} */
 	const files = [];
 
-	if (!meta.remote_refreshes?.length) {
-		delete meta.remote_refreshes;
-	}
-
 	const encoded_header = devalue.stringify([data, meta], {
 		File: (file) => {
 			if (!(file instanceof File)) return;
@@ -324,7 +320,7 @@ export async function deserialize_binary_form(request) {
 		}
 	}
 
-	// Read the request body asyncronously so it doesn't stall
+	// Read the request body asynchronously so it doesn't stall
 	void (async () => {
 		let has_more = true;
 		while (has_more) {
@@ -718,7 +714,7 @@ export function create_field_proxy(target, get_input, set_input, get_issues, pat
 							value: {
 								enumerable: true,
 								get() {
-									return get_value();
+									return input_value !== undefined ? input_value : get_value();
 								}
 							}
 						});
@@ -804,7 +800,7 @@ export function create_field_proxy(target, get_input, set_input, get_issues, pat
 						value: {
 							enumerable: true,
 							get() {
-								const value = get_value();
+								const value = input_value !== undefined ? input_value : get_value();
 								return value != null ? String(value) : '';
 							}
 						}

package/src/runtime/server/endpoint.js

@@ -42,7 +42,6 @@ export async function render_endpoint(event, event_state, mod, state) {
 	}
 
 	try {
-		event_state.allows_commands = true;
 		const response = await with_request_store({ event, state: event_state }, () =>
 			handler(/** @type {import('@sveltejs/kit').RequestEvent<Record<string, any>>} */ (event))
 		);

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

@@ -266,10 +266,11 @@ async function call_action(event, event_state, actions) {
 		},
 		fn: async (current) => {
 			const traced_event = merge_tracing(event, current);
-			event_state.allows_commands = true;
+
 			const result = await with_request_store({ event: traced_event, state: event_state }, () =>
 				action(traced_event)
 			);
+
 			if (result instanceof ActionFailure) {
 				current.setAttributes({
 					'sveltekit.form_action.result.type': 'failure',

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

@@ -233,7 +233,9 @@ export async function load_data({
 		},
 		fn: async (current) => {
 			const traced_event = merge_tracing(event, current);
-			return await with_request_store({ event: traced_event, state: event_state }, () =>
+			const child_state = { ...event_state, is_in_universal_load: true };
+
+			return await with_request_store({ event: traced_event, state: child_state }, () =>
 				load.call(null, {
 					url: event.url,
 					params: event.params,

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

@@ -1,7 +1,7 @@
 import * as devalue from 'devalue';
 import { readable, writable } from 'svelte/store';
 import { DEV } from 'esm-env';
-import { text } from '@sveltejs/kit';
+import { isRedirect, text } from '@sveltejs/kit';
 import * as paths from '$app/paths/internal/server';
 import { hash } from '../../../utils/hash.js';
 import { serialize_data } from './serialize_data.js';
@@ -189,6 +189,10 @@ export async function render_response({
 			csp: csp.script_needs_nonce ? { nonce: csp.nonce } : { hash: csp.script_needs_hash },
 			transformError: error_components
 				? /** @param {unknown} e */ async (e) => {
+						if (isRedirect(e)) {
+							throw e;
+						}
+
 						const transformed = await handle_error_and_jsonify(event, event_state, options, e);
 						props.page.error = props.error = error = transformed;
 						props.page.status = status = get_status(e);
@@ -218,8 +222,9 @@ export async function render_response({
 				};
 			}
 
-			event_state.allows_commands = false;
-			rendered = await with_request_store({ event, state: event_state }, async () => {
+			const state = { ...event_state, is_in_render: true };
+
+			rendered = await with_request_store({ event, state }, async () => {
 				// use relative paths during rendering, so that the resulting HTML is as
 				// portable as possible, but reset afterwards
 				if (paths.relative) paths.override({ base, assets });
@@ -498,31 +503,41 @@ export async function render_response({
 			args.push(`{\n${indent}\t${hydrate.join(`,\n${indent}\t`)}\n${indent}}`);
 		}
 
-		const { remote_data: remote_cache } = event_state;
+		const { remote } = event_state;
 
-		let serialized_remote_data = '';
+		let serialized_query_data = '';
+		let serialized_prerender_data = '';
 
-		if (remote_cache) {
+		if (remote.data) {
 			/** @type {Record<string, any>} */
-			const remote = {};
+			const query = {};
 
-			for (const [info, cache] of remote_cache) {
+			/** @type {Record<string, any>} */
+			const prerender = {};
+
+			for (const [internals, cache] of remote.data) {
 				// remote functions without an `id` aren't exported, and thus
 				// cannot be called from the client
-				if (!info.id) continue;
+				if (!internals.id) continue;
 
 				for (const key in cache) {
-					const remote_key = create_remote_key(info.id, key);
+					const entry = cache[key];
+
+					if (!entry.serialize) continue;
 
-					if (event_state.refreshes?.[remote_key] !== undefined) {
+					const remote_key = create_remote_key(internals.id, key);
+
+					const store = internals.type === 'prerender' ? prerender : query;
+
+					if (event_state.remote.refreshes?.[remote_key] !== undefined) {
 						// This entry was refreshed/set by a command or form action.
 						// Always await it so the mutation result is serialized.
-						remote[remote_key] = await cache[key];
+						store[remote_key] = await entry.data;
 					} else {
 						// Don't block the response on pending remote data - if a query
 						// hasn't settled yet, it wasn't awaited in the template (or is behind a pending boundary).
 						const result = await Promise.race([
-							Promise.resolve(cache[key]).then(
+							Promise.resolve(entry.data).then(
 								(v) => /** @type {const} */ ({ settled: true, value: v }),
 								(e) => /** @type {const} */ ({ settled: true, error: e })
 							),
@@ -533,7 +548,7 @@ export async function render_response({
 
 						if (result.settled) {
 							if ('error' in result) throw result.error;
-							remote[remote_key] = result.value;
+							store[remote_key] = result.value;
 						}
 					}
 				}
@@ -549,9 +564,17 @@ export async function render_response({
 				}
 			};
 
-			serialized_remote_data = `${global}.data = ${devalue.uneval(remote, replacer)};\n\n\t\t\t\t\t\t`;
+			if (Object.keys(query).length > 0) {
+				serialized_query_data = `${global}.query = ${devalue.uneval(query, replacer)};\n\n\t\t\t\t\t\t`;
+			}
+
+			if (Object.keys(prerender).length > 0) {
+				serialized_prerender_data = `${global}.prerender = ${devalue.uneval(prerender, replacer)};\n\n\t\t\t\t\t\t`;
+			}
 		}
 
+		const serialized_remote_data = `${serialized_query_data}${serialized_prerender_data}`;
+
 		// `client.app` is a proxy for `bundleStrategy === 'split'`
 		const boot = client.inline
 			? `${client.inline.script}

package/src/runtime/server/remote.js

@@ -1,12 +1,12 @@
 /** @import { ActionResult, RemoteForm, RequestEvent, SSRManifest } from '@sveltejs/kit' */
-/** @import { RemoteFunctionResponse, RemoteInfo, RequestState, SSROptions } from 'types' */
+/** @import { RemoteFormInternals, RemoteFunctionResponse, RemoteInternals, RequestState, SSROptions } from 'types' */
 
 import { json, error } from '@sveltejs/kit';
 import { HttpError, Redirect, SvelteKitError } from '@sveltejs/kit/internal';
 import { with_request_store, merge_tracing } from '@sveltejs/kit/internal/server';
 import { app_dir, base } from '$app/paths/internal/server';
 import { is_form_content_type } from '../../utils/http.js';
-import { parse_remote_arg, stringify } from '../shared.js';
+import { parse_remote_arg, split_remote_key, stringify } from '../shared.js';
 import { handle_error_and_jsonify } from './utils.js';
 import { normalize_error } from '../../utils/error.js';
 import { check_incorrect_fail_use } from './page/actions.js';
@@ -48,20 +48,17 @@ async function handle_remote_call_internal(event, state, options, manifest, id)
 
 	if (!fn) error(404);
 
-	/** @type {RemoteInfo} */
-	const info = fn.__;
+	/** @type {RemoteInternals} */
+	const internals = fn.__;
 	const transport = options.hooks.transport;
 
 	event.tracing.current.setAttributes({
-		'sveltekit.remote.call.type': info.type,
-		'sveltekit.remote.call.name': info.name
+		'sveltekit.remote.call.type': internals.type,
+		'sveltekit.remote.call.name': internals.name
 	});
 
-	/** @type {string[] | undefined} */
-	let form_client_refreshes;
-
 	try {
-		if (info.type === 'query_batch') {
+		if (internals.type === 'query_batch') {
 			if (event.request.method !== 'POST') {
 				throw new SvelteKitError(
 					405,
@@ -77,7 +74,9 @@ async function handle_remote_call_internal(event, state, options, manifest, id)
 				payloads.map((payload) => parse_remote_arg(payload, transport))
 			);
 
-			const results = await with_request_store({ event, state }, () => info.run(args, options));
+			const results = await with_request_store({ event, state }, () =>
+				internals.run(args, options)
+			);
 
 			return json(
 				/** @type {RemoteFunctionResponse} */ ({
@@ -87,7 +86,7 @@ async function handle_remote_call_internal(event, state, options, manifest, id)
 			);
 		}
 
-		if (info.type === 'form') {
+		if (internals.type === 'form') {
 			if (event.request.method !== 'POST') {
 				throw new SvelteKitError(
 					405,
@@ -107,8 +106,7 @@ async function handle_remote_call_internal(event, state, options, manifest, id)
 			}
 
 			const { data, meta, form_data } = await deserialize_binary_form(event.request);
-
-			form_client_refreshes = meta.remote_refreshes;
+			state.remote.requested = create_requested_map(meta.remote_refreshes);
 
 			// If this is a keyed form instance (created via form.for(key)), add the key to the form data (unless already set)
 			// Note that additional_args will only be set if the form is not enhanced, as enhanced forms transfer the key inside `data`.
@@ -116,21 +114,22 @@ async function handle_remote_call_internal(event, state, options, manifest, id)
 				data.id = JSON.parse(decodeURIComponent(additional_args));
 			}
 
-			const fn = info.fn;
+			const fn = internals.fn;
 			const result = await with_request_store({ event, state }, () => fn(data, meta, form_data));
 
 			return json(
 				/** @type {RemoteFunctionResponse} */ ({
 					type: 'result',
 					result: stringify(result, transport),
-					refreshes: result.issues ? undefined : await serialize_refreshes(meta.remote_refreshes)
+					refreshes: result.issues ? undefined : await serialize_refreshes()
 				})
 			);
 		}
 
-		if (info.type === 'command') {
-			/** @type {{ payload: string, refreshes: string[] }} */
+		if (internals.type === 'command') {
+			/** @type {{ payload: string, refreshes?: string[] }} */
 			const { payload, refreshes } = await event.request.json();
+			state.remote.requested = create_requested_map(refreshes);
 			const arg = parse_remote_arg(payload, transport);
 			const data = await with_request_store({ event, state }, () => fn(arg));
 
@@ -138,13 +137,13 @@ async function handle_remote_call_internal(event, state, options, manifest, id)
 				/** @type {RemoteFunctionResponse} */ ({
 					type: 'result',
 					result: stringify(data, transport),
-					refreshes: await serialize_refreshes(refreshes)
+					refreshes: await serialize_refreshes()
 				})
 			);
 		}
 
 		const payload =
-			info.type === 'prerender'
+			internals.type === 'prerender'
 				? additional_args
 				: /** @type {string} */ (
 						// new URL(...) necessary because we're hiding the URL from the user in the event object
@@ -167,7 +166,7 @@ async function handle_remote_call_internal(event, state, options, manifest, id)
 				/** @type {RemoteFunctionResponse} */ ({
 					type: 'redirect',
 					location: error.location,
-					refreshes: await serialize_refreshes(form_client_refreshes)
+					refreshes: await serialize_refreshes()
 				})
 			);
 		}
@@ -192,42 +191,58 @@ async function handle_remote_call_internal(event, state, options, manifest, id)
 		);
 	}
 
-	/**
-	 * @param {string[]=} client_refreshes
-	 */
-	async function serialize_refreshes(client_refreshes) {
-		const refreshes = state.refreshes ?? {};
+	async function serialize_refreshes() {
+		const refreshes = state.remote.refreshes ?? {};
+
+		const entries = Object.entries(refreshes);
+		if (entries.length === 0) {
+			return undefined;
+		}
 
-		if (client_refreshes) {
-			for (const key of client_refreshes) {
-				if (refreshes[key] !== undefined) continue;
+		const results = await Promise.all(
+			entries.map(async ([key, promise]) => {
+				try {
+					return [key, { type: 'result', data: await promise }];
+				} catch (error) {
+					const status =
+						error instanceof HttpError || error instanceof SvelteKitError ? error.status : 500;
+
+					return [
+						key,
+						{
+							type: 'error',
+							status,
+							error: await handle_error_and_jsonify(event, state, options, error)
+						}
+					];
+				}
+			})
+		);
 
-				const [hash, name, payload] = key.split('/');
+		return stringify(Object.fromEntries(results), transport);
+	}
+}
 
-				const loader = manifest._.remotes[hash];
-				const fn = (await loader?.())?.default?.[name];
+/**
+ * @param {string[] | undefined} refreshes
+ */
+function create_requested_map(refreshes) {
+	/** @type {Map<string, string[]>} */
+	const requested = new Map();
 
-				if (!fn) error(400, 'Bad Request');
+	for (const key of refreshes ?? []) {
+		const parts = split_remote_key(key);
 
-				refreshes[key] = with_request_store({ event, state }, () =>
-					fn(parse_remote_arg(payload, transport))
-				);
-			}
-		}
+		const existing = requested.get(parts.id);
 
-		if (Object.keys(refreshes).length === 0) {
-			return undefined;
+		if (existing) {
+			existing.push(parts.payload);
+		} else {
+			requested.set(parts.id, [parts.payload]);
 		}
-
-		return stringify(
-			Object.fromEntries(
-				await Promise.all(
-					Object.entries(refreshes).map(async ([key, promise]) => [key, await promise])
-				)
-			),
-			transport
-		);
 	}
+
+	return requested;
 }
 
 /** @type {typeof handle_remote_form_post_internal} */
@@ -282,7 +297,7 @@ async function handle_remote_form_post_internal(event, state, manifest, id) {
 	}
 
 	try {
-		const fn = /** @type {RemoteInfo & { type: 'form' }} */ (/** @type {any} */ (form).__).fn;
+		const fn = /** @type {RemoteFormInternals} */ (/** @type {any} */ (form).__).fn;
 
 		const { data, meta, form_data } = await deserialize_binary_form(event.request);
 

package/src/runtime/server/respond.js

@@ -39,7 +39,6 @@ import { server_data_serializer } from './page/data_serializer.js';
 import { get_remote_id, handle_remote_call } from './remote.js';
 import { record_span } from '../telemetry/record_span.js';
 import { otel } from '../telemetry/otel.js';
-import { MUTATIVE_METHODS } from '../../constants.js';
 
 /* global __SVELTEKIT_ADAPTER_NAME__ */
 
@@ -150,7 +149,22 @@ export async function internal_respond(request, options, manifest, state) {
 		tracing: {
 			record_span
 		},
-		is_in_remote_function: false
+		remote: {
+			data: null,
+			forms: null,
+			/** A map of remote function key to corresponding single-flight-mutation promise */
+			refreshes: null,
+			/** A map of remote function ID to payloads requested for refreshing by the client */
+			requested: null,
+			/**
+			 * A map of remote function ID to objects that have passed validation;
+			 * used to prevent revalidating parameters returned from `requested`
+			 */
+			validated: null
+		},
+		is_in_remote_function: false,
+		is_in_render: false,
+		is_in_universal_load: false
 	};
 
 	/** @type {import('@sveltejs/kit').RequestEvent} */
@@ -420,7 +434,7 @@ export async function internal_respond(request, options, manifest, state) {
 						current: root_span
 					}
 				};
-				event_state.allows_commands = MUTATIVE_METHODS.includes(request.method);
+
 				return await with_request_store({ event: traced_event, state: event_state }, () =>
 					options.hooks.handle({
 						event: traced_event,