[Tests] add shallow-failing test for state diffing in sCU after gDSFP

enzymejs · Jan 15, 2019 · 0db2115 · 0db2115
1 parent d686c91
commit 0db2115
Show file tree

Hide file tree

Showing 2 changed files with 60 additions and 2 deletions.
diff --git a/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx b/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx
@@ -5774,7 +5774,7 @@ describeWithDOM('mount', () => {
         ]);
       });
 
-      it('calls GDSFP when expected', () => {
+      it('calls gDSFP when expected', () => {
         const prevProps = { a: 1 };
         const state = { state: true };
         const wrapper = mount(<GDSFP {...prevProps} />);
@@ -5821,6 +5821,35 @@ describeWithDOM('mount', () => {
           }],
         ]);
       });
+
+      it('cDU’s nextState differs from `this.state` when gDSFP returns new state', () => {
+        class SimpleComponent extends React.Component {
+          constructor(props) {
+            super(props);
+            this.state = { value: props.value };
+          }
+
+          static getDerivedStateFromProps(props, state) {
+            return props.value === state.value ? null : { value: props.value };
+          }
+
+          shouldComponentUpdate(nextProps, nextState) {
+            return nextState.value !== this.state.value;
+          }
+
+          render() {
+            const { value } = this.state;
+            return (<input value={value} />);
+          }
+        }
+        const wrapper = mount(<SimpleComponent value="initial" />);
+
+        expect(wrapper.find('input').prop('value')).to.equal('initial');
+
+        wrapper.setProps({ value: 'updated' });
+
+        expect(wrapper.find('input').prop('value')).to.equal('updated');
+      });
     });
 
     describeIf(is('>= 16'), 'componentDidCatch', () => {

diff --git a/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx b/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx
@@ -6114,7 +6114,7 @@ describe('shallow', () => {
         ]);
       });
 
-      it('calls GDSFP when expected', () => {
+      it('calls gDSFP when expected', () => {
         const prevProps = { a: 1 };
         const state = { state: true };
         const wrapper = shallow(<GDSFP {...prevProps} />);
@@ -6161,6 +6161,35 @@ describe('shallow', () => {
           }],
         ]);
       });
+
+      it('cDU’s nextState differs from `this.state` when gDSFP returns new state', () => {
+        class SimpleComponent extends React.Component {
+          constructor(props) {
+            super(props);
+            this.state = { value: props.value };
+          }
+
+          static getDerivedStateFromProps(props, state) {
+            return props.value === state.value ? null : { value: props.value };
+          }
+
+          shouldComponentUpdate(nextProps, nextState) {
+            return nextState.value !== this.state.value;
+          }
+
+          render() {
+            const { value } = this.state;
+            return (<input value={value} />);
+          }
+        }
+        const wrapper = shallow(<SimpleComponent value="initial" />);
+
+        expect(wrapper.find('input').prop('value')).to.equal('initial');
+
+        wrapper.setProps({ value: 'updated' });
+
+        expect(wrapper.find('input').prop('value')).to.equal('updated');
+      });
     });
 
     describeIf(is('>= 16'), 'componentDidCatch', () => {