feat(eslint-config-react-app): Add jest, jest-dom & testing-library rules

Author: MichaelDeBoey

packages/eslint-config-react-app/README.md

@@ -19,7 +19,7 @@ If you want to use this ESLint configuration in a project not built with Create
 First, install this package, ESLint and the necessary plugins.
 
 ```sh
-npm install --save-dev eslint-config-react-app @typescript-eslint/eslint-plugin@^4.0.0 @typescript-eslint/parser@^4.0.0 babel-eslint@^10.0.0 eslint@^7.5.0 eslint-plugin-flowtype@^5.2.0 eslint-plugin-import@^2.22.0 eslint-plugin-jest@^24.0.0 eslint-plugin-jsx-a11y@^6.3.1 eslint-plugin-react@^7.20.3 eslint-plugin-react-hooks@^4.0.8
+npm install --save-dev eslint-config-react-app @typescript-eslint/eslint-plugin@^4.0.0 @typescript-eslint/parser@^4.0.0 babel-eslint@^10.0.0 eslint@^7.5.0 eslint-plugin-flowtype@^5.2.0 eslint-plugin-import@^2.22.0 eslint-plugin-jsx-a11y@^6.3.1 eslint-plugin-react@^7.20.3 eslint-plugin-react-hooks@^4.0.8
 ```
 
 Then create a file named `.eslintrc.json` with following contents in the root folder of your project:
