Fix the most specific matching route when using pathless routes

[Madeorsk]

Problem

In #11102, @WiXSL pointed the following (#11102 (comment)):

Pathless layout routes short‑circuit the match loop on the first layout with matching children. This bypasses the later “more specific” logic and can make matching order‑dependent, potentially selecting a layout route even if a more specific sibling should win.

After more investigations, he was right. When a more specific route was defined after a catch-all route nested in a pathless route, the catch-all route was returned before the more specific route was even evaluated. In the following example, the catch-all route /users/* was matched when the pathname was /users/jane_doe/block.

<Route element={<RouterOutlet />}>
    <Route
        path="/users/*"
        element={
            <div data-testid="users-page">
                Users View
            </div>
        }
    />
</Route>
<Route
    path="/users/:username/block"
    element={
        <div data-testid="block-user-page">
            Block a user
        </div>
    }
/>

Solution

Extract the matching route finding algorithm in a function, and call it recursively with the children of the pathless route to always find the most specific route.

How To Test

• Story

Additional Checks

• The PR targets master for a bugfix or a documentation fix, or next for a feature
• The PR includes unit tests (if not possible, describe why)
• The PR includes one or several stories (if not possible, describe why)
• The documentation is up to date

[fzaninotto]

shouldn't these two routes share the same root? i.e. either john_doe or jane_doe? Otherwise I don't see the point of the test.

[Madeorsk]

It doesn't actually matter. What we're testing here is that /users/:username/block route is working as expected (meaning it should show the "Block a user" and not the catch-all "Users View"). The shared root of the two routes is /users and that's enough. But I can use john_doe in the two links if you think it's more logical.