From b41963b775149b802eea9e12c5fe266bb9a02944 Mon Sep 17 00:00:00 2001
From: Johannes Spohr <johannes.spohr@futurice.com>
Date: Mon, 22 May 2023 18:06:06 +0200
Subject: [PATCH] Render 404 page content when a `Response` with status 404 is
 returned from a page (#7143)

---
 .changeset/tough-pots-visit.md                 |  5 +++++
 packages/astro/src/core/app/index.ts           | 18 +++++++++---------
 .../src/pages/causes-404.astro                 |  6 ++++++
 packages/astro/test/ssr-404-500-pages.test.js  | 10 ++++++++++
 4 files changed, 30 insertions(+), 9 deletions(-)
 create mode 100644 .changeset/tough-pots-visit.md
 create mode 100644 packages/astro/test/fixtures/ssr-api-route-custom-404/src/pages/causes-404.astro

diff --git a/.changeset/tough-pots-visit.md b/.changeset/tough-pots-visit.md
new file mode 100644
index 000000000000..0018af567d5b
--- /dev/null
+++ b/.changeset/tough-pots-visit.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Render 404 page content when a `Response` with status 404 is returned from a page
diff --git a/packages/astro/src/core/app/index.ts b/packages/astro/src/core/app/index.ts
index 078d43e5012c..1e2dd1d24164 100644
--- a/packages/astro/src/core/app/index.ts
+++ b/packages/astro/src/core/app/index.ts
@@ -144,19 +144,19 @@ export class App {
 		if (routeData.type === 'page') {
 			let response = await this.#renderPage(request, routeData, mod, defaultStatus);
 
-			// If there was a 500 error, try sending the 500 page.
-			if (response.status === 500) {
-				const fiveHundredRouteData = matchRoute('/500', this.#manifestData);
-				if (fiveHundredRouteData) {
-					mod = await this.#manifest.pageMap.get(fiveHundredRouteData.component)!();
+			// If there was a known error code, try sending the according page (e.g. 404.astro / 500.astro).
+			if (response.status === 500 || response.status === 404) {
+				const errorPageData = matchRoute('/' + response.status, this.#manifestData);
+				if (errorPageData && errorPageData.route !== routeData.route) {
+					mod = await this.#manifest.pageMap.get(errorPageData.component)!();
 					try {
-						let fiveHundredResponse = await this.#renderPage(
+						let errorResponse = await this.#renderPage(
 							request,
-							fiveHundredRouteData,
+							errorPageData,
 							mod,
-							500
+							response.status
 						);
-						return fiveHundredResponse;
+						return errorResponse;
 					} catch {}
 				}
 			}
diff --git a/packages/astro/test/fixtures/ssr-api-route-custom-404/src/pages/causes-404.astro b/packages/astro/test/fixtures/ssr-api-route-custom-404/src/pages/causes-404.astro
new file mode 100644
index 000000000000..9331037be3c5
--- /dev/null
+++ b/packages/astro/test/fixtures/ssr-api-route-custom-404/src/pages/causes-404.astro
@@ -0,0 +1,6 @@
+---
+return new Response(null, {
+	status: 404,
+	statusText: 'Not found',
+});
+---
diff --git a/packages/astro/test/ssr-404-500-pages.test.js b/packages/astro/test/ssr-404-500-pages.test.js
index 2216aa762373..10e311ef983e 100644
--- a/packages/astro/test/ssr-404-500-pages.test.js
+++ b/packages/astro/test/ssr-404-500-pages.test.js
@@ -62,6 +62,16 @@ describe('404 and 500 pages', () => {
 			expect($('h1').text()).to.equal('Something went horribly wrong!');
 		});
 
+		it('404 page returned when there is an 404 response returned from route', async () => {
+			const app = await fixture.loadTestAdapterApp();
+			const request = new Request('http://example.com/causes-404');
+			const response = await app.render(request);
+			expect(response.status).to.equal(404);
+			const html = await response.text();
+			const $ = cheerio.load(html);
+			expect($('h1').text()).to.equal('Something went horribly wrong!');
+		});
+
 		it('500 page returned when there is an error', async () => {
 			const app = await fixture.loadTestAdapterApp();
 			const request = new Request('http://example.com/causes-error');