getDerivedStateFromProps now creates new versions instead of mutati…

…ng state
preactjs · Jul 29, 2018 · 576c891 · 576c891
1 parent ea932dd
commit 576c891
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 5 deletions.
diff --git a/src/vdom/component.js b/src/vdom/component.js
@@ -84,8 +84,8 @@ export function renderComponent(component, renderMode, mountAll, isChild) {
 		rendered, inst, cbase;
 
 	if (component.constructor.getDerivedStateFromProps) {
-		previousState = extend({}, previousState);
-		component.state = extend(state, component.constructor.getDerivedStateFromProps(props, state));
+		state = extend(extend({}, state), component.constructor.getDerivedStateFromProps(props, state));
+		component.state = state;
 	}
 
 	// if updating

diff --git a/test/browser/lifecycle.js b/test/browser/lifecycle.js
@@ -505,6 +505,31 @@ describe('Lifecycle methods', () => {
 				value: 3
 			});
 		});
+
+		it('should NOT mutate state, only create new versions', () => {
+			const stateConstant = {};
+			let componentState;
+
+			class Stateful extends Component {
+				static getDerivedStateFromProps() {
+					return {key: 'value'};
+				}
+
+				constructor() {
+					super(...arguments);
+					this.state = stateConstant;
+				}
+
+				componentDidMount() {
+					componentState = this.state;
+				}
+			}
+
+			render(<Stateful />, scratch);
+
+			expect(componentState).to.deep.equal({key: 'value'});
+			expect(stateConstant).to.deep.equal({});
+		});
 	});
 
 	describe("#getSnapshotBeforeUpdate", () => {
@@ -1326,13 +1351,11 @@ describe('Lifecycle methods', () => {
 
 
 	describe('#setState', () => {
-		it('should not mutate state, only create new versions', () => {
+		it('should NOT mutate state, only create new versions', () => {
 			const stateConstant = {};
 			let didMount = false;
 			let componentState;
 
-			expect(stateConstant).to.deep.equal({});
-
 			class Stateful extends Component {
 				constructor() {
 					super(...arguments);