Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions scripts/fiber/tests-passing.txt
Original file line number Diff line number Diff line change
Expand Up @@ -607,6 +607,7 @@ src/renderers/__tests__/ReactCompositeComponentState-test.js
* should batch unmounts
* should update state when called from child cWRP
* should merge state when sCU returns false
* should treat assigning to this.state inside cWRP as a replaceState, with a warning

src/renderers/__tests__/ReactEmptyComponent-test.js
* should not produce child DOM nodes for null and false
Expand Down
39 changes: 39 additions & 0 deletions src/renderers/__tests__/ReactCompositeComponentState-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -414,4 +414,43 @@ describe('ReactCompositeComponent-state', () => {
'scu from a,b to a,b,c',
]);
});

it('should treat assigning to this.state inside cWRP as a replaceState, with a warning', () => {
spyOn(console, 'error');

let ops = [];
class Test extends React.Component {
state = { step: 1, extra: true };
componentWillReceiveProps() {
this.setState({ step: 2 }, () => {
// Tests that earlier setState callbacks are not dropped
ops.push(`callback -- step: ${this.state.step}, extra: ${!!this.state.extra}`);
});
// Treat like replaceState
this.state = { step: 3 };
}
render() {
ops.push(`render -- step: ${this.state.step}, extra: ${!!this.state.extra}`);
return null;
}
}

// Mount
const container = document.createElement('div');
ReactDOM.render(<Test />, container);
// Update
ReactDOM.render(<Test />, container);

expect(ops).toEqual([
'render -- step: 1, extra: true',
'render -- step: 3, extra: false',
'callback -- step: 3, extra: false',
]);
expect(console.error.calls.count()).toEqual(1);
expect(console.error.calls.argsFor(0)[0]).toEqual(
'Warning: Test.componentWillReceiveProps(): Assigning directly to ' +
'this.state is deprecated (except inside a component\'s constructor). ' +
'Use setState instead.'
);
});
});
13 changes: 13 additions & 0 deletions src/renderers/shared/fiber/ReactFiberClassComponent.js
Original file line number Diff line number Diff line change
Expand Up @@ -408,6 +408,19 @@ module.exports = function(
if (oldProps !== newProps || oldContext !== newContext) {
if (typeof instance.componentWillReceiveProps === 'function') {
instance.componentWillReceiveProps(newProps, newContext);

if (instance.state !== workInProgress.memoizedState) {
if (__DEV__) {
warning(
false,
'%s.componentWillReceiveProps(): Assigning directly to ' +
'this.state is deprecated (except inside a component\'s ' +
'constructor). Use setState instead.',
getComponentName(workInProgress)
);
}
updater.enqueueReplaceState(instance, instance.state, null);
}
}
}

Expand Down
15 changes: 15 additions & 0 deletions src/renderers/shared/stack/reconciler/ReactCompositeComponent.js
Original file line number Diff line number Diff line change
Expand Up @@ -850,6 +850,7 @@ var ReactCompositeComponent = {
// _pendingStateQueue which will ensure that any state updates gets
// immediately reconciled instead of waiting for the next batch.
if (willReceive && inst.componentWillReceiveProps) {
const beforeState = inst.state;
if (__DEV__) {
measureLifeCyclePerf(
() => inst.componentWillReceiveProps(nextProps, nextContext),
Expand All @@ -859,6 +860,20 @@ var ReactCompositeComponent = {
} else {
inst.componentWillReceiveProps(nextProps, nextContext);
}
const afterState = inst.state;
if (beforeState !== afterState) {
inst.state = beforeState;
inst.updater.enqueueReplaceState(inst, afterState);
if (__DEV__) {
warning(
false,
'%s.componentWillReceiveProps(): Assigning directly to ' +
'this.state is deprecated (except inside a component\'s ' +
'constructor). Use setState instead.',
this.getName() || 'ReactCompositeComponent'
);
}
}
}

// If updating happens to enqueue any new updates, we shouldn't execute new
Expand Down