beforeLoad error in createFileRoute gets handled differently depending on previous route
Hello, I had a bit of a hard time making the title clear enough.
Based on where the user is coming from, if an error is thrown within a
You can use this deployment of the
To reproduce the issue described, do the following:
1. Visit the root page of the app. Then, click on "Posts" to visit the
2. Now, from the "Posts" page, simply refresh the browser. You'll see that the
Is there something I'm not understanding regarding error handling and fallback component rendering? I would've expected the basic example to be working properly.
the codebase deployed at the url shared above is the vanilla start-basic-auth found here: https://github.com/tanstack/router/tree/main/examples/react/start-basic-auth
Thanks!
Based on where the user is coming from, if an error is thrown within a
beforeLoad , the component rendered is different.You can use this deployment of the
start-basic-auth example: https://tanstack-basic-auth-production.up.railway.app - note that I wasn't able to deploy it properly in any of the ide-in-the-browser options (the behavior is weirdly delayed by a few seconds) nor on netlify (I wasn't able to find a way to tell the platform to use npm run start for the start step).To reproduce the issue described, do the following:
1. Visit the root page of the app. Then, click on "Posts" to visit the
/posts page. You'll see that this prompts the Login component because the beforeLoad gets triggered properly, and with a user that's not signed in, the errorComponent correctly handles the error message conditions and displays the Login form.2. Now, from the "Posts" page, simply refresh the browser. You'll see that the
beforeLoad also throws, errorComponent also handles the error, but instead of displaying the Login component, even though the condition to return it is true, the posts.route page gets rendered - where a failure to load the posts happens - the loader never runs, hence useLoaderData returns undefined.Is there something I'm not understanding regarding error handling and fallback component rendering? I would've expected the basic example to be working properly.
the codebase deployed at the url shared above is the vanilla start-basic-auth found here: https://github.com/tanstack/router/tree/main/examples/react/start-basic-auth
Thanks!
TanStack Start is a type-safe, client-first, full-stack React framework.
GitHub
Fully typesafe Router for React (and friends) w/ built-in caching, 1st class search-param APIs, client-side cache integration and isomorphic rendering. - TanStack/router