Respect state set in componentWillMount() on resuming (facebook#8079)

When resuming creating new instance after resuming work, we should set the `state` on the newly creating instance rather than the old one.
artgoce · Oct 24, 2016 · 265ab83 · 265ab83
1 parent 9626c83
commit 265ab83
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 1 deletion.
diff --git a/src/renderers/shared/fiber/ReactFiberClassComponent.js b/src/renderers/shared/fiber/ReactFiberClassComponent.js
@@ -152,7 +152,7 @@ module.exports = function(scheduleUpdate : (fiber: Fiber, priorityLevel : Priori
       // process them now.
       const newUpdateQueue = workInProgress.updateQueue;
       if (newUpdateQueue) {
-        instance.state = mergeUpdateQueue(newUpdateQueue, newState, newProps);
+        newInstance.state = mergeUpdateQueue(newUpdateQueue, newState, newProps);
       }
     }
     return true;

diff --git a/src/renderers/shared/fiber/__tests__/ReactIncremental-test.js b/src/renderers/shared/fiber/__tests__/ReactIncremental-test.js
@@ -993,6 +993,53 @@ describe('ReactIncremental', () => {
     ]);
   });
 
+  it('uses state set in componentWillMount even if initial render was aborted', () => {
+    var ops = [];
+
+    class LifeCycle extends React.Component {
+      constructor(props) {
+        super(props);
+        this.state = {x: this.props.x + '(ctor)'};
+      }
+      componentWillMount() {
+        ops.push('componentWillMount:' + this.state.x);
+        this.setState({x: this.props.x + '(willMount)'});
+      }
+      componentDidMount() {
+        ops.push('componentDidMount:' + this.state.x);
+      }
+      render() {
+        ops.push('render:' + this.state.x);
+        return <span />;
+      }
+    }
+
+    function App(props) {
+      ops.push('App');
+      return <LifeCycle x={props.x} />;
+    }
+
+    ReactNoop.render(<App x={0} />);
+    ReactNoop.flushDeferredPri(20);
+
+    expect(ops).toEqual([
+      'App',
+      'componentWillMount:0(ctor)',
+      'render:0(willMount)',
+    ]);
+
+    ops = [];
+    ReactNoop.render(<App x={1} />);
+    ReactNoop.flush();
+
+    expect(ops).toEqual([
+      'App',
+      'componentWillMount:1(ctor)',
+      'render:1(willMount)',
+      'componentDidMount:1(willMount)',
+    ]);
+  });
+
   it('calls componentWill* twice if an update render is aborted', () => {
     var ops = [];