chore: remove array-includes (#17)

43081j · web-flow · commit fc498c53e18b · 2025-05-19T12:37:32.000+01:00
Removes `array-includes` and uses native functionality.
diff --git a/.changeset/green-pears-clean.md b/.changeset/green-pears-clean.md
@@ -0,0 +1,5 @@
+---
+"eslint-plugin-jsx-a11y-x": patch
+---
+
+Removes `array-includes` and uses the built-in `Array.prototype.includes` method instead.
diff --git a/__mocks__/genInteractives.js b/__mocks__/genInteractives.js
@@ -1,7 +1,6 @@
 /** @flow */
 
 import { dom, roles } from 'aria-query';
-import includes from 'array-includes';
 import fromEntries from 'object.fromentries';
 
 import JSXAttributeMock from './JSXAttributeMock';
@@ -141,16 +140,16 @@ const interactiveRoles = []
   .filter(
     role =>
       !roles.get(role).abstract &&
-      roles.get(role).superClass.some(klasses => includes(klasses, 'widget')),
+      roles.get(role).superClass.some(klasses => klasses.includes('widget')),
   );
 
 const nonInteractiveRoles = roleNames.filter(
   role =>
     !roles.get(role).abstract &&
-    !roles.get(role).superClass.some(klasses => includes(klasses, 'widget')) &&
+    !roles.get(role).superClass.some(klasses => klasses.includes('widget')) &&
     // 'toolbar' does not descend from widget, but it does support
     // aria-activedescendant, thus in practice we treat it as a widget.
-    !includes(['toolbar'], role),
+    !['toolbar'].includes(role),
 );
 
 export function genElementSymbol(openingElement: Object): string {
diff --git a/__tests__/src/rules/interactive-supports-focus-test.js b/__tests__/src/rules/interactive-supports-focus-test.js
@@ -7,7 +7,6 @@
 // Requirements
 // -----------------------------------------------------------------------------
 
-import includes from 'array-includes';
 import { RuleTester } from 'eslint';
 import { eventHandlers, eventHandlersByType } from 'jsx-ast-utils';
 import { configs } from '../../../src/index';
@@ -270,15 +269,13 @@ ruleTester.run(`${ruleName}:recommended`, rule, {
         ...passReducer(
           interactiveRoles,
           eventHandlers.filter(
-            handler => !includes(triggeringHandlers, handler),
+            handler => !triggeringHandlers.includes(handler),
           ),
           codeTemplate,
         ),
         ...passReducer(
-          interactiveRoles.filter(role => !includes(recommendedRoles, role)),
-          eventHandlers.filter(handler =>
-            includes(triggeringHandlers, handler),
-          ),
+          interactiveRoles.filter(role => !recommendedRoles.includes(role)),
+          eventHandlers.filter(handler => triggeringHandlers.includes(handler)),
           tabindexTemplate,
         ),
       ),
@@ -291,7 +288,7 @@ ruleTester.run(`${ruleName}:recommended`, rule, {
         ...neverValid,
         ...failReducer(recommendedRoles, triggeringHandlers, tabbableTemplate),
         ...failReducer(
-          interactiveRoles.filter(role => !includes(recommendedRoles, role)),
+          interactiveRoles.filter(role => !recommendedRoles.includes(role)),
           triggeringHandlers,
           focusableTemplate,
         ),
@@ -309,15 +306,13 @@ ruleTester.run(`${ruleName}:strict`, rule, {
         ...passReducer(
           interactiveRoles,
           eventHandlers.filter(
-            handler => !includes(triggeringHandlers, handler),
+            handler => !triggeringHandlers.includes(handler),
           ),
           codeTemplate,
         ),
         ...passReducer(
-          interactiveRoles.filter(role => !includes(strictRoles, role)),
-          eventHandlers.filter(handler =>
-            includes(triggeringHandlers, handler),
-          ),
+          interactiveRoles.filter(role => !strictRoles.includes(role)),
+          eventHandlers.filter(handler => triggeringHandlers.includes(handler)),
           tabindexTemplate,
         ),
       ),
@@ -330,7 +325,7 @@ ruleTester.run(`${ruleName}:strict`, rule, {
         ...neverValid,
         ...failReducer(strictRoles, triggeringHandlers, tabbableTemplate),
         ...failReducer(
-          interactiveRoles.filter(role => !includes(strictRoles, role)),
+          interactiveRoles.filter(role => !strictRoles.includes(role)),
           triggeringHandlers,
           focusableTemplate,
         ),
diff --git a/package.json b/package.json
@@ -49,7 +49,6 @@
   },
   "dependencies": {
     "aria-query": "^5.3.2",
-    "array-includes": "^3.1.8",
     "array.prototype.flatmap": "^1.3.2",
     "ast-types-flow": "^0.0.8",
     "axe-core": "^4.10.2",
diff --git a/src/rules/control-has-associated-label.js b/src/rules/control-has-associated-label.js
@@ -10,7 +10,6 @@
 
 import { getProp, getLiteralPropValue } from 'jsx-ast-utils';
 import type { JSXElement } from 'ast-types-flow';
-import includes from 'array-includes';
 import { generateObjSchema, arraySchema } from '../util/schemas';
 import type {
   ESLintConfig,
@@ -74,7 +73,7 @@ export default ({
         return;
       }
       // Ignore roles that are "interactive" but should not require a label.
-      if (includes(ignoreRoles, role)) {
+      if (ignoreRoles.includes(role)) {
         return;
       }
       const props = node.openingElement.attributes;
diff --git a/src/rules/img-redundant-alt.js b/src/rules/img-redundant-alt.js
@@ -9,7 +9,6 @@
 // ----------------------------------------------------------------------------
 
 import { getProp, getLiteralPropValue } from 'jsx-ast-utils';
-import includes from 'array-includes';
 import stringIncludes from 'string.prototype.includes';
 import safeRegexTest from 'safe-regex-test';
 import { generateObjSchema, arraySchema } from '../util/schemas';
@@ -37,7 +36,7 @@ function containsRedundantWord(value, redundantWords) {
     return value
       .split(/\s+/)
       .some(valueWord =>
-        includes(lowercaseRedundantWords, valueWord.toLowerCase()),
+        lowercaseRedundantWords.includes(valueWord.toLowerCase()),
       );
   }
   return lowercaseRedundantWords.some(redundantWord =>
diff --git a/src/rules/interactive-supports-focus.js b/src/rules/interactive-supports-focus.js
@@ -12,7 +12,6 @@ import {
   hasAnyProp,
 } from 'jsx-ast-utils';
 import type { JSXOpeningElement } from 'ast-types-flow';
-import includes from 'array-includes';
 import type {
   ESLintConfig,
   ESLintContext,
@@ -42,7 +41,7 @@ const schema = generateObjSchema({
           !roles.get(name).abstract &&
           roles
             .get(name)
-            .superClass.some(klasses => includes(klasses, 'widget')),
+            .superClass.some(klasses => klasses.includes('widget')),
       ),
   ),
 });
@@ -110,7 +109,7 @@ export default ({
           !hasTabindex
         ) {
           const role = getLiteralPropValue(getProp(attributes, 'role'));
-          if (includes(tabbable, role)) {
+          if (tabbable.includes(role)) {
             // Always tabbable, tabIndex = 0
             context.report({
               node,
diff --git a/src/rules/no-interactive-element-to-noninteractive-role.js b/src/rules/no-interactive-element-to-noninteractive-role.js
@@ -12,7 +12,6 @@
 import { dom } from 'aria-query';
 import { getProp, getLiteralPropValue, propName } from 'jsx-ast-utils';
 import type { JSXIdentifier } from 'ast-types-flow';
-import includes from 'array-includes';
 import type {
   ESLintConfig,
   ESLintContext,
@@ -73,7 +72,7 @@ export default ({
         const allowedRoles = options[0] || {};
         if (
           Object.hasOwn(allowedRoles, type) &&
-          includes(allowedRoles[type], role)
+          allowedRoles[type].includes(role)
         ) {
           return;
         }
diff --git a/src/rules/no-noninteractive-element-interactions.js b/src/rules/no-noninteractive-element-interactions.js
@@ -16,7 +16,6 @@ import {
   propName,
 } from 'jsx-ast-utils';
 import type { JSXOpeningElement } from 'ast-types-flow';
-import includes from 'array-includes';
 import type {
   ESLintConfig,
   ESLintContext,
@@ -70,7 +69,7 @@ export default ({
           attributes = attributes.filter(
             attr =>
               attr.type !== 'JSXSpreadAttribute' &&
-              !includes(config[type], propName(attr)),
+              !config[type].includes(propName(attr)),
           );
         }
 
diff --git a/src/rules/no-noninteractive-element-to-interactive-role.js b/src/rules/no-noninteractive-element-to-interactive-role.js
@@ -12,7 +12,6 @@
 import { dom } from 'aria-query';
 import { propName } from 'jsx-ast-utils';
 import type { JSXIdentifier } from 'ast-types-flow';
-import includes from 'array-includes';
 import type {
   ESLintConfig,
   ESLintContext,
@@ -73,7 +72,7 @@ export default ({
         const allowedRoles = options[0] || {};
         if (
           Object.hasOwn(allowedRoles, type) &&
-          includes(allowedRoles[type], role)
+          allowedRoles[type].includes(role)
         ) {
           return;
         }
diff --git a/src/rules/no-noninteractive-tabindex.js b/src/rules/no-noninteractive-tabindex.js
@@ -11,7 +11,6 @@
 import { dom } from 'aria-query';
 import type { JSXOpeningElement } from 'ast-types-flow';
 import { getProp, getLiteralPropValue } from 'jsx-ast-utils';
-import includes from 'array-includes';
 import type {
   ESLintConfig,
   ESLintContext,
@@ -70,10 +69,10 @@ export default ({
         }
         // Allow for configuration overrides.
         const { tags, roles, allowExpressionValues } = options[0] || {};
-        if (tags && includes(tags, type)) {
+        if (tags && tags.includes(type)) {
           return;
         }
-        if (roles && includes(roles, role)) {
+        if (roles && roles.includes(role)) {
           return;
         }
         if (
diff --git a/src/rules/no-redundant-roles.js b/src/rules/no-redundant-roles.js
@@ -9,7 +9,6 @@
 // Rule Definition
 // ----------------------------------------------------------------------------
 
-import includes from 'array-includes';
 import type { JSXOpeningElement } from 'ast-types-flow';
 import type {
   ESLintConfig,
@@ -69,7 +68,7 @@ export default ({
             redundantRolesForElement = DEFAULT_ROLE_EXCEPTIONS[type] || [];
           }
 
-          if (includes(redundantRolesForElement, implicitRole)) {
+          if (redundantRolesForElement.includes(implicitRole)) {
             return;
           }
 
diff --git a/src/util/getElementType.js b/src/util/getElementType.js
@@ -1,7 +1,6 @@
 /** @flow */
 
 import type { JSXOpeningElement } from 'ast-types-flow';
-import includes from 'array-includes';
 import { elementType, getProp, getLiteralPropValue } from 'jsx-ast-utils';
 
 import type { ESLintContext } from '../../flow/eslint';
@@ -23,7 +22,7 @@ const getElementType = (
     let rawType = elementType(node);
     if (
       polymorphicProp &&
-      (!polymorphicAllowList || includes(polymorphicAllowList, rawType))
+      (!polymorphicAllowList || polymorphicAllowList.includes(rawType))
     ) {
       rawType = polymorphicProp;
     }
diff --git a/src/util/isInteractiveElement.js b/src/util/isInteractiveElement.js
@@ -2,7 +2,6 @@
 import { dom, elementRoles, roles } from 'aria-query';
 import type { Node } from 'ast-types-flow';
 import { AXObjects, elementAXObjects } from 'axobject-query';
-import includes from 'array-includes';
 import flatMap from 'array.prototype.flatmap';
 
 import attributesComparator from './attributesComparator';
@@ -19,7 +18,7 @@ const nonInteractiveRoles = new Set(
         // 'toolbar' does not descend from widget, but it does support
         // aria-activedescendant, thus in practice we treat it as a widget.
         name !== 'toolbar' &&
-        !role.superClass.some(classes => includes(classes, 'widget'))
+        !role.superClass.some(classes => classes.includes('widget'))
       );
     })
     .concat(
@@ -38,7 +37,7 @@ const interactiveRoles = new Set(
         // The `progressbar` is descended from `widget`, but in practice, its
         // value is always `readonly`, so we treat it as a non-interactive role.
         name !== 'progressbar' &&
-        role.superClass.some(classes => includes(classes, 'widget'))
+        role.superClass.some(classes => classes.includes('widget'))
       );
     })
     .concat(
diff --git a/src/util/isInteractiveRole.js b/src/util/isInteractiveRole.js
@@ -2,14 +2,13 @@
 import { roles as rolesMap } from 'aria-query';
 import type { Node } from 'ast-types-flow';
 import { getProp, getLiteralPropValue } from 'jsx-ast-utils';
-import includes from 'array-includes';
 import flatMap from 'array.prototype.flatmap';
 
 const roles = rolesMap.keys();
 const interactiveRoles = roles.filter(
   name =>
     !rolesMap.get(name).abstract &&
-    rolesMap.get(name).superClass.some(klasses => includes(klasses, 'widget')),
+    rolesMap.get(name).superClass.some(klasses => klasses.includes('widget')),
 );
 
 // 'toolbar' does not descend from widget, but it does support
@@ -42,11 +41,11 @@ const isInteractiveRole = (
   let isInteractive = false;
   const normalizedValues = String(value).toLowerCase().split(' ');
   const validRoles = flatMap(normalizedValues, (name: string) =>
-    includes(roles, name) ? [name] : [],
+    roles.includes(name) ? [name] : [],
   );
   if (validRoles.length > 0) {
     // The first role value is a series takes precedence.
-    isInteractive = includes(interactiveRoles, validRoles[0]);
+    isInteractive = interactiveRoles.includes(validRoles[0]);
   }
 
   return isInteractive;
diff --git a/src/util/isNonInteractiveElement.js b/src/util/isNonInteractiveElement.js
@@ -3,7 +3,6 @@
 import { dom, elementRoles, roles } from 'aria-query';
 import { AXObjects, elementAXObjects } from 'axobject-query';
 import type { Node } from 'ast-types-flow';
-import includes from 'array-includes';
 import flatMap from 'array.prototype.flatmap';
 
 import attributesComparator from './attributesComparator';
@@ -23,7 +22,7 @@ const nonInteractiveRoles = new Set(
         // This role is meant to have no semantic value.
         // @see https://www.w3.org/TR/wai-aria-1.2/#generic
         name !== 'generic' &&
-        !role.superClass.some(classes => includes(classes, 'widget'))
+        !role.superClass.some(classes => classes.includes('widget'))
       );
     })
     .concat(
@@ -45,7 +44,7 @@ const interactiveRoles = new Set(
         // This role is meant to have no semantic value.
         // @see https://www.w3.org/TR/wai-aria-1.2/#generic
         name !== 'generic' &&
-        role.superClass.some(classes => includes(classes, 'widget'))
+        role.superClass.some(classes => classes.includes('widget'))
       );
     })
     .concat(
@@ -73,7 +72,7 @@ const nonInteractiveElementRoleSchemas = flatMap(
 
 const nonInteractiveAXObjects = new Set(
   AXObjects.keys().filter(name =>
-    includes(['window', 'structure'], AXObjects.get(name).type),
+    ['window', 'structure'].includes(AXObjects.get(name).type),
   ),
 );
 
diff --git a/src/util/isNonInteractiveRole.js b/src/util/isNonInteractiveRole.js
@@ -3,7 +3,6 @@
 import { dom, roles as rolesMap } from 'aria-query';
 import type { Node } from 'ast-types-flow';
 import { getProp, getLiteralPropValue } from 'jsx-ast-utils';
-import includes from 'array-includes';
 import flatMap from 'array.prototype.flatmap';
 
 const nonInteractiveRoles = rolesMap
@@ -13,7 +12,7 @@ const nonInteractiveRoles = rolesMap
       !rolesMap.get(name).abstract &&
       !rolesMap
         .get(name)
-        .superClass.some(klasses => includes(klasses, 'widget')),
+        .superClass.some(klasses => klasses.includes('widget')),
   );
 
 /**
@@ -53,7 +52,7 @@ const isNonInteractiveRole = (
   );
   if (validRoles.length > 0) {
     // The first role value is a series takes precedence.
-    isNonInteractive = includes(nonInteractiveRoles, validRoles[0]);
+    isNonInteractive = nonInteractiveRoles.includes(validRoles[0]);
   }
 
   return isNonInteractive;
diff --git a/src/util/mayHaveAccessibleLabel.js b/src/util/mayHaveAccessibleLabel.js
diff --git a/yarn.lock b/yarn.lock

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +"eslint-plugin-jsx-a11y-x": patch
 +---
++
 +Removes `array-includes` and uses the built-in `Array.prototype.includes` method instead.