router
router copied to clipboard
Uncaught Error
Describe the bug
When an error is thrown within the loader, "Uncaught Error" appears in my browser console, even though the error page is shown.
Your Example Website or App
https://stackblitz.com/edit/tanstack-router-zz3epc?file=src%2Fposts.tsx
Steps to Reproduce the Bug or Issue
- Click on Post 1.
- Open browser console and observe "Uncaught Error"
chunk-WM253HRZ.js?v=5f883516:1114 Uncaught Error at posts.tsx:15:20
Expected behavior
I expect to the error within loader to be caught and clean console in my browser
Screenshots or Videos
Platform
- OS: macOS
- Browser: Chrome
- Version: 123.0.6312.124
Additional context
No response
check this issue, maybe it's the same...
https://github.com/TanStack/router/issues/1480
I'm on "@tanstack/react-router": "1.28.1"
, so I don't think it is related
The issue is present in "@tanstack/react-router": "1.31.1"
as well
A couple of questions:
- Just to be clear, the issue here is that we are logging the error to the console?
- Why is logging the error to the console bad?
It's important to remember that this is client-sided, so there's no chance of SECRETS being revealed. Also, you'll only ever get here when there has been an error and the errorComponent
has been triggered, and by default,errors
are always printed to the console.
We'd need a valid reason to change this behaviour since some users have hooks that use the output of the console and that this isn't a show-stopping problem or a bug. Its currently, the intended behaviour.
My question is why I'm getting an 'Uncaught Error' in my console. Is this something I should take care of, and how precisely should I handle this?
Thanks.
@andelkocvjetkovic this isn't something that requires intervention from you. No further error handling is required on your-part.
Very simply, the Error is printed out to the console since the application has encountered an error (intentional or not). You can choose to customize how you display the Error to the user using the errorComponent
, but nevertheless an Error has occurred. As such, the error is printed to the console.
I’ve just experienced the same issue and was quite confused that the error is printed as an uncaught error in the browser console because I’m explictly handling it as part of the errorComponent
. Within the errorComponent
I’m utilizing a custom error reporter (like sentry) to collect this error with additional context information. Usually uncaught errors are automatically collected as well. That mean I have the error reported twice, once explicitly via the errorComponent
and once implicilty via the uncaught error that seemingly cannot be caught properly.
Is there any chance this behavior can be re-evaluated and maybe provide a way allow users of @tanstack/router to control how errors are handled?
Yes, it is confusing. If a error is handled does it make sense to print it as uncaught ?