[test] Match against messages not args on console methods (#20046)

Author: eps1lon

package.json

@@ -101,6 +101,7 @@
     "eslint-plugin-react": "^7.14.3",
     "eslint-plugin-react-hooks": "^2.1.1",
     "expect-puppeteer": "^4.3.0",
+    "format-util": "^1.0.5",
     "fs-extra": "^8.1.0",
     "glob": "^7.1.2",
     "glob-gitignore": "^1.0.11",

packages/material-ui-lab/src/Autocomplete/Autocomplete.test.js

@@ -777,7 +777,7 @@ describe('<Autocomplete />', () => {
       expect(handleChange.callCount).to.equal(1);
       expect(handleChange.args[0][1]).to.equal('a');
       expect(consoleErrorMock.callCount()).to.equal(2); // strict mode renders twice
-      expect(consoleErrorMock.args()[0][0]).to.include(
+      expect(consoleErrorMock.messages()[0]).to.include(
         'For the input option: "a", `getOptionLabel` returns: undefined',
       );
     });
@@ -806,7 +806,7 @@ describe('<Autocomplete />', () => {
       fireEvent.keyDown(document.activeElement, { key: 'Enter' });
 
       expect(consoleErrorMock.callCount()).to.equal(1); // strict mode renders twice
-      expect(consoleErrorMock.args()[0][0]).to.include(
+      expect(consoleErrorMock.messages()[0]).to.include(
         'The component expects a single value to match a given option but found 2 matches.',
       );
     });

packages/material-ui-lab/src/TreeView/TreeView.test.js

@@ -45,7 +45,7 @@ describe('<TreeView />', () => {
       );
 
       setProps({ expanded: undefined });
-      expect(consoleErrorMock.args()[0][0]).to.include(
+      expect(consoleErrorMock.messages()[0]).to.include(
         'A component is changing a controlled TreeView to be uncontrolled',
       );
     });
@@ -58,7 +58,7 @@ describe('<TreeView />', () => {
       );
 
       setProps({ selected: undefined });
-      expect(consoleErrorMock.args()[0][0]).to.include(
+      expect(consoleErrorMock.messages()[0]).to.include(
         'A component is changing a controlled TreeView to be uncontrolled',
       );
     });

packages/material-ui-styles/src/StylesProvider/StylesProvider.test.js

@@ -161,7 +161,7 @@ describe('StylesProvider', () => {
       );
       assert.strictEqual(consoleErrorMock.callCount(), 1);
       assert.include(
-        consoleErrorMock.args()[0][0],
+        consoleErrorMock.messages()[0],
         'you cannot use the jss and injectFirst props at the same time',
       );
     });

packages/material-ui-styles/src/ThemeProvider/ThemeProvider.test.js

@@ -144,7 +144,7 @@ describe('ThemeProvider', () => {
         </ThemeProvider>,
       );
       assert.strictEqual(consoleErrorMock.callCount(), 2); // twice in strict mode
-      assert.include(consoleErrorMock.args()[0][0], 'However, no outer theme is present.');
+      assert.include(consoleErrorMock.messages()[0], 'However, no outer theme is present.');
     });
 
     it('should warn about wrong theme function', () => {
@@ -158,7 +158,7 @@ describe('ThemeProvider', () => {
       );
       assert.strictEqual(consoleErrorMock.callCount(), 2);
       assert.include(
-        consoleErrorMock.args()[0][0],
+        consoleErrorMock.messages()[0],
         'you should return an object from your theme function',
       );
     });

packages/material-ui-styles/src/makeStyles/makeStyles.test.js

@@ -93,7 +93,7 @@ describe('makeStyles', () => {
       assert.deepEqual(extendedClasses, { root: baseClasses.root, bar: 'undefined foo' });
       assert.strictEqual(consoleErrorMock.callCount(), 1);
       assert.include(
-        consoleErrorMock.args()[0][0],
+        consoleErrorMock.messages()[0],
         'Material-UI: the key `bar` provided to the classes prop is not implemented',
       );
     });
@@ -102,9 +102,9 @@ describe('makeStyles', () => {
       const output = mountWithProps();
       output.wrapper.setProps({ classes: 'foo' });
       assert.strictEqual(consoleErrorMock.callCount() >= 1, true);
-      const args = consoleErrorMock.args();
+      const messages = consoleErrorMock.messages();
       assert.include(
-        consoleErrorMock.args()[args.length - 1][0],
+        messages[messages.length - 1],
         'You might want to use the className prop instead',
       );
     });
@@ -117,7 +117,7 @@ describe('makeStyles', () => {
       assert.deepEqual(extendedClasses, { root: `${baseClasses.root} [object Object]` });
       assert.strictEqual(consoleErrorMock.callCount(), 1);
       assert.include(
-        consoleErrorMock.args()[0][0],
+        consoleErrorMock.messages()[0],
         'Material-UI: the key `root` provided to the classes prop is not valid',
       );
     });
@@ -129,7 +129,7 @@ describe('makeStyles', () => {
         mountWithProps2({});
       });
       assert.strictEqual(consoleErrorMock.callCount(), 4);
-      assert.include(consoleErrorMock.args()[1][0], 'the `styles` argument provided is invalid');
+      assert.include(consoleErrorMock.messages()[1], 'the `styles` argument provided is invalid');
     });
   });
 

