fix: normalize the rawPath without locale before attempting to asserting the 404 page (#448)

* fix: normalize the rawPath without locale before attempting to assert the 404 page

* fix: eslint issues

* fix: refactor to enhance existing regex

* chore: add changelog

* fix: ensure root locale urls are captured

* chore: add i18n configuration

* fix: use double quotes

* fix e2e

---------

Co-authored-by: Dorseuil Nicolas <[email protected]>

Author: JanStevens

.changeset/tidy-mice-train.md

@@ -0,0 +1,5 @@
+---
+"open-next": patch
+---
+
+fix 404 handeling with i18n routes

examples/pages-router/next.config.js

@@ -1,6 +1,10 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   transpilePackages: ["@example/shared"],
+  i18n: {
+    locales: ["en", "nl"],
+    defaultLocale: "en",
+  },
   cleanDistDir: true,
   reactStrictMode: true,
   output: "standalone",
@@ -9,10 +13,11 @@ const nextConfig = {
     ignoreDuringBuilds: true,
   },
   rewrites: () => [
-    { source: "/rewrite", destination: "/" },
+    { source: "/rewrite", destination: "/", locale: false },
     {
       source: "/rewriteUsingQuery",
       destination: "/:destination/",
+      locale: false,
       has: [
         {
           type: "query",

packages/open-next/src/adapters/config/util.ts

@@ -59,6 +59,7 @@ export function loadRoutesManifest(nextDir: string) {
       dynamic: routesManifest.dynamicRoutes ?? [],
       data: dataRoutes,
     },
+    locales: routesManifest.i18n?.locales ?? [],
   };
 }
 

packages/open-next/src/core/routingHandler.ts

@@ -22,12 +22,17 @@ export interface MiddlewareOutputEvent {
   origin: Origin | false;
 }
 
+// Add the locale prefix to the regex so we correctly match the rawPath
+const optionalLocalePrefixRegex = !!RoutesManifest.locales.length
+  ? `^/(?:${RoutesManifest.locales.map((locale) => `${locale}/?`).join("|")})?`
+  : "^/";
+
 const staticRegexp = RoutesManifest.routes.static.map(
-  (route) => new RegExp(route.regex),
+  (route) => new RegExp(route.regex.replace("^/", optionalLocalePrefixRegex)),
 );
 
 const dynamicRegexp = RoutesManifest.routes.dynamic.map(
-  (route) => new RegExp(route.regex),
+  (route) => new RegExp(route.regex.replace("^/", optionalLocalePrefixRegex)),
 );
 
 export default async function routingHandler(
@@ -67,6 +72,7 @@ export default async function routingHandler(
     internalEvent = beforeRewrites.internalEvent;
     isExternalRewrite = beforeRewrites.isExternalRewrite;
   }
+
   const isStaticRoute =
     !isExternalRewrite &&
     staticRegexp.some((route) =>

packages/open-next/src/types/next-types.ts

@@ -112,6 +112,9 @@ export interface RoutesManifest {
     | RewriteDefinition[];
   redirects: RedirectDefinition[];
   headers?: Header[];
+  i18n?: {
+    locales: string[];
+  };
 }
 
 export interface MiddlewareInfo {

packages/tests-e2e/tests/pagesRouter/data.test.ts

@@ -3,18 +3,18 @@ import { expect, test } from "@playwright/test";
 test("fix _next/data", async ({ page }) => {
   await page.goto("/");
 
-  const isrJson = page.waitForResponse("/_next/data/*/isr.json");
+  const isrJson = page.waitForResponse("/_next/data/*/en/isr.json");
   await page.locator('[href="/isr/"]').click();
   const response = await isrJson;
   expect(response.ok()).toBe(true);
-  expect(response.request().url()).toMatch(/\/_next\/data\/.*\/isr\.json$/);
+  expect(response.request().url()).toMatch(/\/_next\/data\/.*\/en\/isr\.json$/);
   await page.waitForURL("/isr/");
 
-  const homeJson = page.waitForResponse("/_next/data/*/index.json");
+  const homeJson = page.waitForResponse("/_next/data/*/en.json");
   await page.locator('[href="/"]').click();
   const response2 = await homeJson;
   expect(response2.ok()).toBe(true);
-  expect(response2.request().url()).toMatch(/\/_next\/data\/.*\/index\.json$/);
+  expect(response2.request().url()).toMatch(/\/_next\/data\/.*\/en\.json$/);
   await page.waitForURL("/");
   const body = await response2.json();
   expect(body).toEqual({ pageProps: { hello: "world" }, __N_SSG: true });