@sveltejs/kit 3.0.0-next.6 → 3.0.0-next.8

package/src/runtime/client/client.js

@@ -1,21 +1,13 @@
 /** @import { RemoteFunctionDataNode, ServerNodesResponse, ServerRedirectNode } from 'types' */
 /** @import { NavigationIntent } from './types.js' */
+/** @import { RenderNode } from '../types.js' */
 /** @import { CacheEntry } from './remote-functions/cache.svelte.js' */
 /** @import { Query } from './remote-functions/query/instance.svelte.js' */
 /** @import { LiveQuery } from './remote-functions/query-live/instance.svelte.js' */
 import { BROWSER, DEV } from 'esm-env';
 import * as svelte from 'svelte';
 import { HttpError, Redirect, SvelteKitError } from '@sveltejs/kit/internal';
-const { onMount, tick } = svelte;
-// Svelte 4 and under don't have `untrack`, so we have to fallback if `untrack` is not exported
-const untrack = svelte.untrack ?? ((value) => value());
-import {
-	decode_params,
-	decode_pathname,
-	strip_hash,
-	make_trackable,
-	normalize_path
-} from '../../utils/url.js';
+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 * as storage from './session-storage.js';
@@ -27,8 +19,6 @@ import {
 	is_external_url,
 	origin,
 	scroll_state,
-	notifiable_store,
-	create_updated_store,
 	load_css
 } from './utils.js';
 import { base } from '$app/paths/internal/client';
@@ -44,7 +34,6 @@ import {
 } from './constants.js';
 import { validate_page_exports } from '../../utils/exports.js';
 import { noop } from '../../utils/functions.js';
