Skip to content

[Bug]: encoded # in path parameter causes route to be evaluated differently #11929

@jhroemer

Description

@jhroemer

What version of React Router are you using?

6.26.1

Steps to Reproduce

Included is a basic react app with react router 6.26.1 installed. It uses the <BrowserRouter> and includes two nearly identical links and two <Routes> components with nested routes. One of the routes has a path parameter with an encoded # sign in it, and the other doesn't.

  • Click the first link, this will match the "* sub route" element.
  • Click the second link, this will match the "/posts sub route" element.

Sandbox link: https://codesandbox.io/p/sandbox/react-router-enoded-hash-issue-26klwl?file=%2Fsrc%2FApp.tsx%3A17%2C17

Expected Behavior

The routes should match the same route within the BuggySubRoutes component.

Actual Behavior

The link that has an encoded # in it matches the route with path="*" in the BuggySubRoutes component, and the other link without the encoded # matches the route with path="posts".

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions