Fix/error redirect

.changeset/shaggy-radios-rush.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+error pages can now redirect

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

@@ -661,6 +661,14 @@ export class Renderer {
 								context: node_loaded.context
 							});
 
+							if (error_loaded && error_loaded.loaded && error_loaded.loaded.redirect) {
+								return {
+									redirect: error_loaded.loaded.redirect,
+									props: {},
+									state: this.current
+								};
+							}
+
 							if (error_loaded && error_loaded.loaded && error_loaded.loaded.error) {
 								continue;
 							}
@@ -716,16 +724,23 @@ export class Renderer {
 			context: {}
 		});
 
-		const branch = [
-			node,
-			await this._load_node({
-				status,
-				error,
-				module: await this.fallback[1],
-				page,
-				context: (node && node.loaded && node.loaded.context) || {}
-			})
-		];
+		const errorNode = await this._load_node({
+			status,
+			error,
+			module: await this.fallback[1],
+			page,
+			context: (node && node.loaded && node.loaded.context) || {}
+		});
+
+		if (errorNode && errorNode.loaded && errorNode.loaded.redirect) {
+			return {
+				redirect: errorNode.loaded.redirect,
+				props: {},
+				state: this.current
+			};
+		}
+
+		const branch = [node, errorNode];
 
 		return await this._get_navigation_result_from_branch({ page, branch });
 	}

packages/kit/src/runtime/server/page/respond.js

@@ -145,6 +145,16 @@ export async function respond(opts) {
 								}
 
 								page_config = get_page_config(error_node.module, options);
+
+								if (error_loaded.loaded.redirect) {
+									return {
+										status: error_loaded.loaded.status,
+										headers: {
+											location: encodeURI(error_loaded.loaded.redirect)
+										}
+									};
+								}
+
 								branch = branch.slice(0, j + 1).concat(error_loaded);
 								break ssr;
 							} catch (/** @type {unknown} */ err) {

packages/kit/src/runtime/server/page/respond_with_error.js

@@ -18,6 +18,7 @@ import { coalesce_to_error } from '../../utils.js';
  *   status: number;
  *   error: Error;
  * }} opts
+ * @returns {Promise<import('types/hooks').ServerResponse>}
  */
 export async function respond_with_error({ request, options, state, $session, status, error }) {
 	const default_layout = await options.load_component(options.manifest.layout);
@@ -45,24 +46,32 @@ export async function respond_with_error({ request, options, state, $session, st
 		is_error: false
 	}));
 
-	const branch = [
-		loaded,
-		/** @type {Loaded} */ (await load_node({
-			request,
-			options,
-			state,
-			route: null,
-			page,
-			node: default_error,
-			$session,
-			context: loaded ? loaded.context : {},
-			prerender_enabled: is_prerender_enabled(options, default_error, state),
-			is_leaf: false,
-			is_error: true,
-			status,
-			error
-		}))
-	];
+	const error_loaded = /** @type {import('./types').Loaded} */ (await load_node({
+		request,
+		options,
+		state,
+		route: null,
+		page,
+		node: default_error,
+		$session,
+		context: loaded ? loaded.context : {},
+		prerender_enabled: is_prerender_enabled(options, default_error, state),
+		is_leaf: false,
+		is_error: true,
+		status,
+		error
+	}));
+
+	if (error_loaded.loaded.redirect) {
+		return {
+			status: error_loaded.loaded.status,
+			headers: {
+				location: encodeURI(error_loaded.loaded.redirect)
+			}
+		};
+	}
+
+	const branch = [loaded, error_loaded];
 
 	try {
 		return await render_response({

packages/kit/test/apps/basics/src/routes/__error.svelte

@@ -1,6 +1,13 @@
 <script context="module">
 	/** @type {import('@sveltejs/kit').ErrorLoad} */
 	export function load({ status, error }) {
+		if (error && error.message.includes('/redirect/nowhere')) {
+			return {
+				status: 307,
+				redirect: '/redirect/c'
+			};
+		}
+
 		return {
 			props: { status, error }
 		};

packages/kit/test/apps/basics/src/routes/redirect/_tests.js

@@ -47,4 +47,32 @@ export default function (test, is_dev) {
 			'This is your custom error page saying: ""redirect" property returned from load() must be accompanied by a 3xx status code"'
 		);
 	});
+
+	test('serves redirection on error', '/redirect/crashing', async ({ base, page }) => {
+		assert.equal(await page.url(), `${base}/redirect/c`);
+		assert.equal(await page.textContent('h1'), 'c');
+	});
+
+	test('navigates to redirection on error', '/redirect', async ({ base, page, clicknav }) => {
+		await clicknav('[href="/redirect/crashing"]');
+
+		assert.equal(await page.url(), `${base}/redirect/c`);
+		assert.equal(await page.textContent('h1'), 'c');
+	});
+
+	test('serves redirection on missing page', '/redirect/nowhere', async ({ base, page }) => {
+		assert.equal(await page.url(), `${base}/redirect/c`);
+		assert.equal(await page.textContent('h1'), 'c');
+	});
+
+	test(
+		'navigates to redirection on missing page',
+		'/redirect',
+		async ({ base, page, clicknav }) => {
+			await clicknav('[href="/redirect/nowhere"]');
+
+			assert.equal(await page.url(), `${base}/redirect/c`);
+			assert.equal(await page.textContent('h1'), 'c');
+		}
+	);
 }

packages/kit/test/apps/basics/src/routes/redirect/crashing/__error.svelte

@@ -0,0 +1,11 @@
+<script context="module">
+	/** @type {import('@sveltejs/kit').ErrorLoad} */
+	export async function load() {
+		return {
+			status: 307,
+			redirect: './c'
+		};
+	}
+</script>
+
+<h1>Redirecting error page</h1>

packages/kit/test/apps/basics/src/routes/redirect/crashing/index.svelte

@@ -0,0 +1,7 @@
+<script context="module">
+	export async function load() {
+		throw new Error('oopsie');
+	}
+</script>
+
+<h1>Crashing page</h1>

packages/kit/test/apps/basics/src/routes/redirect/index.svelte

@@ -6,4 +6,7 @@
 <a href="/redirect/loopy/b">b (loopy)</a>
 
 <a href="/redirect/missing-status/a">a (missing-status)</a>
-<a href="/redirect/missing-status/b">b (missing-status)</a>
+<a href="/redirect/missing-status/b">b (missing-status)</a>
+
+<a href="/redirect/crashing">crashing</a>
+<a href="/redirect/nowhere">nowhere</a>