-import { compact } from '../../utils/array.js';
 import {
 	INVALIDATED_PARAM,
 	TRAILING_SLASH_PARAM,
@@ -53,11 +42,15 @@ import {
 	validate_load_response
 } from '../shared.js';
 import { get_message, get_status } from '../../utils/error.js';
-import { writable } from 'svelte/store';
-import { page, update, navigating } from './state.svelte.js';
+import { page, update, navigating, updated } from './state.svelte.js';
+import { payload } from './payload.js';
 import { add_data_suffix, add_resolution_suffix } from '../pathname.js';
 import { noop_span } from '../telemetry/noop.js';
 import { read_ndjson } from './ndjson.js';
+import RootModern from '../components/root.svelte';
+import { asClassComponent } from 'svelte/legacy';
+
+const Root = asClassComponent(RootModern);
 
 export { load_css };
 const ICON_REL_ATTRIBUTES = new Set(['icon', 'shortcut icon', 'apple-touch-icon']);
@@ -72,6 +65,17 @@ let errored = false;
  */
 let rendering_error = null;
 
+/**
+ * `reset` functions for `<svelte:boundary>`s in the generated root that have
+ * failed. A failed boundary stays failed until `reset()` is called — prop
+ * updates alone don't re-render its content — so without resetting, a client
+ * navigation away from a render error would leave the stale `+error.svelte`
+ * mounted. The boundary's `onerror` populates this array; `navigate` drains it
+ * after applying the new props. See sveltejs/kit#15694.
+ * @type {Array<(() => void) | undefined>}
+ */
+const resetters = [];
+
 // We track the scroll position associated with each history entry in sessionStorage,
 // rather than on history.state itself, because when navigation is driven by
 // popstate it's too late to update the scroll position associated with the
@@ -88,6 +92,11 @@ const scroll_positions = storage.get(SCROLL_KEY) ?? {};
  */
 const snapshots = storage.get(SNAPSHOT_KEY) ?? {};
 
+/**
+ * @deprecated this is a temporary measure to avoid a regression, replace with nested `RenderNode` classes
+ */
+let current_tree = /** @type {RenderNode} */ ({});
+
 if (DEV && BROWSER) {
 	let warned = false;
 
@@ -127,15 +136,6 @@ if (DEV && BROWSER) {
 	};
 }
 
-export const stores = {
-	url: /* @__PURE__ */ notifiable_store({}),
-	page: /* @__PURE__ */ notifiable_store({}),
-	navigating: /* @__PURE__ */ writable(
-		/** @type {import('@sveltejs/kit').Navigation | null} */ (null)
-	),
-	updated: /* @__PURE__ */ create_updated_store()
-};
-
 /** @param {number} index */
 function update_scroll_positions(index) {
 	scroll_positions[index] = scroll_state();
@@ -344,8 +344,8 @@ export async function start(_app, _target, hydrate) {
 		);
 	}
 
-	if (__SVELTEKIT_PAYLOAD__.data) {
-		const { q = {}, p = {}, l = {}, f = {} } = __SVELTEKIT_PAYLOAD__.data;
+	if (payload.data) {
+		const { q = {}, p = {}, l = {}, f = {} } = payload.data;
 
 		// store the whole nodes — error records seed the corresponding
 		// resources in a failed state when they are created during hydration
@@ -424,7 +424,7 @@ export async function start(_app, _target, hydrate) {
 	_start_router();
 }
 
-async function _invalidate(include_load_functions = true, reset_page_state = true) {
+async function _invalidate(reset_page_state = true) {
 	// Accept all invalidations as they come, don't swallow any while another invalidation
 	// is running because subsequent invalidations may make earlier ones outdated,
 	// but batch multiple synchronous invalidations.
@@ -463,39 +463,36 @@ async function _invalidate(include_load_functions = true, reset_page_state = tru
 		}
 	}
 
-	if (include_load_functions) {
-		const prev_state = page.state;
-		const navigation_result = intent && (await load_route(intent));
-		if (!navigation_result || token !== invalidation_token || nav_token !== navigation_token) {
-			return;
-		}
+	const prev_state = page.state;
+	const navigation_result = intent && (await load_route(intent));
+	if (!navigation_result || token !== invalidation_token || nav_token !== navigation_token) {
+		return;
+	}
 
-		if (navigation_result.type === 'redirect') {
-			return _goto(
-				new URL(navigation_result.location, current.url).href,
-				{ replaceState: true },
-				1,
-				token
-			);
-		}
+	if (navigation_result.type === 'redirect') {
+		return _goto(
+			new URL(navigation_result.location, current.url).href,
+			{ replaceState: true },
+			1,
+			token
+		);
+	}
 
-		// A navigation started before the invalidation and ended before it finished. The invalidation did not redirect,
-		// hence it likely contains outdated data now, so we ignore it.
-		if (navigating && !is_navigating) {
-			return;
-		}
+	// A navigation started before the invalidation and ended before it finished. The invalidation did not redirect,
+	// hence it likely contains outdated data now, so we ignore it.
+	if (navigating && !is_navigating) {
+		return;
+	}
 
-		// This is a bit hacky but allows us not having to pass that boolean around, making things harder to reason about
-		if (!reset_page_state) {
-			navigation_result.props.page.state = prev_state;
-		}
-		update(navigation_result.props.page);
-		current = { ...navigation_result.state, nav: current.nav };
-		reset_invalidation();
-		root.$set(navigation_result.props);
-	} else {
-		reset_invalidation();
+	// Preserve `page.state` when invalidating without resetting it (e.g. `refresh`/`refreshAll`)
+	if (!reset_page_state) {
+		navigation_result.props.page.state = prev_state;
 	}
+	update(navigation_result.props.page);
+	current_tree = navigation_result.props.tree;
+	current = { ...navigation_result.state, nav: current.nav };
+	reset_invalidation();
+	root.$set(navigation_result.props);
 
 	// only wait for promises that are connected to queries that still exist
 	/** @type {Promise<any>[]} */
@@ -548,7 +545,7 @@ function persist_state() {
 
 /**
  * @param {string | URL} url
- * @param {{ replaceState?: boolean; noScroll?: boolean; keepFocus?: boolean; invalidateAll?: boolean; invalidate?: Array<string | URL | ((url: URL) => boolean)>; state?: Record<string, any> }} options
+ * @param {{ replaceState?: boolean; noScroll?: boolean; keepFocus?: boolean; refreshAll?: boolean; invalidate?: Array<string | URL | ((url: URL) => boolean)>; state?: Record<string, any> }} options
  * @param {number} redirect_count
  * @param {{}} [nav_token]
  * @param {NavigationIntent | undefined} [intent] navigation intent, when already known by the caller (avoids recomputing it)
@@ -560,9 +557,9 @@ export async function _goto(url, options, redirect_count, nav_token, intent) {
 	/** @type {Set<string>} */
 	let live_query_keys;
 
-	// Clear preload cache when invalidateAll is true to ensure fresh data
+	// Clear preload cache when refreshAll is true to ensure fresh data
 	// after form submissions or explicit invalidations
-	if (options.invalidateAll) {
+	if (options.refreshAll) {
 		discard_load_cache();
 	}
 
@@ -577,7 +574,7 @@ export async function _goto(url, options, redirect_count, nav_token, intent) {
 		nav_token,
 		intent,
 		accept: () => {
-			if (options.invalidateAll) {
+			if (options.refreshAll) {
 				force_invalidation = true;
 				query_keys = new Set();
 				for (const [id, entries] of query_map) {
@@ -603,7 +600,7 @@ export async function _goto(url, options, redirect_count, nav_token, intent) {
 		}
 	});
 
-	if (options.invalidateAll) {
+	if (options.refreshAll) {
 		// TODO the ticks shouldn't be necessary, something inside Svelte itself is buggy
 		// when a query in a layout that still exists after page change is refreshed earlier than this
 		void svelte
@@ -642,17 +639,14 @@ async function _preload_data(intent) {
 		load_cache = {
 			id: intent.id,
 			token: preload,
-			promise: load_route({ ...intent, preload }).then((result) => {
+			promise: load_route({ ...intent, preload }).finally(() => {
 				preload_tokens.delete(preload);
-				if (result.type === 'loaded' && result.state.error) {
-					// Don't cache errors, because they might be transient
-					discard_load_cache();
-				}
-				return result;
 			}),
 			fork: null
 		};
 
+		load_cache.promise.catch(discard_load_cache);
+
 		if (__SVELTEKIT_FORK_PRELOADS__ && svelte.fork) {
 			const lc = load_cache;
 
@@ -664,6 +658,7 @@ async function _preload_data(intent) {
 						return svelte.fork(() => {
 							root.$set(result.props);
 							update(result.props.page);
+							current_tree = result.props.tree;
 						});
 					} catch {
 						// if it errors, it's because the experimental flag isn't enabled in Svelte
@@ -722,23 +717,22 @@ async function initialize(result, target, hydrate) {
 	}
 
 	update(/** @type {import('@sveltejs/kit').Page} */ (result.props.page));
+	current_tree = result.props.tree;
 
-	root = new app.root({
+	// TODO: use mount()
+	root = new Root({
 		target,
-		props: { ...result.props, stores, components },
+		props: { ...result.props, components, resetters },
 		hydrate,
-		// @ts-ignore Svelte 5 specific: asynchronously instantiate the component, i.e. don't call flushSync
+		// Svelte 5 specific: asynchronously instantiate the component, i.e. don't call flushSync
 		sync: false,
-		// @ts-ignore Svelte 5 specific: transformError allows to transform errors before they are passed to boundaries
-		transformError: __SVELTEKIT_EXPERIMENTAL_USE_TRANSFORM_ERROR__
-			? /** @param {unknown} e */ async (e) => {
-					const error = await handle_error(e, current.nav);
-					rendering_error = { error, status: error.status };
-					page.error = error;
-					page.status = rendering_error.status;
-					return error;
-				}
-			: undefined
+		transformError: /** @param {unknown} e */ async (e) => {
+			const error = await handle_error(e, current.nav);
+			rendering_error = { error, status: error.status };
+			page.error = error;
+			page.status = rendering_error.status;
+			return error;
+		}
 	});
 
 	// Wait for a microtask in case svelte experimental async is enabled,
@@ -817,35 +811,12 @@ async function get_navigation_result_from_branch({
 			route
 		},
 		props: {
-			// @ts-ignore Somehow it's getting SvelteComponent and SvelteComponentDev mixed up
-			constructors: compact(branch).map((branch_node) => branch_node.node.component),
-			page: clone_page(page)
+			page,
+			tree: /** @type {RenderNode} */ ({})
 		}
 	};
 
-	if (errors && __SVELTEKIT_EXPERIMENTAL_USE_TRANSFORM_ERROR__) {
-		let last_idx = -1;
-		result.props.errors = await Promise.all(
-			// eslint-disable-next-line @typescript-eslint/await-thenable
-			branch
-				.map((b, i) => {
-					if (i === 0) return undefined; // root layout wraps root error component, not the other way around
-					if (!b) return null;
-
-					i--;
-					// Find the closest error component up to the previous branch
-					while (i > last_idx + 1 && !errors[i]) i -= 1;
-					last_idx = i;
-					return errors[i]?.()
-						.then((e) => e.component)
-						.catch(() => undefined);
-				})
-				// filter out indexes where there was no branch, but keep indexes where there was a branch but no error component
-				.filter((e) => e !== null)
-		);
-	}
-
-	if (error && __SVELTEKIT_EXPERIMENTAL_USE_TRANSFORM_ERROR__) {
+	if (error) {
 		result.props.error = error;
 	}
 
@@ -856,23 +827,44 @@ async function get_navigation_result_from_branch({
 	let data = {};
 	let data_changed = !page;
 
-	let p = 0;
+	let current_node = result.props.tree;
+
+	/** @type {RenderNode | undefined} */
+	let previous_node = current_tree;
 
-	for (let i = 0; i < Math.max(branch.length, current.branch.length); i += 1) {
+	for (let i = 0; i < branch.length; i += 1) {
 		const node = branch[i];
 		const prev = current.branch[i];
 
-		if (node?.data !== prev?.data) data_changed = true;
 		if (!node) continue;
 
-		data = { ...data, ...node.data };
+		const error_loader = errors?.slice(0, i + 1).findLast((x) => x) ?? default_error_loader;
 
-		// Only set props if the node actually updated. This prevents needless rerenders.
-		if (data_changed) {
-			result.props[`data_${p}`] = data;
+		current_node.error = (await error_loader()).component;
+		current_node.component = node.node.component;
+
+		if (
+			// if an ancestor node in this path changed, `data_changed` is already true and the
+			// accumulated `data` differs from the previous render, so we must re-merge
+			data_changed ||
+			!previous_node ||
+			node?.data !== prev?.data
+		) {
+			current_node.data = { ...data, ...node.data };
+			data_changed = true;
+		} else {
+			// use existing object — prevents effects re-running unnecessarily
+			current_node.data = previous_node.data;
 		}
 
-		p += 1;
+		data = current_node.data;
+
+		if (i < branch.length - 1) {
+			current_node.child = /** @type {import('../types.js').RenderNode} */ ({});
+			current_node = current_node.child;
+
+			previous_node = previous_node?.child;
+		}
 	}
 
 	const page_changed =
@@ -893,8 +885,7 @@ async function get_navigation_result_from_branch({
 			status: status ?? error?.status ?? 200,
 			url: new URL(url),
 			form: form ?? null,
-			// The whole page store is updated, but this way the object reference stays the same
-			data: data_changed ? data : page.data
+			data
 		};
 	}
 
@@ -1172,31 +1163,6 @@ function diff_search_params(old_url, new_url) {
 	return changed;
 }
 
-/**
- * @param {Omit<import('./types.js').NavigationFinished['state'], 'branch'> & { error: App.Error }} opts
- * @returns {import('./types.js').NavigationFinished}
- */
-function preload_error({ error, url, route, params }) {
-	// we skipped loading the error page, so we need to use the current page
-	// store, but we still pass the updated status to the preloadData function
-	const new_page = clone_page(page);
-	new_page.status = error.status;
-	return {
-		type: 'loaded',
-		state: {
-			error,
-			url,
-			route,
-			params,
-			branch: []
-		},
-		props: {
-			page: new_page,
-			constructors: []
-		}
-	};
-}
-
 /**
  * @overload
  * @param {import('./types.js').NavigationIntent} intent
@@ -1267,7 +1233,7 @@ async function load_route({ id, invalidating, url, params, route, preload }) {
 				const handled_error = await handle_error(error, { url, params, route: { id } });
 
 				if (preload && preload_tokens.has(preload)) {
-					return preload_error({ error: handled_error, url, params, route });
+					throw handled_error;
 				}
 
 				return load_root_error_page({
@@ -1357,13 +1323,7 @@ async function load_route({ id, invalidating, url, params, route, preload }) {
 				}
 
 				if (preload && preload_tokens.has(preload)) {
-					const error = await handle_error(err, { params, url, route: { id: route.id } });
-					return preload_error({
-						error,
-						url,
-						params,
-						route
-					});
+					throw await handle_error(err, { params, url, route: { id: route.id } });
 				}
 
 				/** @type {App.Error} */
@@ -1377,8 +1337,7 @@ async function load_route({ id, invalidating, url, params, route, preload }) {
 					error = err.body;
 				} else {
 					// Referenced node could have been removed due to redeploy, check
-					const updated = await stores.updated.check();
-					if (updated) {
+					if (await updated.check()) {
 						// Before reloading, try to update the service worker if it exists
 						await update_service_worker();
 						return await native_navigation(url);
@@ -1631,7 +1590,7 @@ export async function get_navigation_intent(url, invalidating) {
 					id: get_page_key(url),
 					invalidating,
 					route,
-					params: decode_params(params),
+					params,
 					url
 				};
 			}
@@ -1780,7 +1739,7 @@ async function navigate({
 	is_navigating = true;
 
 	if (started && nav.navigation.type !== 'enter') {
-		stores.navigating.set((navigating.current = nav.navigation));
+		navigating.current = nav.navigation;
 	}
 
 	let navigation_result = intent && (await load_route(intent));
@@ -1867,8 +1826,7 @@ async function navigate({
 
 		if (!navigation_result) return;
 	} else if (/** @type {number} */ (navigation_result.props.page.status) >= 400) {
-		const updated = await stores.updated.check();
-		if (updated) {
+		if (await updated.check()) {
 			// Before reloading, try to update the service worker if it exists
 			await update_service_worker();
 			return await native_navigation(url, replace_state);
@@ -1980,9 +1938,24 @@ async function navigate({
 
 		if (fork) {
 			commit_promise = fork.commit();
+			// `fork.commit()` applies the preloaded state synchronously before the
+			// first `await`, so reset any previously-failed boundaries now so the
+			// stale `+error.svelte` is torn down. See sveltejs/kit#15694.
+			for (const reset of resetters) {
+				reset?.();
+			}
+			resetters.length = 0;
 		} else {
 			rendering_error = null; // TODO this can break with forks, rethink for SvelteKit 3 where we can assume Svelte 5
 			root.$set(navigation_result.props);
+			current_tree = navigation_result.props.tree;
+			// Reset any boundaries that failed on a previous navigation now that the
+			// new props are applied, otherwise the stale `+error.svelte` stays
+			// mounted above the new route's content. See sveltejs/kit#15694.
+			for (const reset of resetters) {
+				reset?.();
+			}
+			resetters.length = 0;
 			// Check for sync rendering error
 			if (rendering_error) {
 				Object.assign(navigation_result.props.page, rendering_error);
@@ -1999,13 +1972,7 @@ async function navigate({
 
 	const { activeElement } = document;
 
-	await commit_promise;
-
-	// TODO 3.0 remote — the double tick is probably necessary because
-	// of some store shenanigans. `settled()` and `f.commit()`
-	// should resolve after DOM updates in newer versions
-	await svelte.tick();
-	await svelte.tick();
+	await (commit_promise ?? svelte.tick());
 
 	if (navigation_token !== nav_token) {
 		// a new navigation happened while we were waiting for the DOM to update, so abort
@@ -2069,7 +2036,7 @@ async function navigate({
 		restore_snapshot(current_navigation_index);
 	}
 
-	stores.navigating.set((navigating.current = null));
+	navigating.current = null;
 
 	updating = false;
 }
@@ -2122,22 +2089,63 @@ let current_a = { element: undefined, href: undefined };
 function setup_preload() {
 	/** @type {NodeJS.Timeout} */
 	let mousemove_timeout;
+	/** @type {HTMLAnchorElement | SVGAElement | undefined} */
+	let hovered_a;
 	/** @type {PreloadDataPriority} */
 	let current_priority;
 
-	container.addEventListener('mousemove', (event) => {
-		const target = /** @type {Element} */ (event.target);
+	function clear_hover_preload() {
+		clearTimeout(mousemove_timeout);
+		hovered_a?.removeEventListener('mousemove', start_hover_preload);
+		hovered_a?.removeEventListener('mouseleave', clear_hover_preload);
+		hovered_a = undefined;
+	}
 
+	function start_hover_preload() {
 		clearTimeout(mousemove_timeout);
 		mousemove_timeout = setTimeout(() => {
-			void preload(target, PRELOAD_PRIORITIES.hover);
+			if (!hovered_a) return;
+			void preload(hovered_a, PRELOAD_PRIORITIES.hover);
 		}, 20);
+	}
+
+	// Use mouseover initially instead of mousemove to avoid cluttering the event queue
+	container.addEventListener('mouseover', (event) => {
+		if (!(event.target instanceof Element)) return;
+
+		const a = find_anchor(event.target, container);
+		if (!a || a === hovered_a) return;
+
+		clear_hover_preload();
+		hovered_a = a;
+
+		const options = get_router_options(a);
+
+		if (
+			options.preload_code < PRELOAD_PRIORITIES.hover &&
+			options.preload_data < PRELOAD_PRIORITIES.hover
+		) {
+			// don't add event listeners if no preloading will happen
+			return;
+		}
+
+		// Instead of just preloading right away, we start a mousemove listener to implement
+		// "mouse comes to a rest" behavior. This avoid false positives when you just move
+		// your mouse across the screen and happen to pass over a link.
+		a.addEventListener('mousemove', start_hover_preload);
+		a.addEventListener('mouseleave', clear_hover_preload, { once: true });
+
+		start_hover_preload();
 	});
 
 	/** @param {Event} event */
 	function tap(event) {
 		if (event.defaultPrevented) return;
-		void preload(/** @type {Element} */ (event.composedPath()[0]), PRELOAD_PRIORITIES.tap);
+
+		const a = find_anchor(/** @type {Element} */ (event.composedPath()[0]), container);
+		if (!a) return;
+
+		void preload(a, PRELOAD_PRIORITIES.tap);
 	}
 
 	container.addEventListener('mousedown', tap);
@@ -2156,12 +2164,10 @@ function setup_preload() {
 	);
 
 	/**
-	 * @param {Element} element
+	 * @param {HTMLAnchorElement | SVGAElement} a
 	 * @param {PreloadDataPriority} priority
 	 */
-	async function preload(element, priority) {
-		const a = find_anchor(element, container);
-
+	async function preload(a, priority) {
 		// we don't want to preload data again if the user has already hovered/tapped
 		const interacted =
 			a === current_a.element && a?.href === current_a.href && priority >= current_priority;
@@ -2185,15 +2191,13 @@ function setup_preload() {
 			if (!intent) return;
 
 			if (DEV) {
-				void _preload_data(intent).then((result) => {
-					if (result.type === 'loaded' && result.state.error) {
-						console.warn(
-							`Preloading data for ${intent.url.pathname} failed with the following error: ${result.state.error.message}\n` +
-								'If this error is transient, you can ignore it. Otherwise, consider disabling preloading for this route. ' +
-								'This route was preloaded due to a data-sveltekit-preload-data attribute. ' +
-								'See https://svelte.dev/docs/kit/link-options for more info'
-						);
-					}
+				void _preload_data(intent).catch((error) => {
+					console.warn(
+						`Preloading data for ${intent.url.pathname} failed with the following error: ${error.message}\n` +
+							'If this error is transient, you can ignore it. Otherwise, consider disabling preloading for this route. ' +
+							'This route was preloaded due to a data-sveltekit-preload-data attribute. ' +
+							'See https://svelte.dev/docs/kit/link-options for more info'
+					);
 				});
 			} else {
 				void _preload_data(intent);
@@ -2257,7 +2261,7 @@ export async function handle_error(error, event) {
  * @param {T} callback
  */
 function add_navigation_callback(callbacks, callback) {
-	onMount(() => {
+	svelte.onMount(() => {
 		callbacks.add(callback);
 
 		return () => {
@@ -2328,6 +2332,8 @@ export function disableScrollHandling() {
 	}
 }
 
+let warned_on_invalidate_all = false;
+
 /**
  * Allows you to navigate programmatically to a given route, with options such as keeping the current element focused.
  * Returns a Promise that resolves when SvelteKit navigates (or fails to navigate, in which case the promise rejects) to the specified `url`.
@@ -2341,8 +2347,9 @@ export function disableScrollHandling() {
  * @param {boolean} [opts.replaceState] If `true`, will replace the current `history` entry rather than creating a new one with `pushState`
  * @param {boolean} [opts.noScroll] If `true`, the browser will maintain its scroll position rather than scrolling to the top of the page after navigation
  * @param {boolean} [opts.keepFocus] If `true`, the currently focused element will retain focus after navigation. Otherwise, focus will be reset to the body
- * @param {boolean} [opts.invalidateAll] If `true`, all `load` functions of the page will be rerun. See https://svelte.dev/docs/kit/load#rerunning-load-functions for more info on invalidation.
+ * @param {boolean} [opts.refreshAll] If `true`, all `load` functions and queries of the page will be rerun. See https://svelte.dev/docs/kit/load#rerunning-load-functions for more info on invalidation.
  * @param {Array<string | URL | ((url: URL) => boolean)>} [opts.invalidate] Causes any load functions to re-run if they depend on one of the urls
+ * @param {boolean} [opts.invalidateAll] Deprecated in favour of opts.refreshAll.
  * @param {App.PageState} [opts.state] An optional object that will be available as `page.state`
  * @returns {Promise<void>}
  */
@@ -2371,6 +2378,14 @@ export async function goto(url, opts = {}) {
 		);
 	}
 
+	if (DEV && 'invalidateAll' in opts && !warned_on_invalidate_all) {
+		warned_on_invalidate_all = true;
+		console.warn(
+			`The \`goto(..., { invalidateAll: ${opts.invalidateAll} })\` option has been deprecated in favour of \`refreshAll\``
+		);
+	}
+
+	opts.refreshAll = opts.refreshAll ?? opts.invalidateAll;
 	return _goto(url, opts, 0, {}, intent);
 }
 
@@ -2390,16 +2405,17 @@ export async function goto(url, opts = {}) {
  * invalidate((url) => url.pathname === '/path');
  * ```
  * @param {string | URL | ((url: URL) => boolean)} resource The invalidated URL
+ * @param {boolean} [keepState] If `true`, the current `page.state` will be preserved. Otherwise, it will be reset to an empty object. `false` by default.
  * @returns {Promise<void>}
  */
-export function invalidate(resource) {
+export function invalidate(resource, keepState = false) {
 	if (!BROWSER) {
 		throw new Error('Cannot call invalidate(...) on the server');
 	}
 
 	push_invalidated(resource);
 
-	return _invalidate();
+	return _invalidate(!keepState);
 }
 
 /**
@@ -2416,6 +2432,10 @@ function push_invalidated(resource) {
 
 /**
  * Causes all `load` and `query` functions belonging to the currently active page to re-run. Returns a `Promise` that resolves when the page is subsequently updated.
+ *
+ * Note that this resets `page.state` to an empty object. If you want to preserve `page.state` (for example when using [shallow routing](https://svelte.dev/docs/kit/shallow-routing)), use `refreshAll` instead.
+ *
+ * @deprecated Use [`refreshAll`](https://svelte.dev/docs/kit/$app-navigation#refreshAll) instead. Unlike `invalidateAll`, `refreshAll` does not reset `page.state`.
  * @returns {Promise<void>}
  */
 export function invalidateAll() {
@@ -2428,18 +2448,17 @@ export function invalidateAll() {
 }
 
 /**
- * Causes all currently active remote functions to refresh, and all `load` functions belonging to the currently active page to re-run (unless disabled via the option argument).
+ * Causes all currently active remote functions to refresh, and all `load` functions belonging to the currently active page to re-run.
  * Returns a `Promise` that resolves when the page is subsequently updated.
- * @param {{ includeLoadFunctions?: boolean }} [options]
  * @returns {Promise<void>}
  */
-export function refreshAll({ includeLoadFunctions = true } = {}) {
+export function refreshAll() {
 	if (!BROWSER) {
 		throw new Error('Cannot call refreshAll() on the server');
 	}
 
 	force_invalidation = true;
-	return _invalidate(includeLoadFunctions, false);
+	return _invalidate(false);
 }
 
 /**
@@ -2466,7 +2485,22 @@ export async function preloadData(href) {
 		throw new Error(`Attempted to preload a URL that does not belong to this app: ${url}`);
 	}
 
-	const result = await _preload_data(intent);
+	/** @type {Awaited<ReturnType<typeof _preload_data>>} */
+	let result;
+
+	try {
+		result = await _preload_data(intent);
+	} catch (error) {
+		// `load_route` throws the handled error (an `App.Error` with a `status`)
+		// when a preload fails, so surface it in the documented `{ type: 'error' }` shape
+		const handled = /** @type {App.Error & { status?: number }} */ (error);
+		return {
+			type: 'error',
+			status: handled?.status ?? 500,
+			error: handled
+		};
+	}
+
 	if (result.type === 'redirect') {
 		return {
 			type: result.type,
@@ -2477,14 +2511,6 @@ export async function preloadData(href) {
 
 	const { status, data } = result.props.page ?? page;
 
-	if (result.type === 'loaded' && result.state.error) {
-		return {
-			type: 'error',
-			status,
-			error: result.state.error
-		};
-	}
-
 	return { type: result.type, status, data };
 }
 
@@ -2572,10 +2598,6 @@ export function pushState(url, state) {
 	has_navigated = true;
 
 	page.state = state;
-	root.$set({
-		// we need to assign a new page object so that subscribers are correctly notified
-		page: untrack(() => clone_page(page))
-	});
 
 	clear_onward_history(current_history_index, current_navigation_index);
 }
@@ -2616,9 +2638,6 @@ export function replaceState(url, state) {
 	history.replaceState(opts, '', resolve_url(url));
 
 	page.state = state;
-	root.$set({
-		page: untrack(() => clone_page(page))
-	});
 }
 
 /**
@@ -2637,7 +2656,7 @@ export async function applyAction(result) {
 	if (result.type === 'error') {
 		await set_nearest_error_page(result.error);
 	} else if (result.type === 'redirect') {
-		await _goto(result.location, { invalidateAll: true }, 0);
+		await _goto(result.location, { refreshAll: true }, 0);
 	} else {
 		page.form = result.data;
 		page.status = result.status;
@@ -2646,16 +2665,15 @@ export async function applyAction(result) {
 		root.$set({
 			// this brings Svelte's view of the world in line with SvelteKit's
 			// after use:enhance reset the form....
-			form: null,
-			page: clone_page(page)
+			form: null
 		});
 
 		// ...so that setting the `form` prop takes effect and isn't ignored
-		await tick();
+		await svelte.tick();
 		root.$set({ form: result.data });
 
 		if (result.type === 'success') {
-			reset_focus(page.url);
+			reset_focus(/** @type {URL} */ (page.url));
 		}
 	}
 }
@@ -2683,9 +2701,10 @@ export async function set_nearest_error_page(error) {
 		current = { ...navigation_result.state, nav: current.nav };
 
 		root.$set(navigation_result.props);
+		current_tree = navigation_result.props.tree;
 		update(navigation_result.props.page);
 
-		void tick().then(() => reset_focus(current.url));
+		void svelte.tick().then(() => reset_focus(current.url));
 	}
 }
 
@@ -3010,7 +3029,7 @@ function _start_router() {
 		// the navigation away from it was successful.
 		// Info about bfcache here: https://web.dev/bfcache
 		if (event.persisted) {
-			stores.navigating.set((navigating.current = null));
+			navigating.current = null;
 		}
 	});
 
@@ -3019,8 +3038,6 @@ function _start_router() {
 	 */
 	function update_url(url) {
 		current.url = page.url = url;
-		stores.page.set(clone_page(page));
-		stores.page.notify();
 	}
 }
 
@@ -3309,9 +3326,6 @@ function reset_focus(url, scroll = true) {
 			const tabindex = root.getAttribute('tabindex');
 
 			root.tabIndex = -1;
-			// TODO: remove this when we switch to TypeScript 6
-			// @ts-ignore options.focusVisible is only typed in TypeScript 6
-			// See https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus#browser_compatibility
 			root.focus({ preventScroll: true, focusVisible: false });
 
 			// restore `tabindex` as to prevent `root` from stealing input from elements
@@ -3414,28 +3428,6 @@ function create_navigation(current, intent, url, type, target_scroll = null) {
 	};
 }
 
-/**
- * TODO: remove this in 3.0 when the page store is also removed
- *
- * We need to assign a new page object so that subscribers are correctly notified.
- * However, spreading `{ ...page }` returns an empty object so we manually
- * assign to each property instead.
- *
- * @param {import('@sveltejs/kit').Page} page
- */
-function clone_page(page) {
-	return {
-		data: page.data,
-		error: page.error,
-		form: page.form,
-		params: page.params,
-		route: page.route,
-		state: page.state,
-		status: page.status,
-		url: page.url
-	};
-}
-
 /**
  * @param {URL} url
  * @returns {URL}