chrome: update eslint 9 (#34666)

.eslintignore

@@ -1,18 +0,0 @@
-test/assets/modernizr.js
-/tests/third_party/
-/packages/*/lib/
-*.js
-/packages/playwright-core/src/generated/*
-/packages/playwright-core/src/third_party/
-/packages/playwright-core/types/*
-/packages/playwright-ct-core/src/generated/*
-/index.d.ts
-node_modules/
-**/*.d.ts
-output/
-test-results/
-/tests/components/
-/tests/installation/fixture-scripts/
-DEPS
-.cache/
-/utils/

.eslintrc-with-ts-config.js

@@ -1,15 +0,0 @@
-module.exports = {
-  extends: "./.eslintrc.js",
-  parserOptions: {
-    ecmaVersion: 9,
-    sourceType: "module",
-    project: "./tsconfig.json",
-  },
-  rules: {
-    "@typescript-eslint/no-base-to-string": "error",
-    "@typescript-eslint/no-unnecessary-boolean-literal-compare": 2,
-  },
-  parserOptions: {
-    project: "./tsconfig.json"
-  },
-};

.eslintrc.js

@@ -1,137 +0,0 @@
-module.exports = {
-    parser: "@typescript-eslint/parser",
-    plugins: ["@typescript-eslint", "notice"],
-    parserOptions: {
-      ecmaVersion: 9,
-      sourceType: "module",
-    },
-    extends: [
-      "plugin:react/recommended",
-      "plugin:react-hooks/recommended"
-    ],
-
-    settings: {
-        react: { version: "18" }
-    },
-
-    /**
-     * ESLint rules
-     *
-     * All available rules: http://eslint.org/docs/rules/
-     *
-     * Rules take the following form:
-     *   "rule-name", [severity, { opts }]
-     * Severity: 2 == error, 1 == warning, 0 == off.
-     */
-    rules: {
-        "@typescript-eslint/no-unused-vars": [2, {args: "none"}],
-        "@typescript-eslint/consistent-type-imports": [2, {disallowTypeAnnotations: false}],
-        /**
-         * Enforced rules
-         */
-        // syntax preferences
-        "object-curly-spacing": ["error", "always"],
-        "quotes": [2, "single", {
-            "avoidEscape": true,
-            "allowTemplateLiterals": true
-        }],
-        "jsx-quotes": [2, "prefer-single"],
-        "no-extra-semi": 2,
-        "@typescript-eslint/semi": [2],
-        "comma-style": [2, "last"],
-        "wrap-iife": [2, "inside"],
-        "spaced-comment": [2, "always", {
-            "markers": ["*"]
-        }],
-        "eqeqeq": [2],
-        "accessor-pairs": [2, {
-            "getWithoutSet": false,
-            "setWithoutGet": false
-        }],
-        "brace-style": [2, "1tbs", {"allowSingleLine": true}],
-        "curly": [2, "multi-or-nest", "consistent"],
-        "new-parens": 2,
-        "arrow-parens": [2, "as-needed"],
-        "prefer-const": 2,
-        "quote-props": [2, "consistent"],
-        "nonblock-statement-body-position": [2, "below"],
-
-        // anti-patterns
-        "no-var": 2,
-        "no-with": 2,
-        "no-multi-str": 2,
-        "no-caller": 2,
-        "no-implied-eval": 2,
-        "no-labels": 2,
-        "no-new-object": 2,
-        "no-octal-escape": 2,
-        "no-self-compare": 2,
-        "no-shadow-restricted-names": 2,
-        "no-cond-assign": 2,
-        "no-debugger": 2,
-        "no-dupe-keys": 2,
-        "no-duplicate-case": 2,
-        "no-empty-character-class": 2,
-        "no-unreachable": 2,
-        "no-unsafe-negation": 2,
-        "radix": 2,
-        "valid-typeof": 2,
-        "no-implicit-globals": [2],
-        "no-unused-expressions": [2, { "allowShortCircuit": true, "allowTernary": true, "allowTaggedTemplates": true}],
-        "no-proto": 2,
-
-        // es2015 features
-        "require-yield": 2,
-        "template-curly-spacing": [2, "never"],
-
-        // spacing details
-        "space-infix-ops": 2,
-        "space-in-parens": [2, "never"],
-        "array-bracket-spacing": [2, "never"],
-        "comma-spacing": [2, { "before": false, "after": true }],
-        "keyword-spacing": [2, "always"],
-        "space-before-function-paren": [2, {
-            "anonymous": "never",
-            "named": "never",
-            "asyncArrow": "always"
-        }],
-        "no-whitespace-before-property": 2,
-        "keyword-spacing": [2, {
-            "overrides": {
-                "if": {"after": true},
-                "else": {"after": true},
-                "for": {"after": true},
-                "while": {"after": true},
-                "do": {"after": true},
-                "switch": {"after": true},
-                "return": {"after": true}
-            }
-        }],
-        "arrow-spacing": [2, {
-            "after": true,
-            "before": true
-        }],
-        "@typescript-eslint/func-call-spacing": 2,
-        "@typescript-eslint/type-annotation-spacing": 2,
-
-        // file whitespace
-        "no-multiple-empty-lines": [2, {"max": 2, "maxEOF": 0}],
-        "no-mixed-spaces-and-tabs": 2,
-        "no-trailing-spaces": 2,
-        "linebreak-style": [ process.platform === "win32" ? 0 : 2, "unix" ],
-        "indent": [2, 2, { "SwitchCase": 1, "CallExpression": {"arguments": 2}, "MemberExpression": 2 }],
-        "key-spacing": [2, {
-            "beforeColon": false
-        }],
-        "eol-last": 2,
-
-        // copyright
-        "notice/notice": [2, {
-            "mustMatch": "Copyright",
-            "templateFile": require("path").join(__dirname, "utils", "copyright.js"),
-        }],
-
-        // react
-        "react/react-in-jsx-scope": 0
-    }
-};

eslint-react.config.mjs

@@ -0,0 +1,95 @@
+/**
+ * Copyright (c) Microsoft Corporation.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { fixupConfigRules } from '@eslint/compat';
+import { FlatCompat } from '@eslint/eslintrc';
+import js from '@eslint/js';
+import typescriptEslint from '@typescript-eslint/eslint-plugin';
+import tsParser from '@typescript-eslint/parser';
+import notice from 'eslint-plugin-notice';
+import path from 'path';
+import { fileURLToPath } from 'url';
+import stylistic from '@stylistic/eslint-plugin';
+import { baseRules } from './eslint.config.mjs';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all
+});
+
+const baseConfig = fixupConfigRules(compat.extends('plugin:react/recommended', 'plugin:react-hooks/recommended'));
+
+const plugins = {
+  '@stylistic': stylistic,
+  '@typescript-eslint': typescriptEslint,
+  notice,
+};
+
+const ignores = [
+  '.github/',
+  '*.js',
+  '**/.cache/',
+  '**/*.d.ts',
+  '**/dist/**',
+  'index.d.ts',
+  'node_modules/',
+  'output/',
+  'packages/*/lib/',
+  'test-results/',
+  'tests/',
+  'utils/',
+];
+
+export default [
+  { ignores },
+  { 
+    plugins,
+    settings: {
+      react: { version: 'detect' },
+    }
+  },
+  ...baseConfig,
+  packageSection('html-reporter'),
+  packageSection('recorder'),
+  packageSection('trace-viewer'),
+];
+
+function packageSection(packageName) {
+  return {
+    files: [
+      `packages/${packageName}/src/**/*.ts`,
+      `packages/${packageName}/src/**/*.tsx`,
+      `packages/web/src/**/*.ts`,
+      `packages/web/src/**/*.tsx`,
+    ],
+    languageOptions: {
+      parser: tsParser,
+      ecmaVersion: 9,
+      sourceType: 'module',
+      parserOptions: {
+        project: path.join(__dirname, 'packages', packageName, 'tsconfig.json'),
+      },
+    },
+    rules: {
+      ...baseRules,
+      'no-console': 2,
+    }
+  };
+}

