Skip to content

Commit

Permalink
Revert "Fix issues with useFormAction/useResolvedPath for dot paths i…
Browse files Browse the repository at this point in the history 
…n param/splat routes (#10983)"

This reverts commit fe066bd.
  • Loading branch information
@brophdawg11
brophdawg11 committed Dec 1, 2023
1 parent c6c3ff2 commit f3e2ac5
Show file tree
Hide file tree
Showing 5 changed files with 10 additions and 275 deletions.
62 changes: 3 additions & 59 deletions packages/react-router-dom/__tests__/data-browser-router-test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2942,44 +2942,6 @@ function testDomRouter(
"/foo/bar"
);
});

it("includes param portion of path when no action is specified (inline splat)", async () => {
let router = createTestRouter(
createRoutesFromElements(
<Route path="/">
<Route path="foo">
<Route path=":param" element={<NoActionComponent />} />
</Route>
</Route>
),
{
window: getWindow("/foo/bar"),
}
);
let { container } = render(<RouterProvider router={router} />);

expect(container.querySelector("form")?.getAttribute("action")).toBe(
"/foo/bar"
);
});

it("includes splat portion of path when no action is specified (nested splat)", async () => {
let router = createTestRouter(
createRoutesFromElements(
<Route path="/">
<Route path="foo/:param" element={<NoActionComponent />} />
</Route>
),
{
window: getWindow("/foo/bar"),
}
);
let { container } = render(<RouterProvider router={router} />);

expect(container.querySelector("form")?.getAttribute("action")).toBe(
"/foo/bar"
);
});
});

describe("splat routes", () => {
Expand All @@ -2999,7 +2961,7 @@ function testDomRouter(
let { container } = render(<RouterProvider router={router} />);

expect(container.querySelector("form")?.getAttribute("action")).toBe(
"/foo/bar?a=1"
"/foo?a=1"
);
});

Expand All @@ -3019,7 +2981,7 @@ function testDomRouter(
let { container } = render(<RouterProvider router={router} />);

expect(container.querySelector("form")?.getAttribute("action")).toBe(
"/foo/bar"
"/foo"
);
});

Expand All @@ -3039,25 +3001,7 @@ function testDomRouter(
let { container } = render(<RouterProvider router={router} />);

expect(container.querySelector("form")?.getAttribute("action")).toBe(
"/foo/bar"
);
});

it("includes splat portion of path when no action is specified (inline splat)", async () => {
let router = createTestRouter(
createRoutesFromElements(
<Route path="/">
<Route path="foo/*" element={<NoActionComponent />} />
</Route>
),
{
window: getWindow("/foo/bar/baz"),
}
);
let { container } = render(<RouterProvider router={router} />);

expect(container.querySelector("form")?.getAttribute("action")).toBe(
"/foo/bar/baz"
"/foo"
);
});
});
Expand Down
2 changes: 1 addition & 1 deletion packages/react-router-dom/__tests__/link-href-test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -530,7 +530,7 @@ describe("<Link> href", () => {
});

expect(renderer.root.findByType("a").props.href).toEqual(
"/inbox/messages/abc"
"/inbox/messages"
);
});

