Update additional tests to use .toWarnDev() matcher (#11957)

* Migrated several additional tests to use new .toWarnDev() matcher * Migrated ReactDOMComponent-test to use .toWarnDev() matcher Note this test previous had some hacky logic to verify errors were reported against unique line numbers. Since the new matcher doesn't suppor this, I replaced this check with an equivalent (I think) comparison of unique DOM elements (eg div -> span) * Updated several additional tests to use the new .toWarnDev() matcher * Updated many more tests to use .toWarnDev() * Updated several additional tests to use .toWarnDev() matcher * Updated ReactElementValidator to distinguish between Array and Object in its warning. Also updated its test to use .toWarnDev() matcher. * Updated a couple of additional tests * Removed unused normalizeCodeLocInfo() methods
facebook · Jan 3, 2018 · 9f848f8 · 9f848f8
1 parent a442d9b
commit 9f848f8
Show file tree

Hide file tree

Showing 20 changed files with 463 additions and 731 deletions.
diff --git a/packages/react-dom/src/__tests__/ReactCompositeComponentState-test.js b/packages/react-dom/src/__tests__/ReactCompositeComponentState-test.js
@@ -423,8 +423,6 @@ describe('ReactCompositeComponent-state', () => {
   });
 
   it('should treat assigning to this.state inside cWM as a replaceState, with a warning', () => {
-    spyOnDev(console, 'error');
-
     let ops = [];
     class Test extends React.Component {
       state = {step: 1, extra: true};

diff --git a/packages/react-dom/src/__tests__/ReactErrorBoundaries-test.js b/packages/react-dom/src/__tests__/ReactErrorBoundaries-test.js
@@ -1909,22 +1909,28 @@ describe('ReactErrorBoundaries', () => {
   });
 
   it('discards a bad root if the root component fails', () => {
-    spyOnDev(console, 'error');
-
     const X = null;
     const Y = undefined;
     let err1;
     let err2;
 
     try {
       let container = document.createElement('div');
-      ReactDOM.render(<X />, container);
+      expect(() => ReactDOM.render(<X />, container)).toWarnDev(
+        'React.createElement: type is invalid -- expected a string ' +
+          '(for built-in components) or a class/function ' +
+          '(for composite components) but got: null.',
+      );
     } catch (err) {
       err1 = err;
     }
     try {
       let container = document.createElement('div');
-      ReactDOM.render(<Y />, container);
+      expect(() => ReactDOM.render(<Y />, container)).toWarnDev(
+        'React.createElement: type is invalid -- expected a string ' +
+          '(for built-in components) or a class/function ' +
+          '(for composite components) but got: undefined.',
+      );
     } catch (err) {
       err2 = err;
     }

diff --git a/packages/react-dom/src/__tests__/ReactMultiChildText-test.js b/packages/react-dom/src/__tests__/ReactMultiChildText-test.js
@@ -73,104 +73,98 @@ const expectChildren = function(container, children) {
  */
 describe('ReactMultiChildText', () => {
   it('should correctly handle all possible children for render and update', () => {
-    spyOnDev(console, 'error');
-    // prettier-ignore
-    testAllPermutations([
-      // basic values
-      undefined, [],
-      null, [],
-      false, [],
-      true, [],
-      0, '0',
-      1.2, '1.2',
-      '', '',
-      'foo', 'foo',
-
-      [], [],
-      [undefined], [],
-      [null], [],
-      [false], [],
-      [true], [],
-      [0], ['0'],
-      [1.2], ['1.2'],
-      [''], [''],
-      ['foo'], ['foo'],
-      [<div />], [<div />],
-
-      // two adjacent values
-      [true, 0], ['0'],
-      [0, 0], ['0', '0'],
-      [1.2, 0], ['1.2', '0'],
-      [0, ''], ['0', ''],
-      ['foo', 0], ['foo', '0'],
-      [0, <div />], ['0', <div />],
-
-      [true, 1.2], ['1.2'],
-      [1.2, 0], ['1.2', '0'],
-      [1.2, 1.2], ['1.2', '1.2'],
-      [1.2, ''], ['1.2', ''],
-      ['foo', 1.2], ['foo', '1.2'],
-      [1.2, <div />], ['1.2', <div />],
-
-      [true, ''], [''],
-      ['', 0], ['', '0'],
-      [1.2, ''], ['1.2', ''],
-      ['', ''], ['', ''],
-      ['foo', ''], ['foo', ''],
-      ['', <div />], ['', <div />],
-
-      [true, 'foo'], ['foo'],
-      ['foo', 0], ['foo', '0'],
-      [1.2, 'foo'], ['1.2', 'foo'],
-      ['foo', ''], ['foo', ''],
-      ['foo', 'foo'], ['foo', 'foo'],
-      ['foo', <div />], ['foo', <div />],
-
-      // values separated by an element
-      [true, <div />, true], [<div />],
-      [1.2, <div />, 1.2], ['1.2', <div />, '1.2'],
-      ['', <div />, ''], ['', <div />, ''],
-      ['foo', <div />, 'foo'], ['foo', <div />, 'foo'],
-
-      [true, 1.2, <div />, '', 'foo'], ['1.2', <div />, '', 'foo'],
-      [1.2, '', <div />, 'foo', true], ['1.2', '', <div />, 'foo'],
-      ['', 'foo', <div />, true, 1.2], ['', 'foo', <div />, '1.2'],
-
-      [true, 1.2, '', <div />, 'foo', true, 1.2], ['1.2', '', <div />, 'foo', '1.2'],
-      ['', 'foo', true, <div />, 1.2, '', 'foo'], ['', 'foo', <div />, '1.2', '', 'foo'],
-
-      // values inside arrays
-      [[true], [true]], [],
-      [[1.2], [1.2]], ['1.2', '1.2'],
-      [[''], ['']], ['', ''],
-      [['foo'], ['foo']], ['foo', 'foo'],
-      [[<div />], [<div />]], [<div />, <div />],
-
-      [[true, 1.2, <div />], '', 'foo'], ['1.2', <div />, '', 'foo'],
-      [1.2, '', [<div />, 'foo', true]], ['1.2', '', <div />, 'foo'],
-      ['', ['foo', <div />, true], 1.2], ['', 'foo', <div />, '1.2'],
-
-      [true, [1.2, '', <div />, 'foo'], true, 1.2], ['1.2', '', <div />, 'foo', '1.2'],
-      ['', 'foo', [true, <div />, 1.2, ''], 'foo'], ['', 'foo', <div />, '1.2', '', 'foo'],
-
-      // values inside elements
-      [<div>{true}{1.2}{<div />}</div>, '', 'foo'], [<div />, '', 'foo'],
-      [1.2, '', <div>{<div />}{'foo'}{true}</div>], ['1.2', '', <div />],
-      ['', <div>{'foo'}{<div />}{true}</div>, 1.2], ['', <div />, '1.2'],
-
-      [true, <div>{1.2}{''}{<div />}{'foo'}</div>, true, 1.2], [<div />, '1.2'],
-      ['', 'foo', <div>{true}{<div />}{1.2}{''}</div>, 'foo'], ['', 'foo', <div />, 'foo'],
+    expect(() => {
+      // prettier-ignore
+      testAllPermutations([
+        // basic values
+        undefined, [],
+        null, [],
+        false, [],
+        true, [],
+        0, '0',
+        1.2, '1.2',
+        '', '',
+        'foo', 'foo',
+
+        [], [],
+        [undefined], [],
+        [null], [],
+        [false], [],
+        [true], [],
+        [0], ['0'],
+        [1.2], ['1.2'],
+        [''], [''],
+        ['foo'], ['foo'],
+        [<div />], [<div />],
+
+        // two adjacent values
+        [true, 0], ['0'],
+        [0, 0], ['0', '0'],
+        [1.2, 0], ['1.2', '0'],
+        [0, ''], ['0', ''],
+        ['foo', 0], ['foo', '0'],
+        [0, <div />], ['0', <div />],
+
+        [true, 1.2], ['1.2'],
+        [1.2, 0], ['1.2', '0'],
+        [1.2, 1.2], ['1.2', '1.2'],
+        [1.2, ''], ['1.2', ''],
+        ['foo', 1.2], ['foo', '1.2'],
+        [1.2, <div />], ['1.2', <div />],
+
+        [true, ''], [''],
+        ['', 0], ['', '0'],
+        [1.2, ''], ['1.2', ''],
+        ['', ''], ['', ''],
+        ['foo', ''], ['foo', ''],
+        ['', <div />], ['', <div />],
+
+        [true, 'foo'], ['foo'],
+        ['foo', 0], ['foo', '0'],
+        [1.2, 'foo'], ['1.2', 'foo'],
+        ['foo', ''], ['foo', ''],
+        ['foo', 'foo'], ['foo', 'foo'],
+        ['foo', <div />], ['foo', <div />],
+
+        // values separated by an element
+        [true, <div />, true], [<div />],
+        [1.2, <div />, 1.2], ['1.2', <div />, '1.2'],
+        ['', <div />, ''], ['', <div />, ''],
+        ['foo', <div />, 'foo'], ['foo', <div />, 'foo'],
+
+        [true, 1.2, <div />, '', 'foo'], ['1.2', <div />, '', 'foo'],
+        [1.2, '', <div />, 'foo', true], ['1.2', '', <div />, 'foo'],
+        ['', 'foo', <div />, true, 1.2], ['', 'foo', <div />, '1.2'],
+
+        [true, 1.2, '', <div />, 'foo', true, 1.2], ['1.2', '', <div />, 'foo', '1.2'],
+        ['', 'foo', true, <div />, 1.2, '', 'foo'], ['', 'foo', <div />, '1.2', '', 'foo'],
+
+        // values inside arrays
+        [[true], [true]], [],
+        [[1.2], [1.2]], ['1.2', '1.2'],
+        [[''], ['']], ['', ''],
+        [['foo'], ['foo']], ['foo', 'foo'],
+        [[<div />], [<div />]], [<div />, <div />],
+
+        [[true, 1.2, <div />], '', 'foo'], ['1.2', <div />, '', 'foo'],
+        [1.2, '', [<div />, 'foo', true]], ['1.2', '', <div />, 'foo'],
+        ['', ['foo', <div />, true], 1.2], ['', 'foo', <div />, '1.2'],
+
+        [true, [1.2, '', <div />, 'foo'], true, 1.2], ['1.2', '', <div />, 'foo', '1.2'],
+        ['', 'foo', [true, <div />, 1.2, ''], 'foo'], ['', 'foo', <div />, '1.2', '', 'foo'],
+
+        // values inside elements
+        [<div>{true}{1.2}{<div />}</div>, '', 'foo'], [<div />, '', 'foo'],
+        [1.2, '', <div>{<div />}{'foo'}{true}</div>], ['1.2', '', <div />],
+        ['', <div>{'foo'}{<div />}{true}</div>, 1.2], ['', <div />, '1.2'],
+
+        [true, <div>{1.2}{''}{<div />}{'foo'}</div>, true, 1.2], [<div />, '1.2'],
+        ['', 'foo', <div>{true}{<div />}{1.2}{''}</div>, 'foo'], ['', 'foo', <div />, 'foo'],
+      ]);
+    }).toWarnDev([
+      'Warning: Each child in an array or iterator should have a unique "key" prop.',
+      'Warning: Each child in an array or iterator should have a unique "key" prop.',
     ]);
-
-    if (__DEV__) {
-      expect(console.error.calls.count()).toBe(2);
-      expect(console.error.calls.argsFor(0)[0]).toContain(
-        'Warning: Each child in an array or iterator should have a unique "key" prop.',
-      );
-      expect(console.error.calls.argsFor(1)[0]).toContain(
-        'Warning: Each child in an array or iterator should have a unique "key" prop.',
-      );
-    }
   });
 
   it('should throw if rendering both HTML and children', () => {