eslint.config.mjs

@@ -0,0 +1,252 @@
+/**
+ * Copyright (c) Microsoft Corporation.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import typescriptEslint from '@typescript-eslint/eslint-plugin';
+import tsParser from '@typescript-eslint/parser';
+import notice from 'eslint-plugin-notice';
+import path from 'path';
+import { fileURLToPath } from 'url';
+import stylistic from '@stylistic/eslint-plugin';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+const plugins = {
+  '@stylistic': stylistic,
+  '@typescript-eslint': typescriptEslint,
+  notice,
+};
+
+const ignores = [
+  '.github/',
+  '*.js',
+  '**/.cache/',
+  '**/*.d.ts',
+  'index.d.ts',
+  'node_modules/',
+  'output/',
+  'packages/*/lib/',
+  'packages/html-reporter/**',
+  'packages/playwright-core/src/generated/*',
+  'packages/playwright-core/src/third_party/',
+  'packages/playwright-core/types/*',
+  'packages/playwright-ct-core/src/generated/*',
+  'packages/recorder/**',
+  'packages/trace-viewer/**',
+  'packages/web/**',
+  'test-results/',
+  'tests/assets/',
+  'tests/components/',
+  'tests/installation/fixture-scripts/',
+  'tests/third_party/',
+  'utils/',
+];
+
+export const baseRules = {
+  '@typescript-eslint/no-unused-vars': [2, { args: 'none', caughtErrors: 'none' }],
+  '@typescript-eslint/consistent-type-imports': [2, { disallowTypeAnnotations: false }],
+  /**
+   * Enforced rules
+   */
+  // syntax preferences
+  'object-curly-spacing': ['error', 'always'],
+  'quotes': [2, 'single', {
+    'avoidEscape': true,
+    'allowTemplateLiterals': true
+  }],
+  'jsx-quotes': [2, 'prefer-single'],
+  'no-extra-semi': 2,
+  '@stylistic/semi': [2],
+  'comma-style': [2, 'last'],
+  'wrap-iife': [2, 'inside'],
+  'spaced-comment': [2, 'always', {
+    'markers': ['*']
+  }],
+  'eqeqeq': [2],
+  'accessor-pairs': [2, {
+    'getWithoutSet': false,
+    'setWithoutGet': false
+  }],
+  'brace-style': [2, '1tbs', { 'allowSingleLine': true }],
+  'curly': [2, 'multi-or-nest', 'consistent'],
+  'new-parens': 2,
+  'arrow-parens': [2, 'as-needed'],
+  'prefer-const': 2,
+  'quote-props': [2, 'consistent'],
+  'nonblock-statement-body-position': [2, 'below'],
+
+  // anti-patterns
+  'no-var': 2,
+  'no-with': 2,
+  'no-multi-str': 2,
+  'no-caller': 2,
+  'no-implied-eval': 2,
+  'no-labels': 2,
+  'no-new-object': 2,
+  'no-octal-escape': 2,
+  'no-self-compare': 2,
+  'no-shadow-restricted-names': 2,
+  'no-cond-assign': 2,
+  'no-debugger': 2,
+  'no-dupe-keys': 2,
+  'no-duplicate-case': 2,
+  'no-empty-character-class': 2,
+  'no-unreachable': 2,
+  'no-unsafe-negation': 2,
+  'radix': 2,
+  'valid-typeof': 2,
+  'no-implicit-globals': [2],
+  'no-unused-expressions': [2, { 'allowShortCircuit': true, 'allowTernary': true, 'allowTaggedTemplates': true }],
+  'no-proto': 2,
+
+  // es2015 features
+  'require-yield': 2,
+  'template-curly-spacing': [2, 'never'],
+
+  // spacing details
+  'space-infix-ops': 2,
+  'space-in-parens': [2, 'never'],
+  'array-bracket-spacing': [2, 'never'],
+  'comma-spacing': [2, { 'before': false, 'after': true }],
+  'keyword-spacing': [2, 'always'],
+  'space-before-function-paren': [2, {
+    'anonymous': 'never',
+    'named': 'never',
+    'asyncArrow': 'always'
+  }],
+  'no-whitespace-before-property': 2,
+  'keyword-spacing': [2, {
+    'overrides': {
+      'if': { 'after': true },
+      'else': { 'after': true },
+      'for': { 'after': true },
+      'while': { 'after': true },
+      'do': { 'after': true },
+      'switch': { 'after': true },
+      'return': { 'after': true }
+    }
+  }],
+  'arrow-spacing': [2, {
+    'after': true,
+    'before': true
+  }],
+  '@stylistic/func-call-spacing': 2,
+  '@stylistic/type-annotation-spacing': 2,
+
+  // file whitespace
+  'no-multiple-empty-lines': [2, { 'max': 2, 'maxEOF': 0 }],
+  'no-mixed-spaces-and-tabs': 2,
+  'no-trailing-spaces': 2,
+  'linebreak-style': [process.platform === 'win32' ? 0 : 2, 'unix'],
+  'indent': [2, 2, { 'SwitchCase': 1, 'CallExpression': { 'arguments': 2 }, 'MemberExpression': 2 }],
+  'key-spacing': [2, {
+    'beforeColon': false
+  }],
+  'eol-last': 2,
+
+  // copyright
+  'notice/notice': [2, {
+    'mustMatch': 'Copyright',
+    'templateFile': path.join(__dirname, 'utils', 'copyright.js'),
+  }],
+
+  // react
+  'react/react-in-jsx-scope': 0
+};
+
+const noFloatingPromisesRules = {
+  '@typescript-eslint/no-floating-promises': 'error',
+};
+
+const noBooleanCompareRules = {
+  '@typescript-eslint/no-unnecessary-boolean-literal-compare': 2,
+};
+
+const noRestrictedGlobalsRules = {
+  'no-restricted-globals': [
+    'error',
+    { 'name': 'window' },
+    { 'name': 'document' },
+    { 'name': 'globalThis' },
+  ],
+};
+
+const languageOptions = {
+  parser: tsParser,
+  ecmaVersion: 9,
+  sourceType: 'module',
+};
+
+const languageOptionsWithTsConfig = {
+  parser: tsParser,
+  ecmaVersion: 9,
+  sourceType: 'module',
+  parserOptions: {
+    project: path.join(__dirname, 'tsconfig.json'),
+  },
+};
+
+export default [{
+  ignores,
+}, {
+  files: ['**/*.ts'],
+  plugins,
+  languageOptions,
+  rules: baseRules,
+}, {
+  files: ['packages/**/*.ts'],
+  languageOptions: languageOptionsWithTsConfig,
+  rules: {
+    'no-console': 2,
+    'no-restricted-properties': [2, {
+      'object': 'process',
+      'property': 'exit',
+      'message': 'Please use gracefullyProcessExitDoNotHang function to exit the process.',
+    }],
+  }
+}, {
+  files: ['packages/playwright/**/*.ts'],
+  rules: {
+    ...noFloatingPromisesRules,
+  }
+}, {
+  files: ['packages/playwright/src/reporters/**/*.ts'],
+  languageOptions: languageOptionsWithTsConfig,
+  rules: {
+    'no-console': 'off'
+  }
+}, {
+  files: ['packages/playwright-core/src/server/injected/**/*.ts'],
+  languageOptions: languageOptionsWithTsConfig,
+  rules: {
+    ...noRestrictedGlobalsRules,
+    ...noFloatingPromisesRules,
+    ...noBooleanCompareRules,
+  }
+}, {
+  files: ['tests/**/*.spec.js', 'tests/**/*.ts'],
+  languageOptions: {
+    parser: tsParser,
+    ecmaVersion: 9,
+    sourceType: 'module',
+    parserOptions: {
+      project: path.join(__dirname, 'tests', 'tsconfig.json'),
+    },
+  },
+  rules: {
+    ...noFloatingPromisesRules,
+  }
+}];

