/ag-grid-react-suspense-crash

Example repo to crash Ag-Grid with React 18 suspense

Primary LanguageJavaScript

Crash Ag-Grid in React 18 with Suspense and concurrent mode

This is a minimal reproduction of a bug in Ag-Grid with React 18 and concurrent mode.

To reproduce:

  1. npm install
  2. npm start
  3. Click Crash Ag-Grid
  4. Observe the following error:
AG Grid: unable to find bean reference frameworkOverrides while initialising BeanStub

Hypothesis

This is likely caused by React concurrent mode. React concurrent mode doesn't guarantee that componentWillUnmount is called for every componentWillMount. See React RFC 213:

So code that relies on UNSAFE_componentWillMount and componentWillUnmount being called the same number of times might cause mistakes or memory leaks.

This can cause two types of bugs:

  1. A memory leak, where Ag-Grid mounts but never unmounts.

    This occurs because concurrent mode doesn't guarantee that componentWillUnmount is called when discarding the tree.

  2. A crash, where Ag-Grid mounts but the React concurrent mode discards the tree without calling componentWillUnmount. Ag-Grid maintains a reference to the grid (which appears to be caused by gridCoreCreator.create), but React has discarded the tree, destroying the grid, and causing a crash.

image