@sveltejs/kit 3.0.0-next.14 → 3.0.0-next.16

package/src/runtime/app/internal/transport.js

@@ -0,0 +1,53 @@
+/** @import { Transport } from '@sveltejs/kit' */
+import * as devalue from 'devalue';
+import { DEV } from 'esm-env';
+
+/** @type {(thing: any) => string} */
+export let uneval = () => {
+	throw new Error(DEV ? 'called uneval before init_transport' : '');
+};
+
+/** @type {(data: any) => string} */
+export let stringify = () => {
+	throw new Error(DEV ? 'called stringify before init_transport' : '');
+};
+
+/** @type {(data: string) => any} */
+export let parse = () => {
+	throw new Error(DEV ? 'called parse before init_transport' : '');
+};
+
+/** @type {Record<string, (data: any) => any>} */
+export let encoders = {};
+
+/** @type {Record<string, (data: any) => any>} */
+export let decoders = {};
+
+export let has_custom_transporters = false;
+
+/**
+ *
+ * @param {Transport} transport
+ */
+export function init_transport(transport) {
+	const transporters = Object.entries(transport);
+
+	has_custom_transporters = transporters.length > 0;
+
+	/** @param {unknown} thing */
+	const replacer = (thing) => {
+		for (const key of Object.keys(transport)) {
+			const encoded = transport[key].encode(thing);
+			if (encoded) {
+				return `app.decode('${key}', ${devalue.uneval(encoded, replacer)})`;
+			}
+		}
+	};
+
+	encoders = Object.fromEntries(transporters.map(([k, v]) => [k, v.encode]));
+	decoders = Object.fromEntries(transporters.map(([k, v]) => [k, v.decode]));
+
+	uneval = (data) => devalue.uneval(data, replacer);
+	stringify = (data) => devalue.stringify(data, encoders);
+	parse = (data) => devalue.parse(data, decoders);
+}

package/src/runtime/app/paths/client.js

@@ -1,4 +1,4 @@
-/** @import { AssetPath, RouteId, RouteIdWithSearchOrHash, Path, PathnameWithSearchOrHash, ResolvedPathname, RouteParams } from '$app/types' */
+/** @import { AssetPath, RouteId, RouteIdWithSearchOrHash, PathnameWithSearchOrHash, ResolvedPathname, RouteParams } from '$app/types' */
 /** @import { ResolveArgs } from './types.js' */
 import { base, assets, hash_routing, match_implementation } from './internal/client.js';
 import { resolve_route } from '../../../utils/routing.js';