package.json

@@ -30,7 +30,7 @@
     "ttest": "node ./tests/playwright-test/stable-test-runner/node_modules/@playwright/test/cli test --config=tests/playwright-test/playwright.config.ts",
     "ct": "playwright test tests/components/test-all.spec.js --reporter=list",
     "test": "playwright test --config=tests/library/playwright.config.ts",
-    "eslint": "eslint --cache --report-unused-disable-directives --ext ts,tsx,js,jsx,mjs .",
+    "eslint": "eslint --cache && eslint -c eslint-react.config.mjs",
     "tsc": "tsc -p . && tsc -p packages/html-reporter/",
     "build-installer": "babel -s --extensions \".ts\" --out-dir packages/playwright-core/lib/utils/ packages/playwright-core/src/utils",
     "doc": "node utils/doclint/cli.js",
@@ -62,6 +62,10 @@
     "@babel/plugin-transform-optional-chaining": "^7.23.4",
     "@babel/plugin-transform-typescript": "^7.23.6",
     "@babel/preset-react": "^7.23.3",
+    "@eslint/compat": "^1.2.6",
+    "@eslint/eslintrc": "^3.2.0",
+    "@eslint/js": "^9.19.0",
+    "@stylistic/eslint-plugin": "^3.0.1",
     "@types/babel__core": "^7.20.2",
     "@types/codemirror": "^5.60.7",
     "@types/formidable": "^2.0.4",
