chore: upgrade @typescript-eslint to v6 and eslint to v8

change/@fluentui-eslint-plugin-912d0763-d6cf-4fec-beac-2843c49fc62d.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "chore: migrate to @typescript/eslint v6",
+  "packageName": "@fluentui/eslint-plugin",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

change/@fluentui-react-tabster-b0807315-3821-4fdb-a2ac-25c10dd1d266.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "chore: suppress @typescript-eslint/naming-convention report on TabsterTypes_6_0_1_DoNotUse",
+  "packageName": "@fluentui/react-tabster",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

change/@fluentui-web-components-8db325bc-acef-4d3a-af10-591cfd00cc42.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "chore: suppress @typescript-eslint/no_unsafe_declaration-merging reports",
+  "packageName": "@fluentui/web-components",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

package.json

@@ -105,7 +105,7 @@
     "@phenomnomnominal/tsquery": "6.1.3",
     "@playwright/test": "1.44.0",
     "@react-native/babel-preset": "0.73.21",
-    "@rnx-kit/eslint-plugin": "0.4.2",
+    "@rnx-kit/eslint-plugin": "0.5.3",
     "@rollup/plugin-node-resolve": "13.3.0",
     "@storybook/addon-a11y": "6.5.15",
     "@storybook/addon-actions": "6.5.15",
@@ -142,7 +142,7 @@
     "@types/doctrine": "0.0.5",
     "@types/ejs": "3.1.2",
     "@types/enzyme": "3.10.7",
-    "@types/eslint": "7.2.13",
+    "@types/eslint": "8.56.10",
     "@types/express": "4.17.21",
     "@types/fs-extra": "8.0.1",
     "@types/glob": "7.1.1",
@@ -183,9 +183,10 @@
     "@types/webpack-hot-middleware": "2.25.9",
     "@types/yargs": "13.0.11",
     "@types/yargs-unparser": "2.0.1",
-    "@typescript-eslint/eslint-plugin": "5.62.0",
-    "@typescript-eslint/parser": "5.62.0",
-    "@typescript-eslint/utils": "5.62.0",
+    "@typescript-eslint/eslint-plugin": "6.21.0",
+    "@typescript-eslint/parser": "6.21.0",
+    "@typescript-eslint/rule-tester": "6.21.0",
+    "@typescript-eslint/utils": "6.21.0",
     "@wojtekmaj/enzyme-adapter-react-17": "0.6.7",
     "ajv": "8.4.0",
     "autoprefixer": "10.2.1",
@@ -223,20 +224,20 @@
     "enzyme-to-json": "3.6.2",
     "esbuild": "0.20.1",
     "esbuild-loader": "4.1.0",
-    "eslint": "7.32.0",
+    "eslint": "8.57.0",
     "eslint-config-airbnb": "18.2.1",
     "eslint-config-prettier": "8.3.0",
-    "eslint-import-resolver-typescript": "2.7.1",
-    "eslint-plugin-deprecation": "1.6.0",
+    "eslint-import-resolver-typescript": "3.6.1",
+    "eslint-plugin-deprecation": "2.0.0",
     "eslint-plugin-es": "4.1.0",
     "eslint-plugin-import": "2.29.1",
-    "eslint-plugin-jest": "26.9.0",
-    "eslint-plugin-jsdoc": "48.2.0",
-    "eslint-plugin-jsx-a11y": "6.4.1",
+    "eslint-plugin-jest": "28.6.0",
+    "eslint-plugin-jsdoc": "48.7.0",
+    "eslint-plugin-jsx-a11y": "6.9.0",
     "eslint-plugin-playwright": "0.15.3",
     "eslint-plugin-react": "7.26.0",
     "eslint-plugin-react-compiler": "0.0.0-experimental-a97cca1-20240529",
-    "eslint-plugin-react-hooks": "4.3.0",
+    "eslint-plugin-react-hooks": "4.6.2",
     "express": "4.19.2",
     "extract-comments": "1.1.0",
     "file-loader": "6.2.0",
