[Feature]: Expose errorInfo from the ErrorBoundary

[marvinroger]

What is the new or updated feature that you are suggesting?

A React ErrorBoundary componentDidCatch exposes two things:

• error, which is the thrown error
• info, "An object with a componentStack key containing information about which component threw the error"

My understanding is that React Router implements an ErrorBoundary and forwards the error to errorElement, which can get the error by using useRouterError. However, only the error is accessible, not the info.

My feature request is the following: being able to access, from within the errorElement, to the info.
I understand that getDerivedStateFromError does not expose info, so it might tricky to access it from the errorElement. In this case, an onError(error, info) callback on RouterProvider might also be a solution?

Why should this feature be included?

Currently, we lose this info and, to my knowledge, there's no way to get it back, as we cannot create our own React ErrorBoundary, given the React Router one takes precedence. Am I wrong?

[ha404]

I'm having issue not able to wrap a specific component with a custom ErrorBoundary :(

[abetoots]

Having the same issue. Would be great to have access to the componentStack

[brophdawg11]

Duplicate proposal closed in favor of this one: #11206

[brophdawg11]

I understand that getDerivedStateFromError does not expose info, so it might tricky to access it from the errorElement. In this case, an onError(error, info) callback on RouterProvider might also be a solution?

Yeah this is where we've landed in our discussions around this, I think we'll be looking into landing some form of API to let you log this information out/send it to Sentry, etc. - but you won't have it in the ErrorBoundary via useRouteError for 2 reasons:

• Logging is the documented purpose of componentDidCatch:
  • "this lets you log that error to an error reporting service in production"
• Setting state is deprecated in componentDidCatch
  • "In the past, it was common to call setState inside componentDidCatch in order to update the UI and display the fallback error message. This is deprecated in favor of defining static getDerivedStateFromError."

Changes are this will basically be a client-side version of the Remix handleError API for logging out error son the server.