@@ -71,9 +75,9 @@
     "@types/react-dom": "^18.0.5",
     "@types/ws": "^8.5.3",
     "@types/xml2js": "^0.4.9",
-    "@typescript-eslint/eslint-plugin": "^7.15.0",
+    "@typescript-eslint/eslint-plugin": "^8.23.0",
-    "@typescript-eslint/parser": "^7.15.0",
+    "@typescript-eslint/parser": "^8.23.0",
-    "@typescript-eslint/utils": "^7.15.0",
+    "@typescript-eslint/utils": "^8.23.0",
     "@vitejs/plugin-basic-ssl": "^1.1.0",
     "@vitejs/plugin-react": "^4.2.1",
     "@zip.js/zip.js": "^2.7.29",
@@ -86,10 +90,10 @@
     "dotenv": "^16.4.5",
     "electron": "^30.1.2",
     "esbuild": "^0.18.11",
-    "eslint": "^8.55.0",
+    "eslint": "^9.19.0",
-    "eslint-plugin-notice": "^0.9.10",
+    "eslint-plugin-notice": "^1.0.0",
-    "eslint-plugin-react": "^7.35.0",
+    "eslint-plugin-react": "^7.37.4",
-    "eslint-plugin-react-hooks": "^4.6.2",
+    "eslint-plugin-react-hooks": "^5.1.0",
     "formidable": "^2.1.1",
     "immutable": "^4.3.7",
     "license-checker": "^25.0.1",
