Weird redirection when using Router and Route

[tdt-dung]

Describe the bug

Please see the code below:

import { lazy, onMount } from "solid-js";
import { Router, Route } from "@solidjs/router";

const
    NotFoundPage = lazy( () =( import( "./app/not-found.tsx" ) ) ),
    UnauthenticatedLayout = lazy( () =( import( "./app/(unauthenticated)/layout.tsx" ) ) ),
    SignInPage = lazy( () =( import( "./app/(unauthenticated)/sign-in/page.tsx" ) ) ),
    AuthenticatedLayout = lazy( () =( import( "./app/(authenticated)/layout.tsx" ) ) ),
    DashboardPage = lazy( () =( import( "./app/(authenticated)/dash/page.tsx" ) ) );

const App = () ={

    return (

        <Router>

            <Route component={ UnauthenticatedLayout }>
                <Route path="/" component={ SignInPage } />
            </Route>

            <Route component={ AuthenticatedLayout }>
                <Route path="/dash" component={ DashboardPage } />
            </Route>

            <Route path="*404" component={ NotFoundPage } />

        </Router>

    );

}

export default App;

In this app, the following routes are included:

• http://localhost:5173 - Sign in page
• http://localhost:5173/dash - Dashboard page

If I access http://localhost:5173, or http://localhost:5173/dash; well, everything works normally. But, if I go to http://localhost:5173//dash, it always shows the Sign in page (without redirecting to http://localhost:5173), instead of the Not Found page.

Is this because I have configured the Router and Route components incorrectly, or is this a bug? Please let me know!

Thank you in advance.

Your Example Website or App

.

Steps to Reproduce the Bug or Issue

1. Access the browser with the link http://localhost:5173//dash
2. See error

Expected behavior

Temporarily, what is the way to solve this problem?

Screenshots or Videos

No response

Platform

• OS: Windows 10
• Browser: Firefox
• Version: 127.0.1 (64-bit)

Additional context

No response

[ryansolid]

There is probably some sort of matching error in handling the extra slash. It should be getting removed/normalized but maybe at a certain point it isn't. I might have even guessed 404 page here alternatively as well. It does feel unexpected for it to resolve this way. I'm gathering it treats it like a nested route that isn't matched.

I don't really have a temporary workaround, but I'd suggest not having double slashes in your URL if possible.

[tdt-dung]

Thanks for the feedback!

For us programmers, we all know that there should not be double slashes in URLs. But what I want to know is that in case SolidJS application is deployed to hosting services, and some user discovers that the URL may contain double slashes, it always displays the Sign in page, instead of the 404 page. I think that will make them confused, so I just want to see if there is a temporary way to solve this problem.

[ryansolid]

Yeah I know I was just saying this is a bug so there is no workaround for it. I will try to get this fixed up shortly.

[ryansolid]

I see why this happens. We only process the path and we use URL constructor to create the location. Unfortunately paths are allowed to start //something so they are being treated like they are the origin. But our local path should have no concept of that. I should be able to fix this up.

Only comment is that I think deeper in the path it may 404, but our problem here is way the browser APIs work constructing URLs my choices are remove the additional slashes and have it match against /dash in this case, or make up something bogus (or error) in this case and I don't see that as preferable. This is such an edge case anyway as long as it doesn't take you to an unexpected page I think this is the way to go.

[tdt-dung]

Thank you very much for your explanation! I got it.