Fix splat route index matching (#6130)

remix-run · Apr 24, 2023 · e48bdff · e48bdff
1 parent 6fd8ee4
commit e48bdff
Show file tree

Hide file tree

Showing 5 changed files with 115 additions and 4 deletions.
diff --git a/.changeset/splat-index-matching.md b/.changeset/splat-index-matching.md
@@ -0,0 +1,5 @@
+---
+"@remix-run/dev": patch
+---
+
+Fix a bug in route matching that wass preventing a single splat (`$.jsx`) route from matching a root `/` path
diff --git a/integration/revalidate-test.ts b/integration/revalidate-test.ts
@@ -44,6 +44,11 @@ test.describe("Revalidation", () => {
             }
           `,
 
+          "app/routes/_index.jsx": js`
+            export default function Component() {
+              return <h1>Index</h1>;
+            }
+          `,
           "app/routes/parent.jsx": js`
             import { json } from "@remix-run/node";
             import { Outlet, useLoaderData } from "@remix-run/react";

diff --git a/integration/splat-routes-test.ts b/integration/splat-routes-test.ts
@@ -3,9 +3,9 @@ import { test, expect } from "@playwright/test";
 import { createFixture, js } from "./helpers/create-fixture";
 import type { Fixture } from "./helpers/create-fixture";
 
-test.describe("rendering", () => {
-  let fixture: Fixture;
+let fixture: Fixture;
 
+test.describe("rendering", () => {
   let ROOT_$ = "FLAT";
   let ROOT_INDEX = "ROOT_INDEX";
   let FLAT_$ = "FLAT";
@@ -128,3 +128,105 @@ test.describe("rendering", () => {
     expect(await res.text()).toMatch(PARENTLESS_$);
   });
 });
+
+test.describe("root splat route without index", () => {
+  test("matches routes correctly (v1)", async ({ page }) => {
+    fixture = await createFixture({
+      future: { v2_routeConvention: false },
+      files: {
+        "app/routes/$.jsx": js`
+          export default function Component() {
+            return <h1>Hello Splat</h1>
+          }
+        `,
+      },
+    });
+
+    let res = await fixture.requestDocument("/");
+    expect(await res.text()).toMatch("Hello Splat");
+
+    res = await fixture.requestDocument("/splat");
+    expect(await res.text()).toMatch("Hello Splat");
+
+    res = await fixture.requestDocument("/splat/deep/path");
+    expect(await res.text()).toMatch("Hello Splat");
+  });
+
+  test("matches routes correctly (v2)", async ({ page }) => {
+    fixture = await createFixture({
+      future: { v2_routeConvention: true },
+      files: {
+        "app/routes/$.jsx": js`
+          export default function Component() {
+            return <h1>Hello Splat</h1>
+          }
+        `,
+      },
+    });
+
+    let res = await fixture.requestDocument("/");
+    expect(await res.text()).toMatch("Hello Splat");
+
+    res = await fixture.requestDocument("/splat");
+    expect(await res.text()).toMatch("Hello Splat");
+
+    res = await fixture.requestDocument("/splat/deep/path");
+    expect(await res.text()).toMatch("Hello Splat");
+  });
+});
+
+test.describe("root splat route with index", () => {
+  test("matches routes correctly (v1)", async ({ page }) => {
+    fixture = await createFixture({
+      future: { v2_routeConvention: false },
+      files: {
+        "app/routes/index.jsx": js`
+          export default function Component() {
+            return <h1>Hello Index</h1>
+          }
+        `,
+        "app/routes/$.jsx": js`
+          export default function Component() {
+            return <h1>Hello Splat</h1>
+          }
+        `,
+      },
+    });
+
+    let res = await fixture.requestDocument("/");
+    expect(await res.text()).toMatch("Hello Index");
+
+    res = await fixture.requestDocument("/splat");
+    expect(await res.text()).toMatch("Hello Splat");
+
+    res = await fixture.requestDocument("/splat/deep/path");
+    expect(await res.text()).toMatch("Hello Splat");
+  });
+
+  test("matches routes correctly (v2)", async ({ page }) => {
+    fixture = await createFixture({
+      future: { v2_routeConvention: true },
+      files: {
+        "app/routes/_index.jsx": js`
+          export default function Component() {
+            return <h1>Hello Index</h1>
+          }
+        `,
+        "app/routes/$.jsx": js`
+          export default function Component() {
+            return <h1>Hello Splat</h1>
+          }
+        `,
+      },
+    });
+
+    let res = await fixture.requestDocument("/");
+    expect(await res.text()).toMatch("Hello Index");
+
+    res = await fixture.requestDocument("/splat");
+    expect(await res.text()).toMatch("Hello Splat");
+
+    res = await fixture.requestDocument("/splat/deep/path");
+    expect(await res.text()).toMatch("Hello Splat");
+  });
+});
diff --git a/packages/remix-dev/__tests__/readConfig-test.ts b/packages/remix-dev/__tests__/readConfig-test.ts
@@ -68,7 +68,6 @@ describe("readConfig", () => {
           "root": Object {
             "file": "root.tsx",
             "id": "root",
-            "path": "",
           },
         },
         "serverBuildPath": Any<String>,

diff --git a/packages/remix-dev/config.ts b/packages/remix-dev/config.ts
@@ -672,7 +672,7 @@ export async function readConfig(
   }
 
   let routes: RouteManifest = {
-    root: { path: "", id: "root", file: rootRouteFile },
+    root: { id: "root", file: rootRouteFile },
   };
 
   let routesConvention: typeof flatRoutes;