fall back to full page navigation for unmatched routes - closes #3935

Author: Rich-Harris

packages/kit/src/runtime/app/navigation.js

@@ -45,8 +45,8 @@ async function invalidate_(resource) {
 /**
  * @type {import('$app/navigation').prefetch}
  */
-function prefetch_(href) {
-	return router.prefetch(new URL(href, get_base_uri(document)));
+async function prefetch_(href) {
+	await router.prefetch(new URL(href, get_base_uri(document)));
 }
 
 /**

packages/kit/src/runtime/client/renderer.js

@@ -149,7 +149,7 @@ export class Renderer {
 		/** @type {Map<string, import('./types').NavigationResult>} */
 		this.cache = new Map();
 
-		/** @type {{id: string | null, promise: Promise<import('./types').NavigationResult> | null}} */
+		/** @type {{id: string | null, promise: Promise<import('./types').NavigationResult | undefined> | null}} */
 		this.loading = {
 			id: null,
 			promise: null
@@ -316,6 +316,11 @@ export class Renderer {
 		const token = (this.token = {});
 		let navigation_result = await this._get_navigation_result(info, no_cache);
 
+		if (!navigation_result) {
+			location.href = info.url.href;
+			return;
+		}
+
 		// abort if user navigated during update
 		if (token !== this.token) return;
 
@@ -407,7 +412,7 @@ export class Renderer {
 
 	/**
 	 * @param {import('./types').NavigationInfo} info
-	 * @returns {Promise<import('./types').NavigationResult>}
+	 * @returns {Promise<import('./types').NavigationResult | undefined>}
 	 */
 	load(info) {
 		this.loading.promise = this._get_navigation_result(info, false);
@@ -459,7 +464,7 @@ export class Renderer {
 	/**
 	 * @param {import('./types').NavigationInfo} info
 	 * @param {boolean} no_cache
-	 * @returns {Promise<import('./types').NavigationResult>}
+	 * @returns {Promise<import('./types').NavigationResult | undefined>}
 	 */
 	async _get_navigation_result(info, no_cache) {
 		if (this.loading.id === info.id && this.loading.promise) {
@@ -491,12 +496,6 @@ export class Renderer {
 			);
 			if (result) return result;
 		}
-
-		return await this._load_error({
-			status: 404,
-			error: new Error(`Not found: ${info.url.pathname}`),
-			url: info.url
-		});
 	}
 
 	/**

packages/kit/src/runtime/client/router.js

@@ -324,7 +324,7 @@ export class Router {
 
 	/**
 	 * @param {URL} url
-	 * @returns {Promise<import('./types').NavigationResult>}
+	 * @returns {Promise<import('./types').NavigationResult | undefined>}
 	 */
 	async prefetch(url) {
 		const info = this.parse(url);