Disable setState before mount in legacy mode (#18851)

We kind of "support" this pattern in legacy mode. It's only deprecated in Concurrent Mode.
facebook · May 7, 2020 · 55f5cde · 55f5cde
1 parent 47ebc90
commit 55f5cde
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 0 deletions.
diff --git a/packages/react-dom/src/__tests__/ReactCompositeComponentState-test.js b/packages/react-dom/src/__tests__/ReactCompositeComponentState-test.js
@@ -510,4 +510,33 @@ describe('ReactCompositeComponent-state', () => {
       expect(el.textContent).toBe('count:4');
     });
   }
+
+  it('should support setState in componentWillUnmount', () => {
+    let subscription;
+    class A extends React.Component {
+      componentWillUnmount() {
+        subscription();
+      }
+      render() {
+        return 'A';
+      }
+    }
+
+    class B extends React.Component {
+      state = {siblingUnmounted: false};
+      UNSAFE_componentWillMount() {
+        subscription = () => this.setState({siblingUnmounted: true});
+      }
+      render() {
+        return 'B' + (this.state.siblingUnmounted ? ' No Sibling' : '');
+      }
+    }
+
+    const el = document.createElement('div');
+    ReactDOM.render(<A />, el);
+    expect(el.textContent).toBe('A');
+
+    ReactDOM.render(<B />, el);
+    expect(el.textContent).toBe('B No Sibling');
+  });
 });
diff --git a/packages/react-reconciler/src/ReactFiberWorkLoop.new.js b/packages/react-reconciler/src/ReactFiberWorkLoop.new.js
@@ -2760,6 +2760,10 @@ function warnAboutUpdateOnNotYetMountedFiberInDEV(fiber) {
       return;
     }
 
+    if (!(fiber.mode & (BlockingMode | ConcurrentMode))) {
+      return;
+    }
+
     const tag = fiber.tag;
     if (
       tag !== IndeterminateComponent &&

diff --git a/packages/react-reconciler/src/ReactFiberWorkLoop.old.js b/packages/react-reconciler/src/ReactFiberWorkLoop.old.js
@@ -2927,6 +2927,10 @@ function warnAboutUpdateOnNotYetMountedFiberInDEV(fiber) {
       return;
     }
 
+    if (!(fiber.mode & (BlockingMode | ConcurrentMode))) {
+      return;
+    }
+
     const tag = fiber.tag;
     if (
       tag !== IndeterminateComponent &&