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

Suggestion: don't show error overlay when receiving error that was caught by React error boundary #5397

Open
OliverJAsh opened this issue Jan 11, 2025 · 0 comments

Comments

@OliverJAsh
Copy link
Contributor

Bug report

When using webpack-dev-server in a React project, when a React component throws an error and that error is caught by a React error boundary component, the webpack-dev-server client overlay is still shown, despite the fact the error was caught by the error boundary component.

This makes it difficult to test error handling functionality in development, because the overlay always gets in the way of seeing the error boundary.

This is due a bug in React where caught errors still bubble up to the uncaught error handler. See facebook/react#19613 and facebook/react#10474.

This is a longstanding issue with React and it doesn't seem like it will be addressed anytime soon. For this reason I would like to suggest that we apply the workaround mentioned here so the overlay won't be shown when we detect an error that was caught by an error boundary.

How Do We Reproduce?

Reduced test case https://github.com/OliverJAsh/react-error-boundary-uncaught-issue/tree/webpack-dev-server

Branch: webpack-dev-server

Please paste the results of npx webpack-cli info here, and mention other relevant information

$ yarn run webpack-cli info
yarn run v1.22.19
$ /Users/oliver/Code/react-error-boundary-uncaught-issue/node_modules/.bin/webpack-cli info

  System:
    OS: macOS 15.2
    CPU: (10) arm64 Apple M1 Pro
    Memory: 3.60 GB / 16.00 GB
  Binaries:
    Node: 18.17.1 - /var/folders/5n/mxm8dg1x2y50bqbtf_wxr4k00000gn/T/yarn--1736621266243-0.9405315883601486/node
    Yarn: 1.22.19 - /var/folders/5n/mxm8dg1x2y50bqbtf_wxr4k00000gn/T/yarn--1736621266243-0.9405315883601486/yarn
    npm: 9.6.7 - /nix/store/xpqj3zg5lx25abv9qybiqd7gcs8b81fp-nodejs-18.17.1/bin/npm
  Browsers:
    Brave Browser: 131.1.73.97
    Chrome: 131.0.6778.265
    Safari: 18.2
  Packages:
    copy-webpack-plugin: ^11.0.0 => 11.0.0
    ts-loader: ^9.4.4 => 9.4.4
    webpack: ^5.88.2 => 5.88.2
    webpack-cli: ^5.1.4 => 5.1.4
    webpack-dev-server: ^5.2.0 => 5.2.0

✨  Done in 0.50s.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant