Upgrade ESLint to v8 (#162309)

Upgrade eslint from 7.32.0 to 8.46.0.

For details of breaking changes, see ESLint blog post, Migrate to v8.0.0:

https://eslint.org/docs/latest/use/migrate-to-8.0.0

For a full list of changes see their CHANGELOG.md:

https://github.com/eslint/eslint/blob/main/CHANGELOG.md

This also upgrades a bunch of ESLint plugins and related packages at the same time:

@types/eslint: 7.28.0 -> 8.44.2
eslint-config-prettier: 8.5.0 -> 9.0.0
eslint-module-utils: 2.6.2 -> 2.8.0
eslint-plugin-ban; 1.5.2 -> 1.6.0
eslint-plugin-cypress: 2.13.2 -> 2.14.0
eslint-plugin-import: 2.24.2 -> 2.28.0
eslint-plugin-jsx-a11y: 6.4.1 -> 6.7.1
eslint-plugin-mocha: 10.0.5 -> 10.1.0
eslint-plugin-no-unsanitized: 3.1.5 -> 4.0.2

package.json

@@ -1253,7 +1253,7 @@
     "@types/delete-empty": "^2.0.0",
     "@types/ejs": "^3.0.6",
     "@types/enzyme": "^3.10.12",
-    "@types/eslint": "^7.28.0",
+    "@types/eslint": "^8.44.2",
     "@types/express": "^4.17.13",
     "@types/extract-zip": "^1.6.2",
     "@types/faker": "^5.1.5",
@@ -1422,17 +1422,17 @@
     "ejs": "^3.1.8",
     "enzyme": "^3.11.0",
     "enzyme-to-json": "^3.6.2",
-    "eslint": "^7.32.0",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-module-utils": "^2.6.2",
-    "eslint-plugin-ban": "^1.5.2",
-    "eslint-plugin-cypress": "^2.13.2",
+    "eslint": "^8.46.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-module-utils": "^2.8.0",
+    "eslint-plugin-ban": "^1.6.0",
+    "eslint-plugin-cypress": "^2.14.0",
     "eslint-plugin-eslint-comments": "^3.2.0",
-    "eslint-plugin-import": "^2.24.2",
+    "eslint-plugin-import": "^2.28.0",
     "eslint-plugin-jest": "^27.2.3",
-    "eslint-plugin-jsx-a11y": "^6.4.1",
-    "eslint-plugin-mocha": "^10.0.5",
-    "eslint-plugin-no-unsanitized": "^3.1.5",
+    "eslint-plugin-jsx-a11y": "^6.7.1",
+    "eslint-plugin-mocha": "^10.1.0",
+    "eslint-plugin-no-unsanitized": "^4.0.2",
     "eslint-plugin-node": "^11.1.0",
     "eslint-plugin-prettier": "^4.0.0",
     "eslint-plugin-react": "^7.32.2",

src/dev/eslint/eslint_bin_path.ts

@@ -0,0 +1,15 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { join, dirname } from 'path';
+import { bin } from 'eslint/package.json';
+
+// Since eslint 8.0 we can't resolve `eslint/bin/eslint` directly since it's
+// not exported in the eslint package.json file. Instead we need to resolve it
+// using the following hack:
+export const eslintBinPath = join(dirname(require.resolve('eslint/package.json')), bin.eslint);

src/dev/eslint/index.ts

@@ -9,3 +9,4 @@
 export { pickFilesToLint } from './pick_files_to_lint';
 export { lintFiles } from './lint_files';
 export { runEslintWithTypes } from './run_eslint_with_types';
+export { eslintBinPath } from './eslint_bin_path';

src/dev/eslint/lint_files.ts

@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-import { CLIEngine } from 'eslint';
+import { ESLint } from 'eslint';
 
 import { REPO_ROOT } from '@kbn/repo-info';
 import { createFailError } from '@kbn/dev-cli-errors';
@@ -21,26 +21,39 @@ import { File } from '../file';
  * @param  {Array<File>} files
  * @return {undefined}
  */
-export function lintFiles(log: ToolingLog, files: File[], { fix }: { fix?: boolean } = {}) {
-  const cli = new CLIEngine({
+export async function lintFiles(log: ToolingLog, files: File[], { fix }: { fix?: boolean } = {}) {
+  const eslint = new ESLint({
     cache: true,
     cwd: REPO_ROOT,
     fix,
   });
 
   const paths = files.map((file) => file.getRelativePath());
-  const report = cli.executeOnFiles(paths);
+  const reports = await eslint.lintFiles(paths);
 
   if (fix) {
-    CLIEngine.outputFixes(report);
+    await ESLint.outputFixes(reports);
   }
 
-  if (report.errorCount || report.warningCount) {
-    log[report.errorCount ? 'error' : 'warning'](cli.getFormatter()(report.results));
-  }
+  let foundError = false;
+  let foundWarning = false;
+  reports.some((report) => {
+    if (report.errorCount !== 0) {
+      foundError = true;
+      return true;
+    } else if (report.warningCount !== 0) {
+      foundWarning = true;
+    }
+  });
+
+  if (foundError || foundWarning) {
+    const formatter = await eslint.loadFormatter();
+    const msg = await formatter.format(reports);
+    log[foundError ? 'error' : 'warning'](msg);
 
-  if (report.errorCount) {
-    throw createFailError(`[eslint] errors`);
+    if (foundError) {
+      throw createFailError(`[eslint] errors`);
+    }
   }
 
   log.success('[eslint] %d files linted successfully', files.length);

src/dev/eslint/pick_files_to_lint.ts

@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-import { CLIEngine } from 'eslint';
+import { ESLint } from 'eslint';
 
 import { ToolingLog } from '@kbn/tooling-log';
 import { File } from '../file';
@@ -18,22 +18,23 @@ import { File } from '../file';
  * @param  {Array<File>} files
  * @return {Array<File>}
  */
-export function pickFilesToLint(log: ToolingLog, files: File[]) {
-  const cli = new CLIEngine({});
+export async function pickFilesToLint(log: ToolingLog, files: File[]) {
+  const eslint = new ESLint();
+  const filesToLint = [];
 
-  return files.filter((file) => {
-    if (!file.isJs() && !file.isTypescript()) {
-      return;
-    }
+  for (const file of files) {
+    if (!file.isJs() && !file.isTypescript()) continue;
 
     const path = file.getRelativePath();
 
-    if (cli.isPathIgnored(path)) {
+    if (await eslint.isPathIgnored(path)) {
       log.warning(`[eslint] %j ignored by .eslintignore`, file);
-      return false;
+      continue;
     }
 
     log.debug('[eslint] linting %j', file);
-    return true;
-  });
+    filesToLint.push(file);
+  }
+
+  return filesToLint;
 }

src/dev/eslint/run_eslint_with_types.ts

@@ -20,10 +20,11 @@ import { REPO_ROOT } from '@kbn/repo-info';
 
 import { TS_PROJECTS, type TsProject } from '@kbn/ts-projects';
 
+import { eslintBinPath } from './eslint_bin_path';
+
 export function runEslintWithTypes() {
   run(
     async ({ log, flags }) => {
-      const eslintPath = require.resolve('eslint/bin/eslint');
       const ignoreFilePath = Path.resolve(REPO_ROOT, '.eslintignore');
       const configTemplate = Fs.readFileSync(
         Path.resolve(__dirname, 'types.eslint.config.template.js'),
@@ -77,7 +78,7 @@ export function runEslintWithTypes() {
             const proc = await execa(
               process.execPath,
               [
-                Path.relative(project.directory, eslintPath),
+                Path.relative(project.directory, eslintBinPath),
                 ...(project.config.include ?? []).map((p) =>
                   p.endsWith('*') ? `${p}.{ts,tsx}` : p
                 ),

src/dev/run_eslint.js

@@ -6,7 +6,9 @@
  * Side Public License, v 1.
  */
 
-import { parse } from 'eslint/lib/options';
+import yargs from 'yargs';
+
+import { eslintBinPath } from './eslint';
 
 let quiet = true;
 if (process.argv.includes('--no-quiet')) {
@@ -15,7 +17,7 @@ if (process.argv.includes('--no-quiet')) {
   process.argv.push('--quiet');
 }
 
-const options = parse(process.argv);
+const options = yargs(process.argv).argv;
 process.env.KIBANA_RESOLVER_HARD_CACHE = 'true';
 
 if (!options._.length && !options.printConfig) {
@@ -31,7 +33,7 @@ if (!process.argv.includes('--ext')) {
 }
 
 // common-js is required so that logic before this executes before loading eslint
-require('eslint/bin/eslint');
+require(eslintBinPath); // eslint-disable-line import/no-dynamic-require
 
 if (quiet) {
   process.on('exit', (code) => {

src/dev/run_precommit_hook.js

@@ -43,7 +43,7 @@ run(
     }
 
     for (const Linter of [Eslint, Stylelint]) {
-      const filesToLint = Linter.pickFilesToLint(log, files);
+      const filesToLint = await Linter.pickFilesToLint(log, files);
       if (filesToLint.length > 0) {
         try {
           await Linter.lintFiles(log, filesToLint, {

src/plugins/interactive_setup/public/app.tsx

@@ -15,13 +15,13 @@ import useAsync from 'react-use/lib/useAsync';
 
 import { FormattedMessage } from '@kbn/i18n-react';
 
-import type { StatusResult } from '../common';
 import { ClusterAddressForm } from './cluster_address_form';
 import type { ClusterConfigurationFormProps } from './cluster_configuration_form';
 import { ClusterConfigurationForm } from './cluster_configuration_form';
 import { EnrollmentTokenForm } from './enrollment_token_form';
 import { ProgressIndicator } from './progress_indicator';
 import { useKibana } from './use_kibana';
+import type { StatusResult } from '../common';
 
 export interface AppProps {
   onSuccess?(): void;

src/plugins/interactive_setup/public/cluster_address_form.tsx

@@ -22,11 +22,11 @@ import React from 'react';
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n-react';
 
-import type { PingResult } from '../common';
 import { SubmitErrorCallout } from './submit_error_callout';
 import type { ValidationErrors } from './use_form';
 import { useForm } from './use_form';
 import { useKibana } from './use_kibana';
+import type { PingResult } from '../common';
 
 export interface ClusterAddressFormValues {
   host: string;

src/plugins/interactive_setup/public/cluster_configuration_form.tsx

@@ -40,7 +40,6 @@ import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n-react';
 import { euiThemeVars } from '@kbn/ui-theme';
 
-import type { Certificate } from '../common';
 import { DocLink } from './doc_link';
 import { getCommandLineSnippet } from './get_command_line_snippet';
 import { SubmitErrorCallout } from './submit_error_callout';
@@ -51,6 +50,7 @@ import { useHtmlId } from './use_html_id';
 import { useKibana } from './use_kibana';
 import { useVerification } from './use_verification';
 import { useVisibility } from './use_visibility';
+import type { Certificate } from '../common';
 
 export interface ClusterConfigurationFormValues {
   username: string;

src/plugins/interactive_setup/public/enrollment_token_form.test.tsx

@@ -11,9 +11,9 @@ import React from 'react';
 
 import { coreMock, themeServiceMock } from '@kbn/core/public/mocks';
 
-import type { EnrollmentToken } from '../common';
 import { decodeEnrollmentToken, EnrollmentTokenForm } from './enrollment_token_form';
 import { Providers } from './plugin';
+import type { EnrollmentToken } from '../common';
 
 jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => ({
   htmlIdGenerator: () => () => `id-${Math.random()}`,

src/plugins/interactive_setup/public/enrollment_token_form.tsx

@@ -28,7 +28,6 @@ import useUpdateEffect from 'react-use/lib/useUpdateEffect';
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n-react';
 
-import type { EnrollmentToken } from '../common';
 import { DocLink } from './doc_link';
 import { getCommandLineSnippet } from './get_command_line_snippet';
 import { SubmitErrorCallout } from './submit_error_callout';
@@ -38,6 +37,7 @@ import { useForm } from './use_form';
 import { useKibana } from './use_kibana';
 import { useVerification } from './use_verification';
 import { useVisibility } from './use_visibility';
+import type { EnrollmentToken } from '../common';
 
 export interface EnrollmentTokenFormValues {
   token: string;

src/plugins/interactive_setup/public/submit_error_callout.test.tsx

@@ -10,6 +10,7 @@ import { errors } from '@elastic/elasticsearch';
 import { shallow } from 'enzyme';
 import React from 'react';
 
+import { SubmitErrorCallout } from './submit_error_callout';
 import {
   ERROR_CONFIGURE_FAILURE,
   ERROR_ELASTICSEARCH_CONNECTION_CONFIGURED,
@@ -20,7 +21,6 @@ import {
   ERROR_PING_FAILURE,
 } from '../common';
 import { interactiveSetupMock } from '../server/mocks';
-import { SubmitErrorCallout } from './submit_error_callout';
 
 describe('SubmitErrorCallout', () => {
   it('renders unknown errors correctly', async () => {

src/plugins/interactive_setup/public/verification_code_form.tsx

@@ -22,13 +22,13 @@ import type { IHttpFetchError, ResponseErrorBody } from '@kbn/core-http-browser'
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n-react';
 
-import { VERIFICATION_CODE_LENGTH } from '../common';
 import { getCommandLineSnippet } from './get_command_line_snippet';
 import { SingleCharsField } from './single_chars_field';
 import { SubmitErrorCallout } from './submit_error_callout';
 import type { ValidationErrors } from './use_form';
 import { useForm } from './use_form';
 import { useKibana } from './use_kibana';
+import { VERIFICATION_CODE_LENGTH } from '../common';
 
 export interface VerificationCodeFormValues {
   code: string;

src/plugins/interactive_setup/server/elasticsearch_service.test.ts

@@ -15,11 +15,11 @@ import type { NodesVersionCompatibility } from '@kbn/core/server';
 import { elasticsearchServiceMock, loggingSystemMock } from '@kbn/core/server/mocks';
 import { nextTick } from '@kbn/test-jest-helpers';
 
-import { ElasticsearchConnectionStatus } from '../common';
 import { ConfigSchema } from './config';
 import type { ElasticsearchServiceSetup } from './elasticsearch_service';
 import { ElasticsearchService } from './elasticsearch_service';
 import { interactiveSetupMock } from './mocks';
+import { ElasticsearchConnectionStatus } from '../common';
 
 jest.mock('tls');
 jest.mock('@kbn/core/server', () => ({

src/plugins/interactive_setup/server/elasticsearch_service.ts

@@ -30,10 +30,10 @@ import type {
 } from '@kbn/core/server';
 import { pollEsNodesVersion } from '@kbn/core/server';
 
-import { ElasticsearchConnectionStatus } from '../common';
-import type { Certificate, PingResult } from '../common';
 import { CompatibilityError } from './compatibility_error';
 import { getDetailedErrorMessage, getErrorStatusCode } from './errors';
+import { ElasticsearchConnectionStatus } from '../common';
+import type { Certificate, PingResult } from '../common';
 
 export interface EnrollParameters {
   apiKey: string;

src/plugins/interactive_setup/server/plugin.ts

@@ -18,12 +18,12 @@ import type {
 } from '@kbn/core/server';
 import { getDataPath } from '@kbn/utils';
 
-import { ElasticsearchConnectionStatus } from '../common';
 import type { ConfigSchema, ConfigType } from './config';
 import { ElasticsearchService } from './elasticsearch_service';
 import { KibanaConfigWriter } from './kibana_config_writer';
 import { defineRoutes } from './routes';
 import { VerificationService } from './verification_service';
+import { ElasticsearchConnectionStatus } from '../common';
 
 // List of the Elasticsearch hosts Kibana uses by default.
 const DEFAULT_ELASTICSEARCH_HOSTS = [

src/plugins/interactive_setup/server/routes/configure.test.ts

@@ -13,6 +13,8 @@ import type { IRouter, RequestHandler, RequestHandlerContext, RouteConfig } from
 import { kibanaResponseFactory } from '@kbn/core/server';
 import { httpServerMock } from '@kbn/core/server/mocks';
 
+import { defineConfigureRoute } from './configure';
+import { routeDefinitionParamsMock } from './index.mock';
 import {
   ElasticsearchConnectionStatus,
   ERROR_CONFIGURE_FAILURE,
@@ -22,8 +24,6 @@ import {
   ERROR_OUTSIDE_PREBOOT_STAGE,
 } from '../../common';
 import { interactiveSetupMock } from '../mocks';
-import { defineConfigureRoute } from './configure';
-import { routeDefinitionParamsMock } from './index.mock';
 
 describe('Configure routes', () => {
   let router: jest.Mocked<IRouter>;

src/plugins/interactive_setup/server/routes/enroll.test.ts

@@ -13,6 +13,8 @@ import type { IRouter, RequestHandler, RequestHandlerContext, RouteConfig } from
 import { kibanaResponseFactory } from '@kbn/core/server';
 import { httpServerMock } from '@kbn/core/server/mocks';
 
+import { defineEnrollRoutes } from './enroll';
+import { routeDefinitionParamsMock } from './index.mock';
 import {
   ElasticsearchConnectionStatus,
   ERROR_ELASTICSEARCH_CONNECTION_CONFIGURED,
@@ -22,8 +24,6 @@ import {
   ERROR_OUTSIDE_PREBOOT_STAGE,
 } from '../../common';
 import { interactiveSetupMock } from '../mocks';
-import { defineEnrollRoutes } from './enroll';
-import { routeDefinitionParamsMock } from './index.mock';
 
 describe('Enroll routes', () => {
   let router: jest.Mocked<IRouter>;