packages/material-ui-styles/src/styled/styled.test.js

@@ -108,7 +108,7 @@ describe('styled', () => {
       );
       assert.strictEqual(consoleErrorMock.callCount(), 1);
       assert.include(
-        consoleErrorMock.args()[0][0],
+        consoleErrorMock.messages()[0],
         'You can not use the clone and component prop at the same time',
       );
     });

packages/material-ui-styles/src/withStyles/withStyles.test.js

@@ -91,7 +91,7 @@ describe('withStyles', () => {
 
     //     assert.strictEqual(consoleErrorMock.callCount(), 1);
     //     assert.include(
-    //       consoleErrorMock.args()[0][0],
+    //       consoleErrorMock.messages()[0],
     //       'Warning: Failed prop type: Material-UI: the `innerRef` prop is deprecated',
     //     );
     //   });

packages/material-ui-styles/src/withTheme/withTheme.test.js

@@ -99,7 +99,7 @@ describe('withTheme', () => {
 
         assert.strictEqual(consoleErrorMock.callCount(), 1);
         assert.include(
-          consoleErrorMock.args()[0][0],
+          consoleErrorMock.messages()[0],
           'Warning: Failed prop type: Material-UI: the `innerRef` prop is deprecated',
         );
       });

packages/material-ui-system/src/spacing.test.js

@@ -57,9 +57,9 @@ describe('spacing', () => {
       });
       assert.deepEqual(output, { padding: undefined });
       assert.strictEqual(consoleErrorMock.callCount(), 1);
-      assert.match(consoleErrorMock.args()[0][0], /the value provided \(3\) overflows\./);
-      assert.match(consoleErrorMock.args()[0][0], /The supported values are: \[0,3,5\]\./);
-      assert.match(consoleErrorMock.args()[0][0], /3 > 2, you need to add the missing values\./);
+      assert.match(consoleErrorMock.messages()[0], /the value provided \(3\) overflows\./);
+      assert.match(consoleErrorMock.messages()[0], /The supported values are: \[0,3,5\]\./);
+      assert.match(consoleErrorMock.messages()[0], /3 > 2, you need to add the missing values\./);
     });
 
     it('should warn if the theme transformer is invalid', () => {
@@ -72,11 +72,11 @@ describe('spacing', () => {
       assert.deepEqual(output, { padding: undefined });
       assert.strictEqual(consoleErrorMock.callCount(), 1);
       assert.match(
-        consoleErrorMock.args()[0][0],
+        consoleErrorMock.messages()[0],
         /the `theme.spacing` value \(\[object Object\]\) is invalid\./,
       );
       assert.match(
-        consoleErrorMock.args()[0][0],
+        consoleErrorMock.messages()[0],
         /It should be a number, an array or a function\./,
       );
     });