@@ -98,7 +102,7 @@
     "react": "^18.1.0",
     "react-dom": "^18.1.0",
     "ssim.js": "^3.5.0",
-    "typescript": "^5.7.2",
+    "typescript": "^5.7.3",
     "vite": "^5.4.14",
     "ws": "^8.17.1",
     "xml2js": "^0.5.0",

packages/.eslintrc.js

@@ -1,21 +0,0 @@
-module.exports = {
-  "extends": "../.eslintrc.js",
-  /**
-   * ESLint rules
-   *
-   * All available rules: http://eslint.org/docs/rules/
-   *
-   * Rules take the following form:
-   *   "rule-name", [severity, { opts }]
-   * Severity: 2 == error, 1 == warning, 0 == off.
-   */
-  "rules": {
-    "no-console": 2,
-    "no-debugger": 2,
-    "no-restricted-properties": [2, {
-      "object": "process",
-      "property": "exit",
-      "message": "Please use gracefullyProcessExitDoNotHang function to exit the process.",
-    }],
-  }
-};

packages/html-reporter/tsconfig.json

@@ -20,11 +20,12 @@
       "@protocol/*": ["../protocol/src/*"],
       "@web/*": ["../web/src/*"],
       "@playwright/*": ["../playwright/src/*"],
+      "@recorder/*": ["../recorder/src/*"],
       "@testIsomorphic/*": ["../playwright/src/isomorphic/*"],
       "playwright-core/lib/*": ["../playwright-core/src/*"],
       "playwright/lib/*": ["../playwright/src/*"],
     }
   },
-  "include": ["src"],
+  "include": ["src", "../web/src"],
   "references": [{ "path": "./tsconfig.node.json" }]
 }

packages/playwright-core/.eslintrc.js

@@ -1,3 +0,0 @@
-module.exports = {
-  extends: "../../.eslintrc-with-ts-config.js",
-};

packages/playwright-core/index.js

@@ -19,7 +19,6 @@ const semver = currentNodeVersion.split('.');
 const [major] = [+semver[0]];
 
 if (major < minimumMajorNodeVersion) {
-  // eslint-disable-next-line no-console
   console.error(
       'You are running Node.js ' +
       currentNodeVersion +

packages/playwright-core/src/server/injected/.eslintrc.js

@@ -1,21 +0,0 @@
-const path = require('path');
-
-module.exports = {
-  parser: "@typescript-eslint/parser",
-  plugins: ["@typescript-eslint", "notice"],
-  parserOptions: {
-    ecmaVersion: 9,
-    sourceType: "module",
-    project: path.join(__dirname, '../../../../../tsconfig.json'),
-  },
-  rules: {
-    "no-restricted-globals": [
-        "error",
-        { "name": "window" },
-        { "name": "document" },
-        { "name": "globalThis" },
-    ],
-    '@typescript-eslint/no-floating-promises': 'error',
-    "@typescript-eslint/no-unnecessary-boolean-literal-compare": 2,
-  },
-};

packages/playwright-ct-core/.eslintrc.js

@@ -1,3 +0,0 @@
-module.exports = {
-  extends: "../../.eslintrc-with-ts-config.js",
-};

packages/playwright/.eslintrc.js

@@ -1,6 +0,0 @@
-module.exports = {
-  extends: '../../.eslintrc-with-ts-config.js',
-  rules: {
-    '@typescript-eslint/no-floating-promises': 'error',
-  },
-};

packages/playwright/src/reporters/.eslintrc.json

@@ -1,5 +0,0 @@
-{
-    "rules": {
-        "no-console": "off"
-    }
-}

packages/recorder/tsconfig.json

@@ -23,6 +23,6 @@
       "@web/*": ["../web/src/*"],
     }
   },