@@ -39,7 +39,7 @@ This config also ships with optional Jest rules for ESLint (based on [`eslint-pl
 You'll first need to add the ESLint plugin for Jest (if you don't already have it installed).
 
 ```sh
-npm install --save-dev eslint-plugin-jest@^24.0.0
+npm install --save-dev eslint-plugin-jest@^24.0.0 eslint-plugin-jest-dom@^3.0.0 eslint-plugin-testing-library&^3.9.0
 ```
 
 You can then enable these rules by adding the Jest config to the `extends` array in your ESLint config.

packages/eslint-config-react-app/jest.js

@@ -12,21 +12,62 @@
 // and we try not to use "ERROR" level at all.
 
 module.exports = {
-  plugins: ['jest'],
+  plugins: ['jest', 'jest-dom', 'testing-library'],
   overrides: [
     {
       files: ['**/__tests__/**/*', '**/*.{spec,test}.*'],
       env: {
         'jest/globals': true,
       },
       // A subset of the recommended rules:
-      // https://github.com/jest-community/eslint-plugin-jest#rules
       rules: {
-        'jest/expect-expect': 'warn',
-        'jest/no-identical-title': 'warn',
-        'jest/valid-describe': 'warn',
-        'jest/valid-expect': 'warn',
-        'jest/valid-expect-in-promise': 'warn',
+        // https://github.com/jest-community/eslint-plugin-jest
+        'jest/expect-expect': 'off',
+        'jest/no-commented-out-tests': 'warn',
+        'jest/no-conditional-expect': 'error',
+        'jest/no-deprecated-functions': 'warn',
+        'jest/no-disabled-tests': 'warn',
+        'jest/no-done-callback': 'error',
+        'jest/no-export': 'error',
+        'jest/no-focused-tests': 'warn',
+        'jest/no-identical-title': 'error',
+        'jest/no-interpolation-in-snapshots': 'error',
+        'jest/no-jasmine-globals': 'error',
+        'jest/no-jest-import': 'error',
+        'jest/no-mocks-import': 'error',
+        'jest/no-standalone-expect': 'off',
+        'jest/no-test-callback': 'off',
+        'jest/no-test-prefixes': 'warn',
+        'jest/valid-describe': 'error',
+        'jest/valid-expect': 'error',
+        'jest/valid-expect-in-promise': 'error',
+        'jest/valid-title': 'warn',
+
+        // https://github.com/testing-library/eslint-plugin-jest-dom
+        'jest-dom/prefer-checked': 'warn',
+        'jest-dom/prefer-empty': 'warn',
+        'jest-dom/prefer-enabled-disabled': 'warn',
+        'jest-dom/prefer-focus': 'warn',
+        'jest-dom/prefer-required': 'warn',
+        'jest-dom/prefer-to-have-attribute': 'warn',
+        'jest-dom/prefer-to-have-style': 'warn',
+        'jest-dom/prefer-to-have-text-content': 'warn',
+
+        // https://github.com/testing-library/eslint-plugin-testing-library
+        'testing-library/await-async-query': 'error',
+        'testing-library/await-async-utils': 'error',
+        'testing-library/no-await-sync-query': 'warn',
+        'testing-library/no-debug': 'warn',
+        'testing-library/no-dom-import': ['error', 'react'],
+        'testing-library/no-manual-cleanup': 'error',
+        'testing-library/no-render-in-setup': 'error',
+        'testing-library/no-wait-for-empty-callback': 'error',
+        'testing-library/no-wait-for-snapshot': 'error',
+        'testing-library/prefer-explicit-assert': 'warn',
+        'testing-library/prefer-find-by': 'warn',
+        'testing-library/prefer-presence-queries': 'warn',
+        'testing-library/prefer-screen-queries': 'warn',
+        'testing-library/prefer-wait-for': 'warn',
       },
     },
   ],

packages/eslint-config-react-app/package.json

@@ -24,9 +24,22 @@
     "eslint-plugin-flowtype": "^5.2.0",
     "eslint-plugin-import": "^2.22.0",
     "eslint-plugin-jest": "^24.0.0",
+    "eslint-plugin-jest-dom": "^3.0.0",
     "eslint-plugin-jsx-a11y": "^6.3.1",
     "eslint-plugin-react": "^7.20.3",
-    "eslint-plugin-react-hooks": "^4.0.8"
+    "eslint-plugin-react-hooks": "^4.0.8",
+    "eslint-plugin-testing-library": "^3.9.0"
+  },
+  "peerDependenciesMeta": {
+    "eslint-plugin-jest": {
+      "optional": true
+    },
+    "eslint-plugin-jest-dom": {
+      "optional": true
+    },
+    "eslint-plugin-testing-library": {
+      "optional": true
+    }
   },
   "dependencies": {
     "confusing-browser-globals": "^1.0.9"

packages/react-error-overlay/.eslintrc

@@ -1,5 +1,5 @@
 {
-  "extends": "react-app",
+  "extends": ["react-app", "react-app/jest"],
   "rules": {
     "curly": "warn"
   }

packages/react-error-overlay/package.json

@@ -48,10 +48,12 @@
     "eslint-config-react-app": "^5.2.1",
     "eslint-plugin-flowtype": "^5.2.0",
     "eslint-plugin-import": "^2.22.0",
-    "eslint-plugin-jest": "^24.0.1",
+    "eslint-plugin-jest": "^24.0.2",
+    "eslint-plugin-jest-dom": "^3.2.3",
     "eslint-plugin-jsx-a11y": "^6.3.1",
     "eslint-plugin-react": "^7.20.6",
     "eslint-plugin-react-hooks": "^4.1.2",
+    "eslint-plugin-testing-library": "^3.9.0",
     "flow-bin": "^0.116.0",
     "html-entities": "1.3.1",
     "jest": "26.4.2",

packages/react-scripts/package.json

@@ -49,10 +49,12 @@
     "eslint-loader": "^4.0.2",
     "eslint-plugin-flowtype": "^5.2.0",
     "eslint-plugin-import": "^2.22.0",
-    "eslint-plugin-jest": "^24.0.1",
+    "eslint-plugin-jest": "^24.0.2",
+    "eslint-plugin-jest-dom": "^3.2.3",
     "eslint-plugin-jsx-a11y": "^6.3.1",
     "eslint-plugin-react": "^7.20.6",
     "eslint-plugin-react-hooks": "^4.1.2",
+    "eslint-plugin-testing-library": "^3.9.0",
     "file-loader": "6.1.0",
     "fs-extra": "^9.0.0",
     "html-webpack-plugin": "4.4.1",