router icon indicating copy to clipboard operation
router copied to clipboard

Uncaught Error

Open andelkocvjetkovic opened this issue 10 months ago • 4 comments

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

  1. Click on Post 1.
  2. 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

Screenshot 2024-04-24 at 11 25 34

Platform

  • OS: macOS
  • Browser: Chrome
  • Version: 123.0.6312.124

Additional context

No response

andelkocvjetkovic avatar Apr 24 '24 09:04 andelkocvjetkovic

check this issue, maybe it's the same...

https://github.com/TanStack/router/issues/1480

hugocostadev avatar Apr 25 '24 11:04 hugocostadev

I'm on "@tanstack/react-router": "1.28.1", so I don't think it is related

andelkocvjetkovic avatar Apr 25 '24 13:04 andelkocvjetkovic

The issue is present in "@tanstack/react-router": "1.31.1" as well

andelkocvjetkovic avatar Apr 26 '24 07:04 andelkocvjetkovic

A couple of questions:

  1. Just to be clear, the issue here is that we are logging the error to the console?
  2. 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.

SeanCassiere avatar May 02 '24 00:05 SeanCassiere

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 avatar May 08 '24 08:05 andelkocvjetkovic

@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.

SeanCassiere avatar May 08 '24 21:05 SeanCassiere

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?

lo1tuma avatar Aug 27 '24 16:08 lo1tuma

Yes, it is confusing. If a error is handled does it make sense to print it as uncaught ?

andelkocvjetkovic avatar Aug 28 '24 07:08 andelkocvjetkovic