-  "include": ["src"],
+  "include": ["src", "../web/src"],
   "references": [{ "path": "./tsconfig.node.json" }]
 }

packages/trace-viewer/tsconfig.json

@@ -30,6 +30,6 @@
     },
     "useUnknownInCatchVariables": false,
   },
-  "include": ["src"],
+  "include": ["src", "../web/src"],
   "references": [{ "path": "./tsconfig.node.json" }]
 }

tests/.eslintrc.js

@@ -1,16 +0,0 @@
-const path = require('path');
-
-module.exports = {
-  extends: '../.eslintrc.js',
-  parser: "@typescript-eslint/parser",
-  plugins: ["@typescript-eslint", "notice"],
-  parserOptions: {
-    ecmaVersion: 9,
-    sourceType: "module",
-    project: path.join(__dirname, 'tsconfig.json'),
-  },
-  rules: {
-    '@typescript-eslint/no-floating-promises': 'error',
-    "@typescript-eslint/no-unnecessary-boolean-literal-compare": 2,
-  },
-};

tests/assets/es6/.eslintrc

@@ -1,5 +0,0 @@
-{
-    "parserOptions": {
-        "sourceType": "module"
-    }
-}

utils/doclint/linting-code-snippets/cli.js

@@ -137,29 +137,55 @@ class JSLintingService extends LintingService {
     'vue-router',
     'experimental-ct',
   ];
-  constructor() {
+
-    super();
+  async _init() {
-    this.eslint = new ESLint({
+    if (this._eslint)
-      overrideConfigFile: path.join(PROJECT_DIR, '.eslintrc.js'),
+      return this._eslint;
-      useEslintrc: false,
+
+    const { fixupConfigRules } = await import('@eslint/compat');
+    const { FlatCompat }  = await import('@eslint/eslintrc');
       // @ts-ignore
+    const js = (await import('@eslint/js')).default;
+
+    const compat = new FlatCompat({
+      baseDirectory: __dirname,
+      // @ts-ignore
+      recommendedConfig: js.configs.recommended,
+      allConfig: js.configs.all
+    });
+    const baseConfig = fixupConfigRules(compat.extends('plugin:react/recommended', 'plugin:@typescript-eslint/disable-type-checked'));
+    const { baseRules }= await import('../../../eslint.config.mjs');
+
+    this._eslint = new ESLint({
+      baseConfig,
+      plugins: /** @type {any}*/({
+        '@stylistic': (await import('@stylistic/eslint-plugin')).default,
+        'notice': await import('eslint-plugin-notice'),
+      }),
+      ignore: false,
       overrideConfig: {
-        plugins: ['react'],
+        files: ['**/*.ts', '**/*.tsx'],
         settings: {
-          react: { version: 'detect', }
+          react: { version: 'detect' },
         },
-        extends: [
+        languageOptions: {
-          'plugin:react/recommended',
+          // @ts-ignore
-        ],
+          parser: await import('@typescript-eslint/parser'),
-        rules: {
+          ecmaVersion: 'latest',
+          sourceType: 'module',
+        },
+        rules: /** @type {any}*/({
+          ...baseRules,
           'notice/notice': 'off',
           '@typescript-eslint/no-unused-vars': 'off',
           'max-len': ['error', { code: 100 }],
           'react/react-in-jsx-scope': 'off',
           'eol-last': 'off',
-        },
+          '@typescript-eslint/consistent-type-imports': 'off',
+        }),
       }
     });
+    return this._eslint;
   }
 
   supports(codeLang) {
@@ -171,9 +197,10 @@ class JSLintingService extends LintingService {
    * @returns {Promise<LintResult>}
    */
   async _lintSnippet(snippet) {
+    const eslint = await this._init();
     if (this._knownBadSnippets.some(s => snippet.code.includes(s)))
       return { status: 'ok' };
-    const results = await this.eslint.lintText(snippet.code);
+    const results = await eslint.lintText(snippet.code, { filePath: path.join(__dirname, 'file.tsx') });
     if (!results || !results.length || !results[0].messages.length)
       return { status: 'ok' };
     const result = results[0];