build: update to eslint v9

This change adds support for eslint v9.  All three example projects have been updated to use the latest eslint, and the root package's dev and peer deps have been updated.
In order to make this work with both v9 and older versions, I had to update the parser options helper to adjust the config passed into the `RuleTester`.
It was also necessary update jest to a newer version, in order to resolve eslint's use of `node:fs/promises`.
Note: the removed test cases are exact duplicates of other tests.  v9 fails tests when its determined to be an exact duplicate.

Author: michaelfaith

.flowconfig

@@ -3,5 +3,6 @@
 <PROJECT_ROOT>/lib/.*
 <PROJECT_ROOT>/docs/.*
 <PROJECT_ROOT>/reports/.*
+<PROJECT_ROOT>/examples/.*
 [options]
 suppress_type=$FlowFixMe

.github/workflows/node-4+.yml

@@ -25,13 +25,26 @@ jobs:
       matrix:
         node-version: ${{ fromJson(needs.matrix.outputs.latest) }}
         eslint:
+          - 9
           - 8
           - 7
           - 6
           - 5
           - 4
           - 3
         exclude:
+          - node-version: 16
+            eslint: 9
+          - node-version: 15
+            eslint: 9
+          - node-version: 13
+            eslint: 9
+          - node-version: 11
+            eslint: 9
+          - node-version: 10
+            eslint: 9
+          - node-version: 9
+            eslint: 9
           - node-version: 15
             eslint: 8
           - node-version: 13
@@ -90,7 +103,7 @@ jobs:
     steps:
       - uses: actions/checkout@v4
         with:
-            fetch-depth: 0
+          fetch-depth: 0
       - uses: ljharb/actions/node/install@main
         name: 'nvm install ${{ matrix.node-version }} && npm install'
         env:

__tests__/__util__/parserOptionsMapper.js

@@ -1,26 +1,53 @@
+import { version as eslintVersion } from 'eslint/package.json';
+import semver from 'semver';
+
+const usingLegacy = semver.major(eslintVersion) < 9;
+
 const defaultParserOptions = {
-  ecmaVersion: 2018,
   ecmaFeatures: {
     experimentalObjectRestSpread: true,
     jsx: true,
   },
 };
 
+const defaultLegacyParserOptions = {
+  ...defaultParserOptions,
+  ecmaVersion: 2018,
+};
+
+const defaultLanguageOptions = {
+  ecmaVersion: 'latest',
+  parserOptions: {
+    ...defaultParserOptions,
+  },
+};
+
 export default function parserOptionsMapper({
   code,
   errors,
   options = [],
-  parserOptions = {},
-  settings,
+  languageOptions = {},
+  settings = {},
 }) {
-  return {
-    code,
-    errors,
-    options,
-    parserOptions: {
-      ...defaultParserOptions,
-      ...parserOptions,
-    },
-    settings,
-  };
+  return usingLegacy
+    ? {
+      code,
+      errors,
+      options,
+      parserOptions: {
+        ...defaultLegacyParserOptions,
+        ...languageOptions,
+      },
+      settings,
+    }
+    : {
+      code,
+      errors,
+      options,
+      languageOptions: {
+        ...defaultLanguageOptions,
+        ...languageOptions,
+      },
+      settings,
+    };
 }

__tests__/src/rules/anchor-is-valid-test.js

