Merge pull request #155 from preactjs/bugfix/get-derived-state-from-props

Keep state changes during getDerivedStateFromProps

Author: marvinhagemeister

src/index.js

@@ -122,13 +122,15 @@ function renderToString(vnode, context, opts, inner, isSvgMode, selectValue) {
 
 				c.context = cctx;
 				if (nodeName.getDerivedStateFromProps) c.state = assign(assign({}, c.state), nodeName.getDerivedStateFromProps(c.props, c.state));
-				else if (c.componentWillMount) c.componentWillMount();
-
-				// If the user called setState in cWM we need to flush pending,
-				// state updates. This is the same behaviour in React.
-				c.state = c._nextState !== c.state
-					? c._nextState : c.__s!==c.state
-						? c.__s : c.state;
+				else if (c.componentWillMount) {
+					c.componentWillMount();
+
+					// If the user called setState in cWM we need to flush pending,
+					// state updates. This is the same behaviour in React.
+					c.state = c._nextState !== c.state
+						? c._nextState : c.__s!==c.state
+							? c.__s : c.state;
+				}
 
 				rendered = c.render(c.props, c.state, c.context);
 			}

test/render.js

@@ -336,19 +336,23 @@ describe('render', () => {
 
 		it('should invoke getDerivedStateFromProps', () => {
 			class Test extends Component {
-				static getDerivedStateFromProps() {}
-				render(props) {
-					return <div {...props} />;
+				static getDerivedStateFromProps() {
+					return { foo: 'bar' };
+				}
+				render(props, state) {
+					return <div {...props} {...state} />;
 				}
 			}
 			spy(Test.prototype.constructor, 'getDerivedStateFromProps');
 			spy(Test.prototype, 'render');
 
-			render(<Test />);
+			const result = render(<Test />);
 
 			expect(Test.prototype.constructor.getDerivedStateFromProps)
 				.to.have.been.calledOnce
 				.and.to.have.been.calledBefore(Test.prototype.render);
+
+			expect(result).to.equal('<div foo="bar"></div>');
 		});
 
 		it('should invoke componentWillMount', () => {