Bug: ErrorBoundary won't caught error in useEffect callback while ErrorBoundary unmount with it's children

This issue has been created since 2022-09-06.

React version: 18.2.0

Steps To Reproduce

function App() {
  const [isShow, setIsShow] = React.useState(true);
  function setError() {
    setIsShow(false);
  }
  return (
    <div>
      {isShow && <PageWrapper />}
      <div onClick={setError}>setError</div>
    </div>
  );
}

class PageWrapper extends React.Component {
  static getDerivedStateFromError() {}
  componentDidCatch(err) {
    console.log("catch err: ", err);
  }
  render() {
    return <Page />;
  }
}

function Page() {
  React.useEffect(() => {
    return () => {
      throw new Error("sorry!");
    };
  });
  return <div>I m page</div>;
}

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App />)
  1. click setError.Unmount <PageWrapper> along with <Page>, then <Page> threw an error in useEffect callback.

The current behavior

ErrorBoundary <PageWrapper> won't caught error thrown by <Page> useEffect callback.So all the React Tree is dropped.

But in React 17, <PageWrapper> caught the error.And the React Tree remain exists.

The expected behavior

Catch the error like React 17.

So, is that React18 new behavior? Or is a bug?

sadiki-o wrote this answer on 2022-09-06

can you please tell me why are you mixing class components with function components?

Chen-jj wrote this answer on 2022-09-06

sadiki-o

Because ErrorBoundary only work with class components.

sadiki-o wrote this answer on 2022-09-06

oh my apology since i worked mostly with function components i never get to use such feature

creamidea wrote this answer on 2022-09-13

This may be related to the change in the commitRoot phase traversal. v17 traverses the effect list. v18 traverses the entire tree.
When dealing with PassiveUnmountEffects, the connection to child is removed. v18 does not have a way to call PageWrapper's Page's destroy, while v17 can handle the destroy function through the effect list.

creamidea wrote this answer on 2022-09-14

Maybe I find the problem, here is set skipUnmountedBoundaries to be true.

if (skipUnmountedBoundaries) {

So, the compiler's output

image

image

Why?

// This rolled out to 10% public in www, so we should be able to land, but some

// This rolled out to 10% public in www, so we should be able to land, but some
// internal tests need to be updated. The open source behavior is correct.
export const skipUnmountedBoundaries = true;
More Details About Repo
Owner Name facebook
Repo Name react
Full Name facebook/react
Language JavaScript
Created Date 2013-05-24
Updated Date 2022-09-26
Star Count 195293
Watcher Count 6655
Fork Count 40426
Issue Count 1113

YOU MAY BE INTERESTED

Issue Title Created Date Comment Count Updated Date
Bug with path calculation 1 2022-04-18 2022-09-01
mac上从剪贴板上传一直提示“failed: no image in clipboard or unsupported format” 5 2022-02-21 2022-07-20
Clarify that track id should be added to dictionary in test_loader 0 2021-03-21 2022-09-05
Greenhill shows graphics issue 0 2022-05-20 2022-09-09
What to do if this program can't find the icon file? 3 2021-09-12 2022-08-17
🐛 BUG: named imports of *some* reactstrap components don't work 4 2021-12-10 2022-07-16
Move away from JCenter 1 2021-02-08 2022-09-12
DependencyHandler.axd may return wrong Content-Type (Resource Manager broken in 9.11.0 RC2) 4 2022-09-02 2022-09-20
app buy in Russia and now can't download 1 2022-06-30 2022-09-18
ValueError: iswt2 only supports 2D arrays. see iswtn for a general n-dimensionsal ISWT 5 2019-12-23 2022-09-09
compiler crash when using --use 0 2022-03-16 2022-07-27
Bring back color palettes to design page 0 2021-05-11 2022-09-04
0 and O look too alike 5 2019-01-17 2022-08-19
Scheduler blocks cdn 0 2022-02-16 2022-08-01
How to use in a backend Node JS environment? 0 2022-02-19 2022-08-13
NGINX Kerberos seems broken 15 2021-11-24 2022-08-21
Support for Ruby 3 and Rails 7 1 2022-01-05 2022-01-05
Idle detection internal display 0% 2 2022-08-02 2022-09-16
Add playable option 2 2021-04-24 2021-12-10
passive touchstart 1 2021-04-16 2022-01-12
Feature Request: Disk IO per disk 1 2022-03-06 2022-08-28
GET /api/v3/flows/executor/enrollment-flow/ 0 2021-11-22 2022-09-21
backup_database system task fails with password from docker secret file 4 2021-11-22 2022-01-28
Segfault when loading saved game [Linux] 3 2019-09-23 2022-09-16
loading the banner as modal with actions block, only allow button is there, no deny 1 2022-07-06 2022-09-18
Bisection with ForwardDiff 9 2022-05-11 2022-09-07
Dynamic cron 2 2021-01-18 2021-12-29
DistGitReleaser doesn't work with builder.test = 1 1 2021-03-30 2022-08-23
`interaction.isRepliable()` doesn't narrow the interaction type correctly in TS 0 2022-08-28 2022-09-21
What is the policy on journals that are tied to conferences and appear in DBLP? 1 2021-11-19 2022-08-06
Colombia Vaccination stats 0 2021-12-23 2022-09-21
Revisit test distribution creation 0 2021-11-17 2022-09-24
11 - Tuple to Object 0 2022-02-16 2022-07-14
Web UI v2: Support bundling the web project into the app 1 2022-04-23 2022-09-11
Web UI v2: Server-side render index.html 0 2022-04-23 2022-09-21
Verify that pipelines containing "missing" custom components are handled properly 0 2021-09-30 2022-09-14
delete auto downloaded SD library in users <sb>/libraries directory, does not then use board specific one 0 2022-06-10 2022-06-11
std.mem.Allocator: reallocAtLeast should allow upper limit 4 2022-01-20 2022-07-24
the `dangling pointer` is allowed. 1 2022-02-20 2022-08-09
Allow custom connect point in XML format 1 2021-07-23 2022-09-19
permanent errors when sending encrypted datasets 1 2022-08-22 2022-09-15
Crash Report: Minecraft Forge 39.0.64 gives Error Code 0 on AMD based processor. 1 2022-02-04 2022-09-16
Conversion from `u32` to `f32` via `cast()` can be inexact 5 2021-03-18 2022-07-14
How was this file created? 0 2021-04-20 2022-08-14
Local rack host offline and could not find any remote hosts for fallback connection at 2 2021-03-12 2022-09-18
[CoE Starter Kit - BUG] Frequency of Orphaned Objects flows is too high 2 2022-05-20 2022-09-24
pdf theme's yml file not support [extends] attribute 12 2019-08-02 2022-09-25
[BUG] 验证器的验证规则包含“|”时出问题 2 2021-10-11 2022-09-02
Read MAPBOX_API_KEY from environment 4 2021-09-22 2022-09-02
crash in JIT/Methodical/Coverage/copy_prop_byref_to_native_int on Mono 3 2022-08-17 2022-09-16