@@ -272,14 +272,9 @@ ruleTester.run('anchor-is-valid', rule, {
       options: noHrefAspect,
     },
 
-    // CUSTOM COMPONENTS AND SPECIALLINK AND ASPECT
+    // CUSTOM COMPONENTS AND SPECIAL LINK AND ASPECT
     { code: '<Anchor hrefLeft={undefined} />', options: componentsAndSpecialLinkAndInvalidHrefAspect },
     { code: '<Anchor hrefLeft={null} />', options: componentsAndSpecialLinkAndInvalidHrefAspect },
-    { code: '<Anchor hrefLeft={undefined} />', options: componentsAndSpecialLinkAndInvalidHrefAspect },
-    { code: '<Anchor hrefLeft={null} />', options: componentsAndSpecialLinkAndInvalidHrefAspect },
-    { code: '<Anchor hrefLeft={undefined} />', options: componentsAndSpecialLinkAndInvalidHrefAspect },
-    { code: '<Anchor hrefLeft={null} />', options: componentsAndSpecialLinkAndInvalidHrefAspect },
-
   )).map(parserOptionsMapper),
   invalid: parsers.all([].concat(
     // DEFAULT ELEMENT 'a' TESTS
@@ -372,7 +367,7 @@ ruleTester.run('anchor-is-valid', rule, {
       options: specialLink,
     },
 
-    // CUSTOM BOTH COMPONENTS AND SPECIALLINK TESTS
+    // CUSTOM BOTH COMPONENTS AND SPECIAL LINK TESTS
     // NO HREF
     { code: '<Anchor Anchor={undefined} />', errors: [noHrefexpectedError], options: componentsAndSpecialLink },
     { code: '<Anchor hrefLeft={null} />', errors: [noHrefexpectedError], options: componentsAndSpecialLink },
@@ -522,27 +517,7 @@ ruleTester.run('anchor-is-valid', rule, {
       errors: [invalidHrefexpectedError],
     },
 
-    // CUSTOM COMPONENTS AND SPECIALLINK AND ASPECT
-    {
-      code: '<Anchor hrefLeft={undefined} />',
-      options: componentsAndSpecialLinkAndNoHrefAspect,
-      errors: [noHrefexpectedError],
-    },
-    {
-      code: '<Anchor hrefLeft={null} />',
-      options: componentsAndSpecialLinkAndNoHrefAspect,
-      errors: [noHrefexpectedError],
-    },
-    {
-      code: '<Anchor hrefLeft={undefined} />',
-      options: componentsAndSpecialLinkAndNoHrefAspect,
-      errors: [noHrefexpectedError],
-    },
-    {
-      code: '<Anchor hrefLeft={null} />',
-      options: componentsAndSpecialLinkAndNoHrefAspect,
-      errors: [noHrefexpectedError],
-    },
+    // CUSTOM COMPONENTS AND SPECIAL LINK AND ASPECT
     {
       code: '<Anchor hrefLeft={undefined} />',
       options: componentsAndSpecialLinkAndNoHrefAspect,

__tests__/src/rules/no-noninteractive-element-interactions-test.js

@@ -336,7 +336,6 @@ const neverValid = [
   { code: '<tfoot onClick={() => {}} />;', errors: [expectedError] },
   { code: '<thead onClick={() => {}} />;', errors: [expectedError] },
   { code: '<time onClick={() => {}} />;', errors: [expectedError] },
-  { code: '<ol onClick={() => {}} />;', errors: [expectedError] },
   { code: '<ul onClick={() => {}} />;', errors: [expectedError] },
   { code: '<ul contentEditable="false" onClick={() => {}} />;', errors: [expectedError] },
   { code: '<article contentEditable onClick={() => {}} />;', errors: [expectedError] },
@@ -345,7 +344,6 @@ const neverValid = [
   { code: '<div role="alert" onClick={() => {}} />;', errors: [expectedError] },
   { code: '<div role="alertdialog" onClick={() => {}} />;', errors: [expectedError] },
   { code: '<div role="application" onClick={() => {}} />;', errors: [expectedError] },
-  { code: '<div role="article" onClick={() => {}} />;', errors: [expectedError] },
   { code: '<div role="banner" onClick={() => {}} />;', errors: [expectedError] },
   { code: '<div role="cell" onClick={() => {}} />;', errors: [expectedError] },
   { code: '<div role="complementary" onClick={() => {}} />;', errors: [expectedError] },

__tests__/src/rules/no-noninteractive-element-to-interactive-role-test.js

@@ -360,7 +360,6 @@ const neverValid = [
    * interactive role. */
   { code: '<main role="button" />;', errors: [expectedError] },
   { code: '<article role="button" />;', errors: [expectedError] },
-  { code: '<article role="button" />;', errors: [expectedError] },
   { code: '<aside role="button" />;', errors: [expectedError] },
   { code: '<blockquote role="button" />;', errors: [expectedError] },
   { code: '<body role="button" />;', errors: [expectedError] },
@@ -412,7 +411,6 @@ const neverValid = [
    * interactive role. */
   { code: '<main role="menuitem" />;', errors: [expectedError] },
   { code: '<article role="menuitem" />;', errors: [expectedError] },
-  { code: '<article role="menuitem" />;', errors: [expectedError] },
   { code: '<dd role="menuitem" />;', errors: [expectedError] },
   { code: '<dfn role="menuitem" />;', errors: [expectedError] },
   { code: '<dt role="menuitem" />;', errors: [expectedError] },

__tests__/src/rules/no-static-element-interactions-test.js

@@ -85,7 +85,6 @@ const alwaysValid = [
   { code: '<audio onClick={() => {}} />;' },
   { code: '<form onClick={() => {}} />;' },
   { code: '<form onSubmit={() => {}} />;' },
-  { code: '<link onClick={() => {}} href="#" />;' },
   /* HTML elements attributed with an interactive role */
   { code: '<div role="button" onClick={() => {}} />;' },
   { code: '<div role="checkbox" onClick={() => {}} />;' },
@@ -115,7 +114,6 @@ const alwaysValid = [
   { code: '<article onDblClick={() => void 0} />;' },
   { code: '<aside onClick={() => {}} />;' },
   { code: '<blockquote onClick={() => {}} />;' },
-  { code: '<body onClick={() => {}} />;' },
   { code: '<br onClick={() => {}} />;' },
   { code: '<canvas onClick={() => {}} />;' },
   { code: '<caption onClick={() => {}} />;' },
@@ -130,7 +128,6 @@ const alwaysValid = [
   { code: '<figcaption onClick={() => {}} />;' },
   { code: '<figure onClick={() => {}} />;' },
   { code: '<footer onClick={() => {}} />;' },
-  { code: '<frame onClick={() => {}} />;' },
   { code: '<h1 onClick={() => {}} />;' },
   { code: '<h2 onClick={() => {}} />;' },
   { code: '<h3 onClick={() => {}} />;' },
@@ -288,7 +285,6 @@ const neverValid = [
   { code: '<a tabIndex="0" onClick={() => void 0} />', errors: [expectedError] },
   { code: '<area onClick={() => {}} />;', errors: [expectedError] },
   { code: '<acronym onClick={() => {}} />;', errors: [expectedError] },
-  { code: '<address onClick={() => {}} />;', errors: [expectedError] },
   { code: '<applet onClick={() => {}} />;', errors: [expectedError] },
   { code: '<b onClick={() => {}} />;', errors: [expectedError] },
   { code: '<base onClick={() => {}} />;', errors: [expectedError] },
@@ -304,7 +300,6 @@ const neverValid = [
   { code: '<content onClick={() => {}} />;', errors: [expectedError] },
   { code: '<data onClick={() => {}} />;', errors: [expectedError] },
   { code: '<del onClick={() => {}} />;', errors: [expectedError] },
-  { code: '<div onClick={() => {}} />;', errors: [expectedError] },
   { code: '<em onClick={() => {}} />;', errors: [expectedError] },
   { code: '<font onClick={() => {}} />;', errors: [expectedError] },
   { code: '<frameset onClick={() => {}} />;', errors: [expectedError] },

__tests__/src/rules/prefer-tag-over-role-test.js

@@ -10,7 +10,7 @@ const expectedError = (role, tag) => ({
   type: 'JSXOpeningElement',
 });
 
-ruleTester.run('element-role', rule, {
+ruleTester.run('prefer-tag-over-role', rule, {
   valid: parsers.all([].concat(
     { code: '<div />;' },
     { code: '<div role="unknown" />;' },
@@ -55,10 +55,6 @@ ruleTester.run('element-role', rule, {
       code: '<other role="checkbox" />',
       errors: [expectedError('checkbox', '<input type="checkbox">')],
     },
-    {
-      code: '<other role="checkbox" />',
-      errors: [expectedError('checkbox', '<input type="checkbox">')],
-    },
     {
       code: '<div role="banner" />',
       errors: [expectedError('banner', '<header>')],

__tests__/src/util/parserOptionsMapper-test.js

@@ -1,46 +1,88 @@
+import { version as eslintVersion } from 'eslint/package.json';
 import expect from 'expect';
+import semver from 'semver';
 import parserOptionsMapper from '../../__util__/parserOptionsMapper';
 
+const usingLegacy = semver.major(eslintVersion) < 9;
+
 describe('parserOptionsMapper', () => {
   it('should return an test case object', () => {
     const testCase = {
       code: '<div />',
       errors: [],
       options: {},
     };
-    expect(parserOptionsMapper(testCase)).toEqual({
-      code: '<div />',
-      errors: [],
-      options: {},
-      parserOptions: {
-        ecmaVersion: 2018,
-        ecmaFeatures: {
-          experimentalObjectRestSpread: true,
-          jsx: true,
+
+    const expectedResult = usingLegacy
+      ? {
+        code: '<div />',
+        errors: [],
+        options: {},
+        parserOptions: {
+          ecmaVersion: 2018,
+          ecmaFeatures: {
+            experimentalObjectRestSpread: true,
+            jsx: true,
+          },
         },
-      },
-    });
+        settings: {},
+      }
+      : {
+        code: '<div />',
+        errors: [],
+        options: {},
+        languageOptions: {
+          ecmaVersion: 'latest',
+          parserOptions: {
+            ecmaFeatures: {
+              experimentalObjectRestSpread: true,
+              jsx: true,
+            },
+          },
+        },
+        settings: {},
+      };
+    expect(parserOptionsMapper(testCase)).toEqual(expectedResult);
   });
   it('should allow for overriding parserOptions', () => {
     const testCase = {
       code: '<div />',
       errors: [],
       options: {},
-      parserOptions: {
+      languageOptions: {
         ecmaVersion: 5,
       },
     };
-    expect(parserOptionsMapper(testCase)).toEqual({
-      code: '<div />',
-      errors: [],
-      options: {},
-      parserOptions: {
-        ecmaVersion: 5,
-        ecmaFeatures: {
-          experimentalObjectRestSpread: true,
-          jsx: true,
+
+    const expectedResult = usingLegacy
+      ? {
+        code: '<div />',
+        errors: [],
+        options: {},
+        parserOptions: {
+          ecmaVersion: 5,
+          ecmaFeatures: {
+            experimentalObjectRestSpread: true,
+            jsx: true,
+          },
         },
-      },
-    });
+        settings: {},
+      }
+      : {
+        code: '<div />',
+        errors: [],
+        options: {},
+        languageOptions: {
+          ecmaVersion: 5,
+          parserOptions: {
+            ecmaFeatures: {
+              experimentalObjectRestSpread: true,
+              jsx: true,
+            },
+          },
+        },
+        settings: {},
+      };
+    expect(parserOptionsMapper(testCase)).toEqual(expectedResult);
   });
 });

examples/flat-cjs/package.json

@@ -11,9 +11,9 @@
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@eslint/js": "^9.5.0",
+    "@eslint/js": "^9.9.1",
     "cross-env": "^7.0.3",
-    "eslint": "^8.57.0",
+    "eslint": "^9.9.1",
     "eslint-plugin-jsx-a11y": "file:../..",
     "globals": "^15.6.0"
   }