react-router icon indicating copy to clipboard operation
react-router copied to clipboard

Relative path navigation creates malformed URI segment when any segment contains %25

Open singpolyma opened this issue 1 month ago • 0 comments

Reproduction

Go to https://codesandbox.io/p/devbox/dreamy-bessie-g7rvvd?workspaceId=ws_GELsm6sqyvHi1sc81WvkSa and click the "click to go to account" link. observe that accountId is correct. then click the "now click to go to details" link. observe the accountId is wrong

System Info

System:
    OS: Linux 6.12 Debian GNU/Linux 13 (trixie) 13 (trixie)
    CPU: (24) x64 AMD Ryzen 9 5900X 12-Core Processor
    Memory: 9.14 GB / 15.52 GB
    Container: Yes
    Shell: 0.19.4 - /usr/bin/xonsh
  Binaries:
    Node: 20.19.2 - /usr/bin/node
    npm: 9.2.0 - /usr/bin/npm
    bun: 1.2.22 - /usr/local/bin/bun
  Browsers:
    Chromium: 141.0.7390.54
    Firefox: 140.3.1esr
    Firefox Developer Edition: 140.3.1esr
  npmPackages:
    react-router: ^7.9.3 => 7.9.5 
    vite: ^7.1.9 => 7.1.12

Used Package Manager

npm

Expected Behavior

When I navigate using a relative link such as ./details and the current path segment contains %25 I expect the new URI to also contain %25 and be decoded properly into % in the params value.

Actual Behavior

The renderedMatches only re-encode ? and # https://github.com/remix-run/react-router/blob/e7879a82a4f6c99ff1f38160bb28c5c8f759f377/packages/react-router/lib/hooks.tsx#L901C1-L901C27 and so the % does not get encoded, but left raw in the URI. This results in a failure to decode the path https://github.com/remix-run/react-router/blob/e7879a82a4f6c99ff1f38160bb28c5c8f759f377/packages/react-router/lib/router/utils.ts#L1523 and so the value is used raw, leaving it partially encoded in params (And also breaking browser refresh on the URI)

singpolyma avatar Nov 05 '25 21:11 singpolyma