@@ -374,11 +375,11 @@
   },
   "resolutions": {
     "@storybook/react-docgen-typescript-plugin": "1.0.6--canary.9.0c3f3b7.0",
-    "@typescript-eslint/eslint-plugin": "5.62.0",
-    "@typescript-eslint/parser": "5.62.0",
-    "@typescript-eslint/utils": "5.62.0",
+    "@typescript-eslint/eslint-plugin": "6.21.0",
+    "@typescript-eslint/parser": "6.21.0",
+    "@typescript-eslint/utils": "6.21.0",
     "@types/jest-axe/axe-core": "4.7.2",
-    "eslint": "7.32.0",
+    "eslint": "8.57.0",
     "@mdx-js/loader/loader-utils": "~2.0.4",
     "swc-loader": "^0.2.6",
     "prettier": "2.8.8",

packages/eslint-plugin/package.json

@@ -15,27 +15,29 @@
   },
   "dependencies": {
     "@griffel/eslint-plugin": "^1.6.3",
-    "@rnx-kit/eslint-plugin": "^0.4.2",
-    "@typescript-eslint/eslint-plugin": "^5.62.0",
-    "@typescript-eslint/utils": "^5.62.0",
-    "@typescript-eslint/parser": "^5.62.0",
+    "@rnx-kit/eslint-plugin": "^0.5.3",
+    "@typescript-eslint/eslint-plugin": "^6.21.0",
+    "@typescript-eslint/utils": "^6.21.0",
+    "@typescript-eslint/rule-tester": "6.21.0",
+    "@typescript-eslint/parser": "^6.21.0",
+    "@typescript-eslint/type-utils": "^6.21.0",
     "eslint-config-airbnb": "^18.2.1",
     "eslint-config-prettier": "^8.3.0",
-    "eslint-import-resolver-typescript": "^2.7.1",
-    "eslint-plugin-deprecation": "^1.2.1",
+    "eslint-import-resolver-typescript": "^3.6.1",
+    "eslint-plugin-deprecation": "^2.0.0",
     "eslint-plugin-import": "^2.29.1",
-    "eslint-plugin-jest": "^26.9.0",
-    "eslint-plugin-jsdoc": "^48.2.0",
-    "eslint-plugin-jsx-a11y": "^6.4.1",
+    "eslint-plugin-jest": "^28.6.0",
+    "eslint-plugin-jsdoc": "^48.7.0",
+    "eslint-plugin-jsx-a11y": "^6.9.0",
     "eslint-plugin-react": "^7.24.0",
-    "eslint-plugin-react-hooks": "^4.2.0",
+    "eslint-plugin-react-hooks": "^4.6.2",
     "fs-extra": "^8.1.0",
     "minimatch": "^3.1.2",
     "jju": "^1.4.0"
   },
   "peerDependencies": {
-    "eslint": "^7.0.0",
-    "typescript": "^4.1.0"
+    "eslint": "^8.0.0",
+    "typescript": "^4.2.4"
   },
   "files": [
     "src"

packages/eslint-plugin/src/rules/ban-context-export/index.js

@@ -35,7 +35,7 @@ module.exports = createRule({
     type: 'problem',
     docs: {
       description: 'Ban export of React context or context selector objects',
-      recommended: 'error',
+      recommended: 'recommended',
     },
     messages: {
       nativeContext: '{{exportName}} should not be exported directly',

packages/eslint-plugin/src/rules/ban-context-export/index.test.js

@@ -1,9 +1,9 @@
 // @ts-check
-const { ESLintUtils } = require('@typescript-eslint/utils');
+const { RuleTester } = require('@typescript-eslint/rule-tester');
 const path = require('path');
 const rule = require('./index');
 
-const ruleTester = new ESLintUtils.RuleTester({
+const ruleTester = new RuleTester({
   parser: '@typescript-eslint/parser',
   parserOptions: {
     project: path.resolve(__dirname, './fixtures/ban-context-export/tsconfig.json'),

packages/eslint-plugin/src/rules/ban-imports.js

@@ -31,7 +31,6 @@ module.exports = createRule({
     type: 'problem',
     docs: {
       description: 'Ban importing (or re-exporting) certain identifiers from certain paths or modules.',
-      recommended: false,
     },
     messages: {
       pathNotAllowed: "{{verb}} from '{{path}}' is not allowed{{message}}",

packages/eslint-plugin/src/rules/ban-instanceof-html-element/index.js

@@ -13,7 +13,7 @@ module.exports = createRule({
     type: 'problem',
     docs: {
       description: 'Ban usage of instanceof HTMLElement comparison',
-      recommended: 'error',
+      recommended: 'recommended',
     },
     messages: {
       invalidBinaryExpression: 'instanceof {{right}} should be avoided, use isHTMLElement instead.',
@@ -44,66 +44,66 @@ module.exports = createRule({
 
 /** @type {HTMLElementConstructorName[]} */
 const constructorNames = [
-  'HTMLElement',
-  'HTMLAnchorElement',
-  'HTMLAreaElement',
-  'HTMLAudioElement',
-  'HTMLBaseElement',
-  'HTMLBodyElement',
-  'HTMLBRElement',
-  'HTMLButtonElement',
-  'HTMLCanvasElement',
-  'HTMLDataElement',
-  'HTMLDataListElement',
-  'HTMLDetailsElement',
-  'HTMLDialogElement',
-  'HTMLDivElement',
-  'HTMLDListElement',
-  'HTMLEmbedElement',
-  'HTMLFieldSetElement',
-  'HTMLFormElement',
-  'HTMLHeadingElement',
-  'HTMLHeadElement',
-  'HTMLHRElement',
-  'HTMLHtmlElement',
-  'HTMLIFrameElement',
-  'HTMLImageElement',
-  'HTMLInputElement',
-  'HTMLModElement',
-  'HTMLLabelElement',
-  'HTMLLegendElement',
-  'HTMLLIElement',
-  'HTMLLinkElement',
-  'HTMLMapElement',
-  'HTMLMetaElement',
-  'HTMLMeterElement',
-  'HTMLObjectElement',
-  'HTMLOListElement',
-  'HTMLOptGroupElement',
-  'HTMLOptionElement',
-  'HTMLOutputElement',
-  'HTMLParagraphElement',
-  'HTMLParamElement',
-  'HTMLPreElement',
-  'HTMLProgressElement',
-  'HTMLQuoteElement',
-  'HTMLSlotElement',
-  'HTMLScriptElement',
-  'HTMLSelectElement',
-  'HTMLSourceElement',
-  'HTMLSpanElement',
-  'HTMLStyleElement',
-  'HTMLTableElement',
-  'HTMLTableColElement',
-  'HTMLTableRowElement',
-  'HTMLTableSectionElement',
-  'HTMLTemplateElement',
-  'HTMLTextAreaElement',
-  'HTMLTimeElement',
-  'HTMLTitleElement',
-  'HTMLTrackElement',
-  'HTMLUListElement',
-  'HTMLVideoElement',
+  'HTMLElement', // Base class for all HTML elements
+  'HTMLAnchorElement', // <a> elements
+  'HTMLAreaElement', // <area> elements
+  'HTMLAudioElement', // <audio> elements
+  'HTMLBaseElement', // <base> elements
+  'HTMLBodyElement', // <body> elements
+  'HTMLBRElement', // <br> elements
+  'HTMLButtonElement', // <button> elements
+  'HTMLCanvasElement', // <canvas> elements
+  'HTMLDataElement', // <data> elements
+  'HTMLDataListElement', // <datalist> elements
+  'HTMLDetailsElement', // <details> elements
+  'HTMLDialogElement', // <dialog> elements
+  'HTMLDivElement', // <div> elements
+  'HTMLDListElement', // <dl> elements
+  'HTMLEmbedElement', // <embed> elements
+  'HTMLFieldSetElement', // <fieldset> elements
+  'HTMLFormElement', // <form> elements
+  'HTMLHeadingElement', // <h1> to <h6> elements
+  'HTMLHeadElement', // <head> elements
+  'HTMLHRElement', // <hr> elements
+  'HTMLHtmlElement', // <html> elements
+  'HTMLIFrameElement', // <iframe> elements
+  'HTMLImageElement', // <img> elements
+  'HTMLInputElement', // <input> elements
+  'HTMLModElement', // <ins> and <del> elements
+  'HTMLLabelElement', // <label> elements
+  'HTMLLegendElement', // <legend> elements
+  'HTMLLIElement', // <li> elements
+  'HTMLLinkElement', // <link> elements
+  'HTMLMapElement', // <map> elements
+  'HTMLMetaElement', // <meta> elements
+  'HTMLMeterElement', // <meter> elements
+  'HTMLObjectElement', // <object> elements
+  'HTMLOListElement', // <ol> elements
+  'HTMLOptGroupElement', // <optgroup> elements
+  'HTMLOptionElement', // <option> elements
+  'HTMLOutputElement', // <output> elements
+  'HTMLParagraphElement', // <p> elements
+  'HTMLParamElement', // <param> elements
+  'HTMLPreElement', // <pre> elements
+  'HTMLProgressElement', // <progress> elements
+  'HTMLQuoteElement', // <blockquote> and <q> elements
+  'HTMLSlotElement', // <slot> elements
+  'HTMLScriptElement', // <script> elements
+  'HTMLSelectElement', // <select> elements
+  'HTMLSourceElement', // <source> elements
+  'HTMLSpanElement', // <span> elements
+  'HTMLStyleElement', // <style> elements
+  'HTMLTableElement', // <table> elements
+  'HTMLTableColElement', // <col> and <colgroup> elements
+  'HTMLTableRowElement', // <tr> elements
+  'HTMLTableSectionElement', // <thead>, <tbody>, and <tfoot> elements
+  'HTMLTemplateElement', // <template> elements
+  'HTMLTextAreaElement', // <textarea> elements
+  'HTMLTimeElement', // <time> elements
+  'HTMLTitleElement', // <title> elements
+  'HTMLTrackElement', // <track> elements
+  'HTMLUListElement', // <ul> elements
+  'HTMLVideoElement', // <video> elements];
 ];
 
 /** @type {Set<string>} */

packages/eslint-plugin/src/rules/ban-instanceof-html-element/index.test.js

@@ -1,7 +1,7 @@
-const { ESLintUtils } = require('@typescript-eslint/utils');
+const { RuleTester } = require('@typescript-eslint/rule-tester');
 const rule = require('./index');
 
-const ruleTester = new ESLintUtils.RuleTester({
+const ruleTester = new RuleTester({
   parser: '@typescript-eslint/parser',
 });
 

packages/eslint-plugin/src/rules/deprecated-keyboard-event-props.js

@@ -8,7 +8,7 @@ module.exports = createRule({
     type: 'problem',
     docs: {
       description: 'Forbid use of deprecated KeyboardEvent props "which" and "keyCode".',
-      recommended: 'error',
+      recommended: 'recommended',
       requiresTypeChecking: true,
     },
     messages: {

packages/eslint-plugin/src/rules/max-len.js

@@ -10,7 +10,6 @@ module.exports = createRule({
       // - it has options to detect and specially handle comments, strings, etc
       // - it checks the ignore regex without even a preliminary length check first
       description: 'Enforces a maximum line length, more cheaply than default ESLint version',
-      recommended: false,
     },
     messages: {
       max: 'This line has a length of {{lineLength}}. Maximum allowed is {{max}}.',

packages/eslint-plugin/src/rules/no-context-default-value/index.js

@@ -16,7 +16,6 @@ module.exports = createRule({
     type: 'problem',
     docs: {
       description: 'Restricts usage of default values on React context creation',
-      recommended: false,
     },
     messages: {
       invalidDefaultValue: 'Invalid default value for context declaration, default value should be undefined',

packages/eslint-plugin/src/rules/no-context-default-value/index.test.js

@@ -1,7 +1,7 @@
-const { ESLintUtils } = require('@typescript-eslint/utils');
+const { RuleTester } = require('@typescript-eslint/rule-tester');
 const rule = require('./index');
 
-const ruleTester = new ESLintUtils.RuleTester({
+const ruleTester = new RuleTester({
   parser: '@typescript-eslint/parser',
 });
 

packages/eslint-plugin/src/rules/no-global-react.js

@@ -8,7 +8,7 @@ module.exports = createRule({
     type: 'problem',
     docs: {
       description: 'Prevent accidental references to the global React namespace',
-      recommended: 'error',
+      recommended: 'recommended',
     },
     messages: {
       missingImport: 'You must explicitly import React to reference it',

packages/eslint-plugin/src/rules/no-restricted-imports/index.js

@@ -25,7 +25,6 @@ module.exports = createRule({
     type: 'problem',
     docs: {
       description: 'Restricts imports of certain packages',
-      recommended: false,
     },
     messages: {
       restrictedImport: 'Import from {{ packageName }} detected which is not allowed.',
@@ -39,16 +38,19 @@ module.exports = createRule({
             type: 'array',
             minItems: 1,
             items: {
-              forbidden: {
-                type: 'array',
-                minItems: 1,
-                items: {
+              type: 'object',
+              properties: {
+                forbidden: {
+                  type: 'array',
+                  minItems: 1,
+                  items: {
+                    type: 'string',
+                  },
+                },
+                preferred: {
                   type: 'string',
                 },
               },
-              preferred: {
-                type: 'string',
-              },
             },
           },
         },