TanStack
when `trailingSlash: always` loaders do not run if the trailing-slash is not present
Describe the bug
From @TkDodo
found a small issue with route loaders and trailingSlash: always:
the loaders don't run if I navigate to a route without a trailing slash, like /about. This can happen if the user types in the url manually. What happens is:
- the router appends a slash
/about/ - it renders the right component
- but the loader of that component never runs.
reproduction: https://stackblitz.com/edit/tanstack-router-lhw7fj?file=src%2Fmain.tsx,src%2Froutes%2F__root.tsx,src%2Froutes%2Fabout.tsx&preset=node
if you navigate with the link to About, it will work, but if you open the sandbox preview in a new tab and go to /about, it doesn't work (I hope this link works): https://tanstackrouterlhw7fj-yhec--3001--9e2d28a3.local-credentialless.webcontainer.io/about (mising trailing slash on purpose)
it works fine with trailingSlash: 'preserve'
Your Example Website or App
https://stackblitz.com/edit/tanstack-router-lhw7fj?file=src/main.tsx,src/routes/__root.tsx,src/routes/about.tsx&preset=node
Steps to Reproduce the Bug or Issue
❗ Navigating via Links works correctly, so you need to directly visit the URL.
- To directly to
/aboutwithout the ending/. - Observe loaders not running
Expected behavior
Loaders should run 👍🏼
Screenshots or Videos
No response
Platform
- TSR Version: 1.38.1
Additional context
No response
I added a beforeLoad
https://stackblitz.com/edit/tanstack-router-af56kj?file=src%2Fmain.tsx,src%2Froutes%2F__root.tsx,src%2Froutes%2Fabout.tsx&preset=node
Accessing about/ works as expected:
beforeLoad foo
loader foo
but accessing about without the trailing slash causes the following error in loader:
Cannot read properties of undefined (reading 'foo')
this will be fixed by #1907
reproducer with the pre-release package: https://stackblitz.com/edit/tanstack-router-tlpd87?file=src%2Fmain.tsx,src%2Froutes%2F__root.tsx,src%2Froutes%2Fabout.tsx&preset=node