fix: return correct locale in root 404 and 500 page with i18n (#12365)

Co-authored-by: Emanuele Stoppa <[email protected]>
withastro · Nov 21, 2024 · a23985b · a23985b
1 parent 28dd3ce
commit a23985b
Show file tree

Hide file tree

Showing 5 changed files with 57 additions and 5 deletions.
diff --git a/.changeset/warm-poems-breathe.md b/.changeset/warm-poems-breathe.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Fixes an issue where `Astro.currentLocale` was not correctly returning the locale for 404 and 500 pages.
diff --git a/packages/astro/src/core/render-context.ts b/packages/astro/src/core/render-context.ts
@@ -36,6 +36,7 @@ import { callMiddleware } from './middleware/callMiddleware.js';
 import { sequence } from './middleware/index.js';
 import { renderRedirect } from './redirects/render.js';
 import { type Pipeline, Slots, getParams, getProps } from './render/index.js';
+import { isRoute404or500 } from './routing/match.js';
 import { copyRequest, setOriginPathname } from './routing/rewrite.js';
 
 export const apiContextRoutesSymbol = Symbol.for('context.routes');
@@ -541,11 +542,9 @@ export class RenderContext {
 		}
 
 		let computedLocale;
-		if (routeData.pathname) {
-			computedLocale = computeCurrentLocale(routeData.pathname, locales, defaultLocale);
-		} else {
-			computedLocale = computeCurrentLocale(url.pathname, locales, defaultLocale);
-		}
+		const pathname =
+			routeData.pathname && !isRoute404or500(routeData) ? routeData.pathname : url.pathname;
+		computedLocale = computeCurrentLocale(pathname, locales, defaultLocale);
 		this.#currentLocale = computedLocale ?? fallbackTo;
 
 		return this.#currentLocale;

diff --git a/packages/astro/src/core/routing/match.ts b/packages/astro/src/core/routing/match.ts
@@ -15,3 +15,13 @@ export function matchRoute(pathname: string, manifest: ManifestData): RouteData
 export function matchAllRoutes(pathname: string, manifest: ManifestData): RouteData[] {
 	return manifest.routes.filter((route) => route.pattern.test(decodeURI(pathname)));
 }
+
+/**
+ * Determines if the given route matches a 404 or 500 error page.
+ *
+ * @param {RouteData} route - The route data to check.
+ * @returns {boolean} `true` if the route matches a 404 or 500 error page, otherwise `false`.
+ */
+export function isRoute404or500(route: RouteData): boolean {
+	return route.pattern.test('/404') || route.pattern.test('/500');
+}
diff --git a/packages/astro/test/fixtures/i18n-routing/src/pages/404.astro b/packages/astro/test/fixtures/i18n-routing/src/pages/404.astro
@@ -0,0 +1,12 @@
+---
+const currentLocale = Astro.currentLocale;
+---
+<html>
+<head>
+  <title>404 - Not Found</title>
+</head>
+<body>
+  <h1>404 - Not Found</h1>
+  <p>Current Locale: {currentLocale ? currentLocale : "none"}</p>
+</body>
+</html>
diff --git a/packages/astro/test/i18n-routing.test.js b/packages/astro/test/i18n-routing.test.js
@@ -82,6 +82,18 @@ describe('[DEV] i18n routing', () => {
 			assert.equal(response.status, 200);
 			assert.equal((await response.text()).includes('Endurance'), true);
 		});
+
+		it('should return the correct locale on 404 page for non existing default locale page', async () => {
+			const response = await fixture.fetch('/es/nonexistent-page');
+			assert.equal(response.status, 404);
+			assert.equal((await response.text()).includes('Current Locale: es'), true);
+    });
+
+    it('should return the correct locale on 404 page for non existing english locale page', async () => {
+			const response = await fixture.fetch('/en/nonexistent-page');
+			assert.equal(response.status, 404);
+			assert.equal((await response.text()).includes('Current Locale: en'), true);
+    });
 	});
 
 	describe('i18n routing', () => {
@@ -1200,6 +1212,20 @@ describe('[SSR] i18n routing', () => {
 			assert.equal(response.status, 200);
 			assert.equal((await response.text()).includes('Endurance'), true);
 		});
+
+		it('should return the correct locale on 404 page for non existing default locale page', async () => {
+			let request = new Request('http://example.com/es/nonexistent-page');
+			let response = await app.render(request);
+			assert.equal(response.status, 404);
+			assert.equal((await response.text()).includes('Current Locale: es'), true);
+		});
+
+		it('should return the correct locale on 404 page for non existing english locale page', async () => {
+			let request = new Request('http://example.com/en/nonexistent-page');
+			let response = await app.render(request);
+			assert.equal(response.status, 404);
+			assert.equal((await response.text()).includes('Current Locale: en'), true);
+		});
 	});
 
 	describe('default', () => {