Expand Down
6 changes: 4 additions & 2 deletions packages/react-router-dom/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1543,8 +1543,10 @@ export function useFormAction(
// object referenced by useMemo inside useResolvedPath
let path = { ...useResolvedPath(action ? action : ".", { relative }) };

// If no action was specified, browsers will persist current search params
// when determining the path, so match that behavior
// Previously we set the default action to ".". The problem with this is that
// `useResolvedPath(".")` excludes search params of the resolved URL. This is
// the intended behavior of when "." is specifically provided as
// the form action, but inconsistent w/ browsers when the action is omitted.
// https://github.com/remix-run/remix/issues/927
let location = useLocation();
if (action == null) {
Expand Down
209 changes: 1 addition & 208 deletions packages/react-router/__tests__/useResolvedPath-test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,7 @@ describe("useResolvedPath", () => {
});

describe("in a splat route", () => {
it("resolves . to the route path (nested splat)", () => {
it("resolves . to the route path", () => {
let renderer: TestRenderer.ReactTestRenderer;
TestRenderer.act(() => {
renderer = TestRenderer.create(
Expand All @@ -99,213 +99,6 @@ describe("useResolvedPath", () => {
);
});

expect(renderer.toJSON()).toMatchInlineSnapshot(`
<pre>
{"pathname":"/users/mj","search":"","hash":""}
</pre>
`);
});

it("resolves .. to the parent route path (nested splat)", () => {
let renderer: TestRenderer.ReactTestRenderer;
TestRenderer.act(() => {
renderer = TestRenderer.create(
<MemoryRouter initialEntries={["/users/mj"]}>
<Routes>
<Route path="/users">
<Route path="*" element={<ShowResolvedPath path=".." />} />
</Route>
</Routes>
</MemoryRouter>
);
});

expect(renderer.toJSON()).toMatchInlineSnapshot(`
<pre>
{"pathname":"/users","search":"","hash":""}
</pre>
`);
});

it("resolves . to the route path (inline splat)", () => {
let renderer: TestRenderer.ReactTestRenderer;
TestRenderer.act(() => {
renderer = TestRenderer.create(
<MemoryRouter initialEntries={["/users/name/mj"]}>
<Routes>
<Route path="/users">
<Route path="name/*" element={<ShowResolvedPath path="." />} />
</Route>
</Routes>
</MemoryRouter>
);
});

expect(renderer.toJSON()).toMatchInlineSnapshot(`
<pre>
{"pathname":"/users/name/mj","search":"","hash":""}
</pre>
`);
});

it("resolves .. to the parent route path (inline splat)", () => {
let renderer: TestRenderer.ReactTestRenderer;
TestRenderer.act(() => {
renderer = TestRenderer.create(
<MemoryRouter initialEntries={["/users/name/mj"]}>
<Routes>
<Route path="/users">
<Route path="name/*" element={<ShowResolvedPath path=".." />} />
</Route>
</Routes>
</MemoryRouter>
);
});

expect(renderer.toJSON()).toMatchInlineSnapshot(`
<pre>
{"pathname":"/users","search":"","hash":""}
</pre>
`);
});

it("resolves . to the route path (descendant route)", () => {
let renderer: TestRenderer.ReactTestRenderer;
TestRenderer.act(() => {
renderer = TestRenderer.create(
<MemoryRouter initialEntries={["/users/mj"]}>
<Routes>
<Route
path="/users/*"
element={
<Routes>
<Route path="mj" element={<ShowResolvedPath path="." />} />
</Routes>
}
/>
</Routes>
</MemoryRouter>
);
});

expect(renderer.toJSON()).toMatchInlineSnapshot(`
<pre>
{"pathname":"/users/mj","search":"","hash":""}
</pre>
`);
});

it("resolves .. to the parent route path (descendant route)", () => {
let renderer: TestRenderer.ReactTestRenderer;
TestRenderer.act(() => {
renderer = TestRenderer.create(
<MemoryRouter initialEntries={["/users/mj"]}>
<Routes>
<Route
path="/users/*"
element={
<Routes>
<Route path="mj" element={<ShowResolvedPath path=".." />} />
</Routes>
}
/>
</Routes>
</MemoryRouter>
);
});

expect(renderer.toJSON()).toMatchInlineSnapshot(`
<pre>
{"pathname":"/users","search":"","hash":""}
</pre>
`);
});
});

describe("in a param route", () => {
it("resolves . to the route path (nested param)", () => {
let renderer: TestRenderer.ReactTestRenderer;
TestRenderer.act(() => {
renderer = TestRenderer.create(
<MemoryRouter initialEntries={["/users/mj"]}>
<Routes>
<Route path="/users">
<Route path=":name" element={<ShowResolvedPath path="." />} />
</Route>
</Routes>
</MemoryRouter>
);
});

expect(renderer.toJSON()).toMatchInlineSnapshot(`
<pre>
{"pathname":"/users/mj","search":"","hash":""}
</pre>
`);
});

it("resolves .. to the parent route (nested param)", () => {
let renderer: TestRenderer.ReactTestRenderer;
TestRenderer.act(() => {
renderer = TestRenderer.create(
<MemoryRouter initialEntries={["/users/mj"]}>
<Routes>
<Route path="/users">
<Route path=":name" element={<ShowResolvedPath path=".." />} />
</Route>
</Routes>
</MemoryRouter>
);
});

expect(renderer.toJSON()).toMatchInlineSnapshot(`
<pre>
{"pathname":"/users","search":"","hash":""}
</pre>
`);
});

it("resolves . to the route path (inline param)", () => {
let renderer: TestRenderer.ReactTestRenderer;
TestRenderer.act(() => {
renderer = TestRenderer.create(
<MemoryRouter initialEntries={["/users/name/mj"]}>
<Routes>
<Route path="/users">
<Route
path="name/:name"
element={<ShowResolvedPath path="." />}
/>
</Route>
</Routes>
</MemoryRouter>
);
});

expect(renderer.toJSON()).toMatchInlineSnapshot(`
<pre>
{"pathname":"/users/name/mj","search":"","hash":""}
</pre>
`);
});

it("resolves .. to the parent route (inline param)", () => {
let renderer: TestRenderer.ReactTestRenderer;
TestRenderer.act(() => {
renderer = TestRenderer.create(
<MemoryRouter initialEntries={["/users/name/mj"]}>
<Routes>
<Route path="/users">
<Route
path="name/:name"
element={<ShowResolvedPath path=".." />}
/>
</Route>
</Routes>
</MemoryRouter>
);
});

expect(renderer.toJSON()).toMatchInlineSnapshot(`
<pre>
{"pathname":"/users","search":"","hash":""}
Expand Down
6 changes: 1 addition & 5 deletions packages/react-router/lib/hooks.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -312,12 +312,8 @@ export function useResolvedPath(
let { matches } = React.useContext(RouteContext);
let { pathname: locationPathname } = useLocation();

// Use the full pathname for the leaf match so we include splat values
// for "." links
let routePathnamesJson = JSON.stringify(
getPathContributingMatches(matches).map((match, idx) =>
idx === matches.length - 1 ? match.pathname : match.pathnameBase
)
getPathContributingMatches(matches).map((match) => match.pathnameBase)
);

return React.useMemo(
Expand Down

0 comments on commit f3e2ac5

Please sign in to comment.