@@ -92,7 +92,7 @@ export function resolve(...args) {
  * ```
  * @since 2.52.0
  *
- * @param {Path | URL | (string & {})} url
+ * @param {URL | string} url
  * @returns {Promise<{ [K in RouteId]: { id: K; params: RouteParams<K>; } }[RouteId] | null>}
  */
 export function match(url) {

package/src/runtime/app/paths/internal/client.js

@@ -1,4 +1,4 @@
-/** @import { RouteId, Path } from '$app/types' */
+/** @import { RouteId } from '$app/types' */
 import { payload } from '../../../client/payload.js';
 
 export const base = payload.base ?? __SVELTEKIT_PATHS_BASE__;
@@ -9,7 +9,7 @@ export const hash_routing = __SVELTEKIT_HASH_ROUTING__;
 /**
  * We make this configurable per-environment so that it's possible to import `$app/paths`
  * into a service worker without importing the entire client
- * @param {Path | URL | (string & {})} _url
+ * @param {URL | string} _url
  * @returns {Promise<{ [K in RouteId]: { id: K; params: import('$app/types').RouteParams<K>; } }[RouteId] | null>}
  */
 // eslint-disable-next-line @typescript-eslint/require-await

package/src/runtime/app/server/remote/prerender.js

@@ -4,15 +4,11 @@
 import { json } from '@sveltejs/kit';
 import { HttpError } from '@sveltejs/kit/internal';
 import { get_request_store } from '@sveltejs/kit/internal/server';
-import { stringify, stringify_remote_arg } from '../../../shared.js';
+import { stringify_remote_arg } from '../../../shared.js';
+import { parse, stringify } from '#app/internal/transport';
 import { noop } from '../../../../utils/functions.js';
 import { app_dir, base } from '$app/paths/internal/server';
-import {
-	create_validator,
-	get_response,
-	parse_remote_response,
-	run_remote_function
-} from './shared.js';
+import { create_validator, get_response, run_remote_function } from './shared.js';
 
 /**
  * Creates a remote prerender function. When called from the browser, the function will be invoked on the server via a `fetch` call.
@@ -89,7 +85,7 @@ export function prerender(validate_or_fn, fn_or_options, maybe_options) {
 	/** @type {RemotePrerenderFunction<Input, Output> & { __: RemotePrerenderInternals }} */
 	const wrapper = (arg) => {
 		const { event, state } = get_request_store();
-		const payload = stringify_remote_arg(arg, state.transport);
+		const payload = stringify_remote_arg(arg);
 
 		// `get_response` (as opposed to bare `get_cache`) also registers the call in the
 		// implicit lookup, so that the result is inlined into the page payload (`data.p`)
@@ -121,7 +117,7 @@ export function prerender(validate_or_fn, fn_or_options, maybe_options) {
 						throw new HttpError(prerendered.error);
 					}
 
-					return parse_remote_response(prerendered.data, state.transport)._;
+					return parse(prerendered.data)._;
 				}
 			}
 
@@ -146,7 +142,7 @@ export function prerender(validate_or_fn, fn_or_options, maybe_options) {
 			const result = await promise;
 
 			if (state.prerendering) {
-				const body = { type: 'result', data: stringify({ _: result }, state.transport) };
+				const body = { type: 'result', data: stringify({ _: result }) };
 				state.prerendering.dependencies.set(url, {
 					body: JSON.stringify(body),
 					response: json(body)

package/src/runtime/app/server/remote/query.js

@@ -98,7 +98,7 @@ export function query(validate_or_fn, maybe_fn) {
 		}
 
 		const { event, state } = get_request_store();
-		const payload = stringify_remote_arg(arg, state.transport);
+		const payload = stringify_remote_arg(arg);
 
 		return create_query_resource(__, payload, event, state, () =>
 			run_remote_function(
@@ -197,7 +197,7 @@ function live(validate_or_fn, maybe_fn) {
 		}
 
 		const { event, state } = get_request_store();
-		const payload = stringify_remote_arg(arg, state.transport);
+		const payload = stringify_remote_arg(arg);
 
 		return create_live_query_resource(__, payload, event, state, () =>
 			run(event, state, () => validate(arg))
@@ -376,7 +376,7 @@ function batch(validate_or_fn, maybe_fn) {
 		}
 
 		const { event, state } = get_request_store();
-		const payload = stringify_remote_arg(arg, state.transport);
+		const payload = stringify_remote_arg(arg);
 
 		return create_query_resource(__, payload, event, state, () =>
 			// Collect all the calls to the same query in the same macrotask,

package/src/runtime/app/server/remote/requested.js

@@ -163,7 +163,7 @@ export function requested(query, limit) {
 		*[Symbol.iterator]() {
 			for (const payload of selected) {
 				try {
-					const parsed = parse_remote_arg(payload, state.transport);
+					const parsed = parse_remote_arg(payload);
 					const validated = __.validate(parsed);
 
 					if (is_thenable(validated)) {
@@ -183,7 +183,7 @@ export function requested(query, limit) {
 		async *[Symbol.asyncIterator]() {
 			yield* race_all(selected, async (payload) => {
 				try {
-					const parsed = parse_remote_arg(payload, state.transport);
+					const parsed = parse_remote_arg(payload);
 					const validated = await __.validate(parsed);
 					return { arg: validated, query: __.bind(payload, validated) };
 				} catch (error) {

package/src/runtime/app/server/remote/shared.js

@@ -1,6 +1,5 @@
 /** @import { RequestEvent } from '@sveltejs/kit' */
-/** @import { ServerHooks, MaybePromise, RequestState, RemoteInternals, RequestStore, RemoteLiveQueryUserFunctionReturnType } from 'types' */
-import { parse } from 'devalue';
+/** @import { MaybePromise, RequestState, RemoteInternals, RequestStore, RemoteLiveQueryUserFunctionReturnType } from 'types' */
 import { error } from '@sveltejs/kit';
 import { with_request_store, get_request_store } from '@sveltejs/kit/internal/server';
 
@@ -80,20 +79,6 @@ export async function get_response(internals, payload, state, get_result) {
 	return (cache[payload] ??= get_result());
 }
 
-/**
- * @param {any} data
- * @param {ServerHooks['transport']} transport
- */
-export function parse_remote_response(data, transport) {
-	/** @type {Record<string, any>} */
-	const revivers = {};
-	for (const key in transport) {
-		revivers[key] = transport[key].decode;
-	}
-
-	return parse(data, revivers);
-}
-
 /**
  * @param {RequestEvent} event
  * @param {RequestState} state

package/src/runtime/client/client.js

@@ -9,7 +9,7 @@ import { settled, tick, fork, onMount, hydrate, mount } from 'svelte';
 import { HttpError, Redirect, SvelteKitError } from '@sveltejs/kit/internal';
 import { decode_pathname, strip_hash, make_trackable, normalize_path } from '../../utils/url.js';
 import { dev_fetch, initial_fetch, lock_fetch, subsequent_fetch, unlock_fetch } from './fetcher.js';
-import { parse, parse_server_route } from './parse.js';
+import { parse_routes, parse_server_route } from './parse.js';
 import * as storage from './session-storage.js';
 import {
 	find_anchor,
@@ -50,13 +50,14 @@ import { noop_span } from '../telemetry/noop.js';
 import { read_ndjson } from './ndjson.js';
 import Root from '../components/root.svelte';
 import { Props, RenderNode } from '../props.svelte.js';
+import { init_transport, parse, stringify } from '#app/internal/transport';
 
 /**
  * @typedef {{
  *   historyIndex: number;
  *   navigationIndex: number;
  *   pageUrl?: string;
- *   state: Record<string, any>;
+ *   state: string;
  *   persistState: boolean;
  *   resetIndex: number;
  * }} HistoryMetadata
@@ -487,9 +488,11 @@ async function _start(_app, _target, data) {
 
 	app = _app;
 
+	init_transport(app.hooks.transport ?? {});
+
 	await _app.hooks.init?.();
 
-	routes = __SVELTEKIT_CLIENT_ROUTING__ ? parse(_app) : [];
+	routes = __SVELTEKIT_CLIENT_ROUTING__ ? parse_routes(_app) : [];
 	container = __SVELTEKIT_EMBEDDED__ ? _target : document.documentElement;
 	target = _target;
 
@@ -530,7 +533,7 @@ async function _start(_app, _target, data) {
 				[HISTORY_METADATA_KEY]: {
 					historyIndex: current_history_index,
 					navigationIndex: current_navigation_index,
-					state: {},
+					state: stringify({}),
 					persistState: false,
 					resetIndex: current_history_index
 				}
@@ -563,7 +566,7 @@ async function _start(_app, _target, data) {
 			type: 'enter',
 			url: resolve_url(app.hash ? decode_hash(new URL(location.href)) : location.href),
 			replace_state: true,
-			state: history_metadata?.persistState ? history_metadata.state : {},
+			state: history_metadata?.persistState ? parse(history_metadata.state) : {},
 			persist_state: history_metadata?.persistState ?? false
 		});
 
@@ -2054,10 +2057,17 @@ async function navigate({
 		url.pathname = navigation_result.props.page.url.pathname;
 	}
 
-	state = popped ? popped.state : state;
-
-	if (!popped) {
-		// this is a new navigation, rather than a popstate
+	if (popped) {
+		state = popped.state;
+	} else {
+		// we immediately serialize-then-parse to ensure that the value is
+		// serializable, and to prevent the developer from dangerously
+		// relying on the identity of the serialized objects
+		const serialized_state = stringify(state);
+		state = parse(serialized_state);
+
+		// Store the serialized state so the browser history can preserve custom transport values.
+		// This is a new navigation, rather than a popstate.
 		const change = replace_state ? 0 : 1;
 		if (type !== 'enter') {
 			if (reset) current_reset_index += 1;
@@ -2067,7 +2077,7 @@ async function navigate({
 			[HISTORY_METADATA_KEY]: /** @satisfies {HistoryMetadata} */ ({
 				historyIndex: (current_history_index += change),
 				navigationIndex: (current_navigation_index += change),
-				state,
+				state: serialized_state,
 				persistState: persist_state,
 				resetIndex: current_reset_index
 			})
@@ -2874,18 +2884,8 @@ export async function replaceState(url, state) {
 async function update_state(intent, state, { replace, persist_state, reset }, caller) {
 	const url = intent.url;
 
-	if (DEV) {
-		if (!started) {
-			throw new Error(`Cannot call ${caller}(...) before router is initialized`);
-		}
-
-		try {
-			// use `devalue.stringify` as a convenient way to ensure we exclude values that can't be properly rehydrated, such as custom class instances
-			devalue.stringify(state);
-		} catch (error) {
-			// @ts-expect-error
-			throw new Error(`Could not serialize state${error.path}`, { cause: error });
-		}
+	if (DEV && !started) {
+		throw new Error(`Cannot call ${caller}(...) before router is initialized`);
 	}
 
 	const nav =
@@ -2906,12 +2906,16 @@ async function update_state(intent, state, { replace, persist_state, reset }, ca
 	if (!replace) capture_scroll(current_history_index);
 	if (reset) current_reset_index += 1;
 
+	// as above, serialize-then-parse to prevent bugs
+	const serialized_state = stringify(state);
+	state = parse(serialized_state);
+
 	const entry = {
 		[HISTORY_METADATA_KEY]: /** @satisfies {HistoryMetadata} */ ({
 			historyIndex: (current_history_index += replace ? 0 : 1),
 			navigationIndex: current_navigation_index,
 			pageUrl: page.url.href,
-			state,
+			state: serialized_state,
 			persistState: persist_state,
 			resetIndex: current_reset_index
 		})
@@ -3291,7 +3295,7 @@ function _start_router() {
 			const reset_index = history_metadata.resetIndex;
 			const reset = reset_index !== (source_info?.resetIndex ?? current_reset_index);
 			const scroll = history_info[history_index]?.scroll;
-			const state = history_metadata.state;
+			const state = parse(history_metadata.state);
 			const url = new URL(history_metadata.pageUrl ?? location.href);
 			const navigation_index = history_metadata.navigationIndex;
 			const is_hash_change =
@@ -3537,7 +3541,7 @@ async function _hydrate(
 
 	if (result.props.page) {
 		const history_metadata = get_history_metadata();
-		result.props.page.state = history_metadata?.persistState ? history_metadata.state : {};
+		result.props.page.state = history_metadata?.persistState ? parse(history_metadata.state) : {};
 	}
 
 	await initialize(result, target, should_hydrate);

package/src/runtime/client/parse.js

@@ -4,7 +4,7 @@ import { exec, parse_route_id } from '../../utils/routing.js';
  * @param {import('./types.js').SvelteKitApp} app
  * @returns {import('types').CSRRoute[]}
  */
-export function parse({ nodes, server_loads, dictionary, matchers }) {
+export function parse_routes({ nodes, server_loads, dictionary, matchers }) {
 	const layouts_with_server_load = new Set(server_loads);
 
 	return Object.entries(dictionary).map(([id, [leaf, layouts, errors]]) => {

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

@@ -1,6 +1,5 @@
 /** @import { RemoteCommand, RemoteQueryUpdate } from '@sveltejs/kit' */
 import { app_dir, base } from '$app/paths/internal/client';
-import { app } from '../client.js';
 import { stringify_command_arg } from '../../shared.js';
 import { get_remote_request_headers, categorize_updates, remote_request } from './shared.svelte.js';
 
@@ -48,7 +47,7 @@ export function command(id) {
 				const response = await remote_request(`${base}/${app_dir}/remote/${id}`, {
 					method: 'POST',
 					body: JSON.stringify({
-						payload: await stringify_command_arg(arg, app.hooks.transport),
+						payload: await stringify_command_arg(arg),
 						refreshes: Array.from(refreshes ?? [])
 					}),
 					headers

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

@@ -57,7 +57,7 @@ function put(url, encoded) {
  */
 export function prerender(id) {
 	return (arg) => {
-		const payload = stringify_remote_arg(arg, app.hooks.transport);
+		const payload = stringify_remote_arg(arg);
 		const cache_key = create_remote_key(id, payload);
 
 		let resource = prerender_resources.get(cache_key)?.deref();

package/src/runtime/client/remote-functions/query/proxy.js

@@ -1,4 +1,4 @@
-import { app, query_map } from '../../client.js';
+import { query_map } from '../../client.js';
 import {
 	pin_in_effect,
 	pin_while_resolving,
@@ -29,7 +29,7 @@ export class QueryProxy {
 	 */
 	constructor(id, arg, fn) {
 		this.#id = id;
-		this.#payload = stringify_remote_arg(arg, app.hooks.transport);
+		this.#payload = stringify_remote_arg(arg);
 		this.#key = create_remote_key(id, this.#payload);
 		Object.defineProperty(this, QUERY_RESOURCE_KEY, { value: this.#key });
 		this.#fn = fn;

package/src/runtime/client/remote-functions/query-live/proxy.js

@@ -1,4 +1,4 @@
-import { app, live_query_map } from '../../client.js';
+import { live_query_map } from '../../client.js';
 import { pin_in_effect, pin_while_resolving, QUERY_RESOURCE_KEY } from '../shared.svelte.js';
 import { create_remote_key, stringify_remote_arg } from '../../../shared.js';
 import { LiveQuery } from './instance.svelte.js';
@@ -20,7 +20,7 @@ export class LiveQueryProxy {
 	 */
 	constructor(id, arg) {
 		this.#id = id;
-		this.#payload = stringify_remote_arg(arg, app.hooks.transport);
+		this.#payload = stringify_remote_arg(arg);
 		this.#key = create_remote_key(id, this.#payload);
 		Object.defineProperty(this, QUERY_RESOURCE_KEY, { value: this.#key });
 

package/src/runtime/pathname.js

@@ -22,13 +22,14 @@ export function strip_data_suffix(pathname) {
 }
 
 const ROUTE_SUFFIX = '/__route.js';
+const HTML_ROUTE_SUFFIX = '.html__route.js';
 
 /**
  * @param {string} pathname
  * @returns {boolean}
  */
 export function has_resolution_suffix(pathname) {
-	return pathname.endsWith(ROUTE_SUFFIX);
+	return pathname.endsWith(ROUTE_SUFFIX) || pathname.endsWith(HTML_ROUTE_SUFFIX);
 }
 
 /**
@@ -37,6 +38,7 @@ export function has_resolution_suffix(pathname) {
  * @returns {string}
  */
 export function add_resolution_suffix(pathname) {
+	if (pathname.endsWith('.html')) return pathname.replace(/\.html$/, HTML_ROUTE_SUFFIX);
 	return pathname.replace(/\/$/, '') + ROUTE_SUFFIX;
 }
 
@@ -45,6 +47,10 @@ export function add_resolution_suffix(pathname) {
  * @returns {string}
  */
 export function strip_resolution_suffix(pathname) {
+	if (pathname.endsWith(HTML_ROUTE_SUFFIX)) {
+		return pathname.slice(0, -HTML_ROUTE_SUFFIX.length) + '.html';
+	}
+
 	return pathname.slice(0, -ROUTE_SUFFIX.length);
 }
 

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

@@ -11,22 +11,20 @@ import { with_version_header } from '../utils.js';
 
 /**
  * @param {import('@sveltejs/kit').RequestEvent} event
- * @param {import('types').RequestState} event_state
+ * @param {import('types').RequestState} state
  * @param {import('types').SSRRoute} route
  * @param {import('types').SSROptions} options
  * @param {import('@sveltejs/kit').SSRManifest} manifest
- * @param {import('types').SSRState} state
  * @param {boolean[] | undefined} invalidated_data_nodes
  * @param {import('types').TrailingSlash} trailing_slash
  * @returns {Promise<Response>}
  */
 export async function render_data(
 	event,
-	event_state,
+	state,
 	route,
 	options,
 	manifest,
-	state,
 	invalidated_data_nodes,
 	trailing_slash
 ) {
@@ -60,7 +58,6 @@ export async function render_data(
 					// load this. for the child, return as is. for the final result, stream things
 					return load_server_data({
 						event: new_event,
-						event_state,
 						state,
 						node,
 						parent: async () => {
@@ -95,7 +92,7 @@ export async function render_data(
 			return fn();
 		});
 
-		const data_serializer = server_data_serializer_json(event, event_state, options);
+		const data_serializer = server_data_serializer_json(event, state, options);
 		await Promise.all(
 			promises.map(async (p, i) => {
 				const node = await p.catch(async (error) => {
@@ -103,7 +100,7 @@ export async function render_data(
 						throw error;
 					}
 
-					const transformed = await handle_error_and_jsonify(event, event_state, options, error);
+					const transformed = await handle_error_and_jsonify(event, state, options, error);
 
 					return /** @type {import('types').ServerErrorNode} */ ({
 						type: 'error',
@@ -151,7 +148,7 @@ export async function render_data(
 		if (error instanceof Redirect) {
 			return redirect_json_response(error);
 		} else {
-			const transformed = await handle_error_and_jsonify(event, event_state, options, error);
+			const transformed = await handle_error_and_jsonify(event, state, options, error);
 			return json_response(transformed, transformed.status);
 		}
 	}

package/src/runtime/server/dev.js

@@ -0,0 +1,22 @@
+const symbol = Symbol.for('sveltekit.global_state');
+const state = /** @type {Record<symbol, any>} */ (
+	/** @type {Record<symbol, unknown>} */ (/** @type {unknown} */ (globalThis))[symbol] ??= {}
+);
+
+/**
+ * Persist a value across dev server reloads, in case a freshly-invalidated module
+ * reads global state that is not set until a request is handled
+ * @param {symbol} key
+ * @param {any} value
+ */
+export function save(key, value) {
+	state[key] = value;
+}
+
+/**
+ * Restore a value after a dev server reload
+ * @param {symbol} key
+ */
+export function restore(key) {
+	return state[key];
+}

package/src/runtime/server/endpoint.js

@@ -6,12 +6,11 @@ import { method_not_allowed } from './utils.js';
 
 /**
  * @param {import('@sveltejs/kit').RequestEvent} event
- * @param {import('types').RequestState} event_state
+ * @param {import('types').RequestState} state
  * @param {import('types').SSREndpoint} mod
- * @param {import('types').SSRState} state
  * @returns {Promise<Response>}
  */
-export async function render_endpoint(event, event_state, mod, state) {
+export async function render_endpoint(event, state, mod) {
 	const method = /** @type {import('types').HttpMethod} */ (event.request.method);
 
 	let handler = mod[method] || mod.fallback;
@@ -42,7 +41,7 @@ export async function render_endpoint(event, event_state, mod, state) {
 	}
 
 	try {
-		const response = await with_request_store({ event, state: event_state }, () =>
+		const response = await with_request_store({ event, state }, () =>
 			handler(/** @type {import('@sveltejs/kit').RequestEvent<Record<string, any>>} */ (event))
 		);
 

package/src/runtime/server/fetch.js

@@ -11,7 +11,7 @@ import { fork_state_for_subrequest } from './state.js';
  *   event: import('@sveltejs/kit').RequestEvent;
  *   options: import('types').SSROptions;
  *   manifest: import('@sveltejs/kit').SSRManifest;
- *   state: import('types').SSRState;
+ *   state: import('types').RequestState;
  *   get_cookie_header: (url: URL, header: string | null) => string;
  *   set_internal: (name: string, value: string, opts: import('./page/types.js').Cookie['options']) => void;
  * }} opts
@@ -195,34 +195,32 @@ function normalize_fetch_input(info, init, url) {
  * @param {Request} request
  * @param {import('types').SSROptions} options
  * @param {import('@sveltejs/kit').SSRManifest} manifest
- * @param {import('types').SSRState} state
+ * @param {import('types').RequestState} state
  * @returns {Promise<Response>}
  */
 async function internal_fetch(request, options, manifest, state) {
-	const subrequest_state = fork_state_for_subrequest(state);
+	if (request.signal?.aborted) {
+		throw new DOMException('The operation was aborted.', 'AbortError');
+	}
 
-	if (request.signal) {
-		if (request.signal.aborted) {
-			throw new DOMException('The operation was aborted.', 'AbortError');
-		}
-
-		let remove_abort_listener = noop;
-		/** @type {Promise<never>} */
-		const abort_promise = new Promise((_, reject) => {
-			const on_abort = () => {
-				reject(new DOMException('The operation was aborted.', 'AbortError'));
-			};
-			request.signal.addEventListener('abort', on_abort, { once: true });
-			remove_abort_listener = () => request.signal.removeEventListener('abort', on_abort);
-		});
+	const subrequest_state = fork_state_for_subrequest(state);
 
-		const result = await Promise.race([
-			respond(request, options, manifest, subrequest_state),
-			abort_promise
-		]);
-		remove_abort_listener();
-		return result;
-	} else {
+	if (!request.signal) {
 		return await respond(request, options, manifest, subrequest_state);
 	}
+
+	let remove_abort_listener = noop;
+	/** @type {Promise<never>} */
+	const abort_promise = new Promise((_, reject) => {
+		const on_abort = () => {
+			reject(new DOMException('The operation was aborted.', 'AbortError'));
+		};
+		request.signal.addEventListener('abort', on_abort, { once: true });
+		remove_abort_listener = () => request.signal.removeEventListener('abort', on_abort);
+	});
+
+	return Promise.race([
+		respond(request, options, manifest, subrequest_state),
+		abort_promise
+	]).finally(remove_abort_listener);
 }