Configure `yarn test` to hide most console messages and long error messages. (#11728)

README.md

@@ -56,17 +56,19 @@ Here are some commands you can run:
 | yarn prettier-ci | Run [Prettier][] and fail if some code has been changed without being formatted |
 | yarn version-check | Check you have the required dependencies |
 | yarn test | Run all tests (Enters [jest][] in `--watch` mode) |
+| yarn test-debug | Run all tests with full console output and full error messages (Enters [jest][] in `--watch` mode) |
 | yarn test-coverage | Run all tests and generate code coverage report (Enters [jest][] in `--watch` mode) |
 | yarn test-coverage-once | Run all tests, generate code coverage report, then exit |
 | yarn test-once | Run all tests, run all JS + SCSS linters, then exit |
-| yarn test-ci | Run all continuous integration checks. This is only meant to run on TravisCI. |
+| yarn test-ci | Run all continuous integration checks. This is only meant to run on CI. |
 
 ### Running tests
 
-You can enter the interactive [jest][] mode by typing `yarn test`. This is the easiest way to develop new features.
+You can enter the interactive [jest][] mode by typing `yarn test` or `yarn test-debug`. This is the easiest way to develop new features.
 
 Here are a few tips:
 
+- `yarn test` will hide most console output and detailed test failure messages, so it is best when you are running a full suite of tests. When working on an individual test, you likely want to run `yarn test-debug`.
 - When you start `yarn test`, you can switch to your code editor and begin adding test files or changing existing code. As you save each file, [jest][] will only run tests related to the code you change.
 - If you had typed `a` when you first started then [jest][] will continue to run the full suite even when you change specific files. Type `o` to switch back to the mode of only running tests related to the files you are changing.
 - Sometimes running tests related to your file changes is slow. In these cases, you can type `p` or `t` to filter tests by name while you working fixing a specific test suite. [More info](https://github.com/jest-community/jest-watch-typeahead).

package.json

@@ -38,6 +38,7 @@
     "test-ci": "bin/config-check.js && npm run build-locales && better-npm-run test-ci",
     "test-ci-next": "bin/config-check.js && npm run build-locales && better-npm-run test-ci-next",
     "test": "bin/config-check.js && better-npm-run jest --watch",
+    "test-debug": "bin/config-check.js && better-npm-run jest-debug --watch",
     "test-coverage": "bin/config-check.js && better-npm-run jest --coverage --watch",
     "test-coverage-once": "bin/config-check.js && better-npm-run jest --coverage",
     "test-once": "bin/config-check.js && better-npm-run jest && npm run lint",
@@ -129,6 +130,13 @@
         "NODE_ICU_DATA": "./node_modules/full-icu"
       }
     },
+    "jest-debug": {
+      "command": "jest",
+      "env": {
+        "NODE_ICU_DATA": "./node_modules/full-icu",
+        "TEST_DEBUG": "FULL"
+      }
+    },
     "test-ci": {
       "command": "npm run version-check && npm run flow:check && bin/config-check.js && better-npm-run jest --maxWorkers=2 --color=false --coverage",
       "env": {

tests/setup.js

@@ -1,5 +1,6 @@
 import { setImmediate } from 'timers';
 
+import { configure } from '@testing-library/react';
 import sinon from 'sinon';
 import config from 'config';
 import areIntlLocalesSupported from 'intl-locales-supported';
@@ -9,6 +10,25 @@ import '@testing-library/jest-dom/extend-expect';
 
 import 'amo/polyfill';
 
+if (process.env.TEST_DEBUG !== 'FULL') {
+  configure({
+    getElementError: (message) => {
+      const error = new Error(message.split('\n', 5).join('\n'));
+      error.name = 'TestingLibraryElementError';
+      return error;
+    },
+  });
+
+  global.console = {
+    ...console,
+    log: jest.fn(),
+    debug: jest.fn(),
+    info: jest.fn(),
+    warn: jest.fn,
+    error: jest.fn(),
+  };
+}
+
 // setImmediate is required by Express in server tests.
 // Being a Node.js API, it is not available for `testEnvironment: 'jsdom'`.
 // FIXME: Server tests should be be ran w/ `testEnvironment: 'node'`.