fix: differentiate between 404 and 500 when rendering an error pa…

…ge (#10565)

.changeset/hip-tips-drum.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+fix: correctly return 404 when navigating to a missing page and the root layout fetches a prerendered endpoint

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

@@ -28,6 +28,11 @@ export async function respond_with_error({
  error,
  resolve_opts
 }) {
+ // reroute to the fallback page to prevent an infinite chain of requests.
+ if (event.request.headers.get('x-sveltekit-error')) {
+ return static_error_page(options, status, /** @type {Error} */ (error).message);
+ }
+
  /** @type {import('./types').Fetched[]} */
  const fetched = [];
 

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

@@ -457,6 +457,14 @@ export async function respond(request, options, manifest, state) {
  return response;
  }
 
+ if (state.error && event.isSubRequest) {
+ return await fetch(request, {
+ headers: {
+ 'x-sveltekit-error': 'true'
+ }
+ });
+ }
+
  if (state.error) {
  return text('Internal Server Error', {
  status: 500

packages/kit/test/apps/basics/src/app.d.ts

@@ -5,6 +5,7 @@ declare global {
  name?: string;
  key: string;
  params: Record<string, string>;
+ url?: URL;
  }
 
  interface Platform {}

packages/kit/test/apps/basics/src/hooks.server.js

@@ -128,6 +128,12 @@ export const handle = sequence(
  throw redirect(303, '/actions/enhance');
  }
 
+ return resolve(event);
+ },
+ async ({ event, resolve }) => {
+ if (['/non-existent-route', '/non-existent-route-loop'].includes(event.url.pathname)) {
+ event.locals.url = new URL(event.request.url);
+ }
  return resolve(event);
  }
 );

packages/kit/test/apps/basics/src/routes/+layout.server.js

@@ -12,7 +12,15 @@ if (JSON.parse(env.SOME_JSON).answer !== 42) {
 }
 
 /** @type {import('./$types').LayoutServerLoad} */
-export async function load({ cookies }) {
+export async function load({ cookies, locals, fetch }) {
+ if (locals.url?.pathname === '/non-existent-route') {
+ await fetch('/prerendering/prerendered-endpoint/api').then((r) => r.json());
+ }
+
+ if (locals.url?.pathname === '/non-existent-route-loop') {
+ await fetch('/non-existent-route-loop');
+ }
+
  const should_fail = cookies.get('fail-type');
  if (should_fail) {
  cookies.delete('fail-type', { path: '/' });

packages/kit/test/apps/basics/test/test.js

@@ -515,6 +515,16 @@ test.describe('Load', () => {
 
  expect(await page.textContent('p')).toBe('error: false');
  });
+
+ test('404 and root layout load fetch to prerendered endpoint works', async ({ page }) => {
+ await page.goto('/non-existent-route');
+
+ expect(await page.textContent('h1')).toBe('404');
+
+ await page.goto('/non-existent-route-loop');
+
+ expect(await page.textContent('h1')).toBe('404');
+ });
 });
 
 test.describe('Nested layouts', () => {