Skip to content

Commit f320378

Browse files
committed
Add additional test case for #10983
1 parent a48c43c commit f320378

File tree

1 file changed

+104
-1
lines changed

1 file changed

+104
-1
lines changed

packages/react-router/__tests__/useResolvedPath-test.tsx

Lines changed: 104 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,16 @@
11
import * as React from "react";
22
import * as TestRenderer from "react-test-renderer";
33
import type { Path } from "react-router";
4-
import { MemoryRouter, Routes, Route, useResolvedPath } from "react-router";
4+
import {
5+
MemoryRouter,
6+
Routes,
7+
Route,
8+
RouterProvider,
9+
createMemoryRouter,
10+
useResolvedPath,
11+
Outlet,
12+
useParams,
13+
} from "react-router";
514

615
function ShowResolvedPath({ path }: { path: string | Path }) {
716
return <pre>{JSON.stringify(useResolvedPath(path))}</pre>;
@@ -313,4 +322,98 @@ describe("useResolvedPath", () => {
313322
`);
314323
});
315324
});
325+
326+
// Follow up test to https://github.com/remix-run/react-router/pull/10983 to
327+
// ensure we do this consistently across route types
328+
it("resolves relative paths consistently across route types", async () => {
329+
let router = createMemoryRouter([
330+
{
331+
path: "/",
332+
Component: Outlet,
333+
children: [
334+
{
335+
path: "static/foo",
336+
Component: () => <p>Static:{useResolvedPath("foo").pathname}</p>,
337+
},
338+
{
339+
path: "static/foo/foo",
340+
Component: () => (
341+
<p>Static:{useResolvedPath("foo/foo").pathname}</p>
342+
),
343+
},
344+
{
345+
path: "dynamic/:param",
346+
Component: () => <p>Dynamic:{useResolvedPath("foo").pathname}</p>,
347+
},
348+
{
349+
path: "dynamic/:param1/:param2",
350+
Component: () => (
351+
<p>Dynamic:{useResolvedPath("foo/foo").pathname}</p>
352+
),
353+
},
354+
{
355+
path: "splat/*",
356+
Component: () => (
357+
<p>Splat:{useResolvedPath(useParams()["*"]).pathname}</p>
358+
),
359+
},
360+
],
361+
},
362+
]);
363+
364+
let renderer: TestRenderer.ReactTestRenderer;
365+
TestRenderer.act(() => {
366+
renderer = TestRenderer.create(<RouterProvider router={router} />);
367+
});
368+
// @ts-expect-error
369+
if (!renderer) throw new Error("renderer not defined");
370+
371+
await TestRenderer.act(() => router.navigate("/static/foo"));
372+
expect(renderer.toJSON()).toMatchInlineSnapshot(`
373+
<p>
374+
Static:
375+
/static/foo/foo
376+
</p>
377+
`);
378+
379+
await TestRenderer.act(() => router.navigate("/dynamic/foo"));
380+
expect(renderer.toJSON()).toMatchInlineSnapshot(`
381+
<p>
382+
Dynamic:
383+
/dynamic/foo/foo
384+
</p>
385+
`);
386+
387+
await TestRenderer.act(() => router.navigate("/splat/foo"));
388+
expect(renderer.toJSON()).toMatchInlineSnapshot(`
389+
<p>
390+
Splat:
391+
/splat/foo/foo
392+
</p>
393+
`);
394+
395+
await TestRenderer.act(() => router.navigate("/static/foo/foo"));
396+
expect(renderer.toJSON()).toMatchInlineSnapshot(`
397+
<p>
398+
Static:
399+
/static/foo/foo/foo/foo
400+
</p>
401+
`);
402+
403+
await TestRenderer.act(() => router.navigate("/dynamic/foo/foo"));
404+
expect(renderer.toJSON()).toMatchInlineSnapshot(`
405+
<p>
406+
Dynamic:
407+
/dynamic/foo/foo/foo/foo
408+
</p>
409+
`);
410+
411+
await TestRenderer.act(() => router.navigate("/splat/foo/foo"));
412+
expect(renderer.toJSON()).toMatchInlineSnapshot(`
413+
<p>
414+
Splat:
415+
/splat/foo/foo/foo/foo
416+
</p>
417+
`);
418+
});
316419
});

0 commit comments

Comments
 (0)