diff --git a/packages/react-router/__tests__/absolute-path-matching-test.tsx b/packages/react-router/__tests__/absolute-path-matching-test.tsx index f20b2b02ec..76609a76b0 100644 --- a/packages/react-router/__tests__/absolute-path-matching-test.tsx +++ b/packages/react-router/__tests__/absolute-path-matching-test.tsx @@ -1,12 +1,12 @@ import type { RouteObject } from "react-router"; import { matchRoutes } from "react-router"; -describe("absolute path matching", () => { - function pickPaths(routes: RouteObject[], pathname: string) { - let matches = matchRoutes(routes, { pathname }); - return matches ? matches.map(match => match.route.path || "") : []; - } +function pickPaths(routes: RouteObject[], pathname: string): string[] | null { + let matches = matchRoutes(routes, pathname); + return matches && matches.map(match => match.route.path || ""); +} +describe("absolute path matching", () => { it("matches a nested route with an absolute path", () => { let routes = [ { @@ -26,6 +26,21 @@ describe("absolute path matching", () => { expect(pickPaths(routes, "/users/123")).toEqual(["/users", "/users/:id"]); }); + it("matches a nested splat route with an absolute path", () => { + let routes = [ + { + path: "/users", + children: [{ path: "/users/*" }] + } + ]; + + // expect(pickPaths(routes, "/users")).toEqual(["/users"]); + expect(pickPaths(routes, "/users/not-found")).toEqual([ + "/users", + "/users/*" + ]); + }); + it("throws when the nested path does not begin with its parent path", () => { expect(() => { matchRoutes( diff --git a/packages/react-router/index.tsx b/packages/react-router/index.tsx index 0361be58db..3987d3645e 100644 --- a/packages/react-router/index.tsx +++ b/packages/react-router/index.tsx @@ -903,16 +903,13 @@ function matchRouteBranch( let matches: RouteMatch[] = []; for (let i = 0; i < routesMeta.length; ++i) { let meta = routesMeta[i]; + let end = i === routesMeta.length - 1; let trailingPathname = matchedPathname === "/" ? pathname : pathname.slice(matchedPathname.length) || "/"; let match = matchPath( - { - path: meta.relativePath, - caseSensitive: meta.caseSensitive, - end: i === routesMeta.length - 1 - }, + { path: meta.relativePath, caseSensitive: meta.caseSensitive, end }, trailingPathname ); @@ -1068,7 +1065,7 @@ function compilePath( }); if (path.endsWith("*")) { - if (path.endsWith("/*")) { + if (path !== "/*" && path.endsWith("/*")) { source += "(?:\\/(.+)|\\/?)$"; // Don't include the / in params['*'] } else { source += "(.*)$";