Set the current fiber to the source of the error during error reporting #29044
Conversation
facebook-github-bot
added
CLA Signed
React Core Team
sebmarkbage
force-pushed
the
currentownerinerror
branch
3 times, most recently
from
22fdb4b
to
9e54e8f
Compare
| [root] | ||
| <ErrorBoundary> ✕ | ||
| <ErrorBoundary> |
There was a problem hiding this comment.
What happens here is that now the console.error happens in the context of the source of the error, not in the error boundary, but that node gets deleted so it's no longer part of the tree.
That's what happens to the console.error already which is why it was only one marked here and not two (one for console.error and one for throw). (It was one before this PR and two before the stack but the other one is representing the console.error in TestRenderer, so it was the wrong one.)
It seems like maybe this UI should be adjusted but we have similar problems with infinitely suspended components whose fiber never commits.
There was a problem hiding this comment.
It seems like maybe this UI should be adjusted but we have similar problems with infinitely suspended components whose fiber never commits.
Ideally you'd still be able to narrow down the console.error. It was likely confusing to attach the error to the error boundary when that's not where it originated. But some indicator that the error originated from somewhere within this tree would be nice.
sebmarkbage
force-pushed
the
currentownerinerror
branch
from
9e54e8f
to
bd02706
Compare
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
sebmarkbage
force-pushed
the
currentownerinerror
branch
from
bd02706
to
1ea6ffc
Compare
This lets us expose the component stack to the error reporting that happens here as console.error patching, but more importantly for "owner stacks" this will be able to set the native async stacks to the original fiber. We now use the normal console.error management to add a component stack to the end. # Conflicts: # packages/shared/consoleWithStackDev.js
Co-authored-by: Sebastian Silbermann <silbermann.sebastian@gmail.com>
sebmarkbage
force-pushed
the
currentownerinerror
branch
from
52fe9e2
to
66fb6fb
Compare
Stacked on #29038.
This lets us expose the component stack to the error reporting that happens here as
console.errorpatching. Now if you just callconsole.errorin the error handlers it'll get the component stack added to the end by React DevTools.However, unfortunately this happens a little too late so the Fiber will be disconnected with its
.returnpointer set to null already. So it'll be too late to extract a parent component stack from but you can at least get the stack from source to error boundary. To work around this I manually add the parent component stack in our default handlers when owner stacks are off. We could potentially fix this but you can also just include it yourself if you're callingconsole.errorand it's not a problem for owner stacks.This is not a problem for owner stacks because we'll still have those and so for those just calling
console.errorjust works. However, the main feature is that by letting React add them, we can switch to using native error stacks when available.