Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Don't let error boundaries catch errors during hydration #28675

Merged
merged 2 commits into from
Mar 29, 2024

Conversation

sebmarkbage
Copy link
Collaborator

When an error boundary catches an error during hydration it'll try to render the error state which will then try to hydrate that state, causing hydration warnings.

When an error happens inside a Suspense boundary during hydration, we instead let the boundary catch it and restart a client render from there. However, when it's in the root we instead let it fail the root and do the sync recovery pass. This didn't consider that we might hit an error boundary first so this just skips the error boundary in that case.

We should probably instead let the root do a concurrent client render in this same pass instead to unify with Suspense boundaries.

- Server and client throws
- Only client throws
- Only hydration pass of client throws but recovers
@sebmarkbage sebmarkbage requested a review from acdlite March 29, 2024 18:55
@facebook-github-bot facebook-github-bot added CLA Signed React Core Team Opened by a member of the React Core Team labels Mar 29, 2024
@react-sizebot
Copy link

Comparing: cc56bed...0853376

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name +/- Base Current +/- gzip Base gzip Current gzip
oss-stable/react-dom/cjs/react-dom.production.min.js +0.01% 176.42 kB 176.44 kB +0.01% 54.85 kB 54.85 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js +0.01% 172.85 kB 172.87 kB +0.01% 53.89 kB 53.90 kB
facebook-www/ReactDOM-prod.classic.js +0.02% 592.03 kB 592.14 kB +0.03% 103.86 kB 103.89 kB
facebook-www/ReactDOM-prod.modern.js +0.02% 574.21 kB 574.31 kB +0.02% 100.92 kB 100.94 kB
test_utils/ReactAllWarnings.js Deleted 64.70 kB 0.00 kB Deleted 16.16 kB 0.00 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show
Name +/- Base Current +/- gzip Base gzip Current gzip
test_utils/ReactAllWarnings.js Deleted 64.70 kB 0.00 kB Deleted 16.16 kB 0.00 kB

Generated by 🚫 dangerJS against 0853376

@sebmarkbage sebmarkbage merged commit 5d4b758 into facebook:main Mar 29, 2024
38 checks passed
github-actions bot pushed a commit that referenced this pull request Mar 29, 2024
When an error boundary catches an error during hydration it'll try to
render the error state which will then try to hydrate that state,
causing hydration warnings.

When an error happens inside a Suspense boundary during hydration, we
instead let the boundary catch it and restart a client render from
there. However, when it's in the root we instead let it fail the root
and do the sync recovery pass. This didn't consider that we might hit an
error boundary first so this just skips the error boundary in that case.

We should probably instead let the root do a concurrent client render in
this same pass instead to unify with Suspense boundaries.

DiffTrain build for [5d4b758](5d4b758)
EdisonVan pushed a commit to EdisonVan/react that referenced this pull request Apr 15, 2024
)

When an error boundary catches an error during hydration it'll try to
render the error state which will then try to hydrate that state,
causing hydration warnings.

When an error happens inside a Suspense boundary during hydration, we
instead let the boundary catch it and restart a client render from
there. However, when it's in the root we instead let it fail the root
and do the sync recovery pass. This didn't consider that we might hit an
error boundary first so this just skips the error boundary in that case.

We should probably instead let the root do a concurrent client render in
this same pass instead to unify with Suspense boundaries.
bigfootjon pushed a commit that referenced this pull request Apr 18, 2024
When an error boundary catches an error during hydration it'll try to
render the error state which will then try to hydrate that state,
causing hydration warnings.

When an error happens inside a Suspense boundary during hydration, we
instead let the boundary catch it and restart a client render from
there. However, when it's in the root we instead let it fail the root
and do the sync recovery pass. This didn't consider that we might hit an
error boundary first so this just skips the error boundary in that case.

We should probably instead let the root do a concurrent client render in
this same pass instead to unify with Suspense boundaries.

DiffTrain build for commit 5d4b758.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed React Core Team Opened by a member of the React Core Team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants