diff --git a/packages/react-router/__tests__/useResolvedPath-test.tsx b/packages/react-router/__tests__/useResolvedPath-test.tsx index a07201f7b4..b4f3d70ae2 100644 --- a/packages/react-router/__tests__/useResolvedPath-test.tsx +++ b/packages/react-router/__tests__/useResolvedPath-test.tsx @@ -1,7 +1,16 @@ import * as React from "react"; import * as TestRenderer from "react-test-renderer"; import type { Path } from "react-router"; -import { MemoryRouter, Routes, Route, useResolvedPath } from "react-router"; +import { + MemoryRouter, + Routes, + Route, + RouterProvider, + createMemoryRouter, + useResolvedPath, + Outlet, + useParams, +} from "react-router"; function ShowResolvedPath({ path }: { path: string | Path }) { return
{JSON.stringify(useResolvedPath(path))}; @@ -313,4 +322,98 @@ describe("useResolvedPath", () => { `); }); }); + + // Follow up test to https://github.com/remix-run/react-router/pull/10983 to + // ensure we do this consistently across route types + it("resolves relative paths consistently across route types", async () => { + let router = createMemoryRouter([ + { + path: "/", + Component: Outlet, + children: [ + { + path: "static/foo", + Component: () =>
Static:{useResolvedPath("foo").pathname}
, + }, + { + path: "static/foo/foo", + Component: () => ( +Static:{useResolvedPath("foo/foo").pathname}
+ ), + }, + { + path: "dynamic/:param", + Component: () =>Dynamic:{useResolvedPath("foo").pathname}
, + }, + { + path: "dynamic/:param1/:param2", + Component: () => ( +Dynamic:{useResolvedPath("foo/foo").pathname}
+ ), + }, + { + path: "splat/*", + Component: () => ( +Splat:{useResolvedPath(useParams()["*"]).pathname}
+ ), + }, + ], + }, + ]); + + let renderer: TestRenderer.ReactTestRenderer; + TestRenderer.act(() => { + renderer = TestRenderer.create(+ Static: + /static/foo/foo +
+ `); + + await TestRenderer.act(() => router.navigate("/dynamic/foo")); + expect(renderer.toJSON()).toMatchInlineSnapshot(` ++ Dynamic: + /dynamic/foo/foo +
+ `); + + await TestRenderer.act(() => router.navigate("/splat/foo")); + expect(renderer.toJSON()).toMatchInlineSnapshot(` ++ Splat: + /splat/foo/foo +
+ `); + + await TestRenderer.act(() => router.navigate("/static/foo/foo")); + expect(renderer.toJSON()).toMatchInlineSnapshot(` ++ Static: + /static/foo/foo/foo/foo +
+ `); + + await TestRenderer.act(() => router.navigate("/dynamic/foo/foo")); + expect(renderer.toJSON()).toMatchInlineSnapshot(` ++ Dynamic: + /dynamic/foo/foo/foo/foo +
+ `); + + await TestRenderer.act(() => router.navigate("/splat/foo/foo")); + expect(renderer.toJSON()).toMatchInlineSnapshot(` ++ Splat: + /splat/foo/foo/foo/foo +
+ `); + }); });