Dynamic routing doesn't work when using trailing slashes

[mattcarlotta]

trafficstars

Qwik Version

0.9.0

Operating System (or Browser)

FireFox v105.0

Node Version (if applicable)

Node v16.17.1

Which component is affected?

Qwik City

Expected Behaviour

When pressing the browser back button, QwikCity should update the DOM with the correct page.

Actual Behaviour

The URL changes, but the DOM doesn't update with the correct page.

For example, given that routing is structured like so:

routes
└── projects
    ├── [id]
    |   └── index.tsx
    └── index.tsx

When navigating from /projects/123/ back to /projects/ the page isn't updated.

Additional Information

To mitigate this, I've removed the trailing slash, which now navigates back to the correct page. However, it appears resource data that was fetched from within a /projects/[id] page component and used within the Resource component becomes undefined. As a result, this throws type errors on the /projects page.

Coming from /projects/[id]

And going back to /projects, throws a type error (this happens regardless of a history pop or a Link navigation):

To mitigate this type error, I have to optional chain all project data within this Resource's onResolved prop even though this Resource component should technically be unmounted.

[mcuw]

Hi there, please consider to have conistent URLs with trailing Slash or w/o otherwise you massively reduce your SEO crawling budget.

[mattcarlotta]

Hi there, please consider to have conistent URLs with trailing Slash or w/o otherwise you massively reduce your SEO crawling budget.

Good call out. I've since added them back to my project. Trailing slashes and routing seem to work fine in production, but unfortunately they result in a poor development DX -- have to refresh the browser every time I navigate back and forth to a dynamic route.

[adamdbradley]

Thanks for opening the issue. This should be fixed in the latest release.