Update @metamask/eslint-config to v4.1.0 (#9663)

`@metamask/eslint-config` has been updated to v4.1.0. This update
requires that we update `eslint` to v7 as well, which in turn requires
updating most `eslint`-related packages.

Most notably, `babel-eslint` was replaced with `@babel/eslint-parser`,
and `babel-eslint-plugin` was replaced by `@babel/eslint-plugin`. This
required renaming all the `babel/*` rules to `@babel/*`.

Most new or updated rules that resulted in lint errors have been
temporarily disabled. They will be fixed and re-enabled in subsequent
PRs.

.eslintrc.js

@@ -1,6 +1,6 @@
 module.exports = {
   root: true,
-  parser: 'babel-eslint',
+  parser: '@babel/eslint-parser',
   parserOptions: {
     'sourceType': 'module',
     'ecmaVersion': 2017,
@@ -39,7 +39,7 @@ module.exports = {
   ],
 
   plugins: [
-    'babel',
+    '@babel',
     'react',
     'import',
   ],
@@ -82,10 +82,23 @@ module.exports = {
     }],
 
     'no-invalid-this': 'off',
-    'babel/no-invalid-this': 'error',
+    '@babel/no-invalid-this': 'error',
 
-    'babel/semi': ['error', 'never'],
+    '@babel/semi': ['error', 'never'],
     'mocha/no-setup-in-describe': 'off',
+    'node/no-process-env': 'off',
+
+    // TODO: re-enable these rules
+    'accessor-pairs': 'off',
+    'node/no-sync': 'off',
+    'node/no-deprecated-api': 'off',
+    'node/no-unpublished-import': 'off',
+    'node/no-unpublished-require': 'off',
+    'node/no-unsupported-features/node-builtins': 'off',
+    'node/no-path-concat': 'off',
+    'dot-notation': 'off',
+    'mocha/max-top-level-suites': 'off',
+    'node/no-callback-literal': 'off',
   },
 
   overrides: [{
@@ -108,7 +121,7 @@ module.exports = {
       'app/scripts/migrations/*.js',
     ],
     rules: {
-      'global-require': 'off',
+      'node/global-require': 'off',
     },
   }, {
     files: [
@@ -117,7 +130,7 @@ module.exports = {
     ],
     rules: {
       // Mocha will re-assign `this` in a test context
-      'babel/no-invalid-this': 'off',
+      '@babel/no-invalid-this': 'off',
     },
   }, {
     files: [
@@ -126,7 +139,8 @@ module.exports = {
       'test/helper.js',
     ],
     rules: {
-      'no-process-exit': 'off',
+      'node/no-process-exit': 'off',
+      'node/shebang': 'off',
     },
   }, {
     files: [

app/scripts/controllers/permissions/permissionsMethodMiddleware.js

@@ -111,7 +111,7 @@ export default function createPermissionsMethodMiddleware ({
     }
 
     // when this promise resolves, the response is on its way back
-    // eslint-disable-next-line callback-return
+    // eslint-disable-next-line node/callback-return
     await next()
 
     if (responseHandler) {

development/verify-locale-strings.js

@@ -97,7 +97,6 @@ async function getLocale (code) {
       log.error(`Error opening your locale ("${code}") file: `, e)
     }
     process.exit(1)
-    return undefined
   }
 }
 
@@ -112,7 +111,6 @@ async function writeLocale (code, locale) {
       log.error(`Error writing your locale ("${code}") file: `, e)
     }
     process.exit(1)
-    return undefined
   }
 }
 

package.json

@@ -175,7 +175,9 @@
     "web3-stream-provider": "^4.0.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.5.5",
+    "@babel/core": "^7.12.1",
+    "@babel/eslint-parser": "^7.12.1",
+    "@babel/eslint-plugin": "^7.12.1",
     "@babel/plugin-proposal-class-properties": "^7.5.5",
     "@babel/plugin-proposal-nullish-coalescing-operator": "^7.10.4",
     "@babel/plugin-proposal-object-rest-spread": "^7.5.5",
@@ -184,7 +186,7 @@
     "@babel/preset-env": "^7.5.5",
     "@babel/preset-react": "^7.0.0",
     "@babel/register": "^7.5.5",
-    "@metamask/eslint-config": "^3.2.0",
+    "@metamask/eslint-config": "^4.1.0",
     "@metamask/forwarder": "^1.1.0",
     "@metamask/test-dapp": "^3.1.0",
     "@sentry/cli": "^1.58.0",
@@ -197,7 +199,6 @@
     "@testing-library/react": "^10.4.8",
     "@testing-library/react-hooks": "^3.2.1",
     "addons-linter": "1.14.0",
-    "babel-eslint": "^10.1.0",
     "babel-loader": "^8.0.6",
     "babelify": "^10.0.0",
     "brfs": "^2.0.2",
@@ -217,11 +218,11 @@
     "envify": "^4.1.0",
     "enzyme": "^3.10.0",
     "enzyme-adapter-react-16": "^1.15.1",
-    "eslint": "^6.8.0",
-    "eslint-plugin-babel": "^5.3.0",
+    "eslint": "^7.7.0",
     "eslint-plugin-import": "^2.22.0",
-    "eslint-plugin-mocha": "^6.3.0",
-    "eslint-plugin-react": "^7.18.3",
+    "eslint-plugin-mocha": "^8.0.0",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-react": "~7.20.0",
     "eslint-plugin-react-hooks": "^4.0.4",
     "fancy-log": "^1.3.3",
     "fast-glob": "^3.2.2",

test/e2e/helpers.js

@@ -33,7 +33,7 @@ async function withFixtures (options, callback) {
     const { driver } = await buildWebDriver(driverOptions)
     webDriver = driver
 
-    // eslint-disable-next-line callback-return
+    // eslint-disable-next-line node/callback-return,node/no-callback-literal
     await callback({
       driver,
     })

test/helper.js

@@ -86,6 +86,6 @@ if (!window.crypto) {
   window.crypto = {}
 }
 if (!window.crypto.getRandomValues) {
-  // eslint-disable-next-line global-require
+  // eslint-disable-next-line node/global-require
   window.crypto.getRandomValues = require('polyfill-crypto.getrandomvalues')
 }

test/unit/actions/tx_test.js

@@ -29,7 +29,7 @@ describe('tx confirmation screen', function () {
     it('creates COMPLETED_TX with the cancelled transaction ID', async function () {
       actions._setBackgroundConnection({
         approveTransaction (_, cb) {
-          cb('An error!')
+          cb(new Error('An error!'))
         },
         cancelTransaction (_, cb) {
           cb()

ui/app/components/app/gas-customization/gas-price-chart/gas-price-chart.utils.js

@@ -124,7 +124,7 @@ export function setTickPosition (axis, n, newPosition, secondNewPosition) {
     .style('visibility', 'visible')
 }
 
-/* eslint-disable babel/no-invalid-this */
+/* eslint-disable @babel/no-invalid-this */
 export function appendOrUpdateCircle ({ data, itemIndex, cx, cy, cssId, appendOnly }) {
   const circle = this.main
     .select(`.c3-selected-circles${this.getTargetSelectorSuffix(data.id)}`)
@@ -145,7 +145,7 @@ export function appendOrUpdateCircle ({ data, itemIndex, cx, cy, cssId, appendOn
       .attr('cy', cy)
   }
 }
-/* eslint-enable babel/no-invalid-this */
+/* eslint-enable @babel/no-invalid-this */
 
 export function setSelectedCircle ({
   chart,