@arcaauth/eslint-plugin-jsx-a11y 6.10.2

package/__tests__/src/util/getTabIndex-test.js

@@ -0,0 +1,85 @@
+import test from 'tape';
+
+import getTabIndex from '../../../src/util/getTabIndex';
+import IdentifierMock from '../../../__mocks__/IdentifierMock';
+import JSXAttributeMock from '../../../__mocks__/JSXAttributeMock';
+
+test('getTabIndex', (t) => {
+  t.equal(
+    getTabIndex(JSXAttributeMock('tabIndex', 0)),
+    0,
+    'tabIndex is defined as zero -> zero',
+  );
+
+  t.equal(
+    getTabIndex(JSXAttributeMock('tabIndex', 1)),
+    1,
+    'tabIndex is defined as a positive integer -> returns it',
+  );
+
+  t.equal(
+    getTabIndex(JSXAttributeMock('tabIndex', -1)),
+    -1,
+    'tabIndex is defined as a negative integer -> returns it',
+  );
+
+  t.equal(
+    getTabIndex(JSXAttributeMock('tabIndex', '')),
+    undefined,
+    'tabIndex is defined as an empty string -> undefined',
+  );
+
+  t.equal(
+    getTabIndex(JSXAttributeMock('tabIndex', 9.1)),
+    undefined,
+    'tabIndex is defined as a float -> undefined',
+  );
+
+  t.equal(
+    getTabIndex(JSXAttributeMock('tabIndex', '0')),
+    0,
+    'tabIndex is defined as a string which converts to a number -> returns the integer',
+  );
+
+  t.equal(
+    getTabIndex(JSXAttributeMock('tabIndex', '0a')),
+    undefined,
+    'tabIndex is defined as a string which is NaN -> returns undefined',
+  );
+
+  t.equal(
+    getTabIndex(JSXAttributeMock('tabIndex', true)),
+    undefined,
+    'tabIndex is defined as true -> returns undefined',
+  );
+  t.equal(
+    getTabIndex(JSXAttributeMock('tabIndex', false)),
+    undefined,
+    'tabIndex is defined as false -> returns undefined',
+  );
+
+  t.equal(
+    typeof getTabIndex(JSXAttributeMock('tabIndex', () => 0)),
+    'function',
+    'tabIndex is defined as a function expression -> returns the correct type',
+  );
+
+  const name = 'identName';
+  t.equal(
+    getTabIndex(JSXAttributeMock(
+      'tabIndex',
+      IdentifierMock(name),
+      true,
+    )),
+    name,
+    'tabIndex is defined as a variable expression -> returns the Identifier name',
+  );
+
+  t.equal(
+    getTabIndex(JSXAttributeMock('tabIndex', undefined)),
+    undefined,
+    'tabIndex is not defined -> returns undefined',
+  );
+
+  t.end();
+});

package/__tests__/src/util/hasAccessibleChild-test.js

@@ -0,0 +1,157 @@
+import test from 'tape';
+import { elementType } from 'jsx-ast-utils';
+
+import hasAccessibleChild from '../../../src/util/hasAccessibleChild';
+import JSXElementMock from '../../../__mocks__/JSXElementMock';
+import JSXAttributeMock from '../../../__mocks__/JSXAttributeMock';
+import JSXExpressionContainerMock from '../../../__mocks__/JSXExpressionContainerMock';
+
+test('hasAccessibleChild', (t) => {
+  t.equal(
+    hasAccessibleChild(JSXElementMock('div', []), elementType),
+    false,
+    'has no children and does not set dangerouslySetInnerHTML -> false',
+  );
+
+  t.equal(
+    hasAccessibleChild(
+      JSXElementMock('div', [JSXAttributeMock('dangerouslySetInnerHTML', true)], []),
+      elementType,
+    ),
+    true,
+    'has no children and sets dangerouslySetInnerHTML -> true',
+  );
+
+  t.equal(
+    hasAccessibleChild(
+      JSXElementMock(
+        'div',
+        [],
+        [{
+          type: 'Literal',
+          value: 'foo',
+        }],
+      ),
+      elementType,
+    ),
+    true,
+    'has children + Literal child -> true',
+  );
+
+  t.equal(
+    hasAccessibleChild(
+      JSXElementMock('div', [], [JSXElementMock('div', [])]),
+      elementType,
+    ),
+    true,
+    'has children + visible JSXElement child -> true',
+  );
+
+  t.equal(
+    hasAccessibleChild(
+      JSXElementMock('div', [], [{
+        type: 'JSXText',
+        value: 'foo',
+      }]),
+      elementType,
+    ),
+    true,
+    'has children + JSText element -> true',
+  );
+
+  t.equal(
+    hasAccessibleChild(
+      JSXElementMock('div', [], [
+        JSXElementMock('div', [
+          JSXAttributeMock('aria-hidden', true),
+        ]),
+      ]),
+      elementType,
+    ),
+    false,
+    'has children + hidden child JSXElement -> false',
+  );
+
+  t.equal(
+    hasAccessibleChild(
+      JSXElementMock('div', [], [
+        JSXExpressionContainerMock({
+          type: 'Identifier',
+          name: 'foo',
+        }),
+      ]),
+      elementType,
+    ),
+    true,
+    'defined JSXExpressionContainer -> true',
+  );
+
+  t.equal(
+    hasAccessibleChild(
+      JSXElementMock('div', [], [
+        JSXExpressionContainerMock({
+          type: 'Identifier',
+          name: 'undefined',
+        }),
+      ]),
+      elementType,
+    ),
+    false,
+    'has children + undefined JSXExpressionContainer -> false',
+  );
+
+  t.equal(
+    hasAccessibleChild(
+      JSXElementMock('div', [], [{
+        type: 'Unknown',
+      }]),
+      elementType,
+    ),
+    false,
+    'unknown child type -> false',
+  );
+
+  t.equal(
+    hasAccessibleChild(
+      JSXElementMock('div', [JSXAttributeMock('children', true)], []),
+      elementType,
+    ),
+    true,
+    'children passed as a prop -> true',
+  );
+
+  t.equal(
+    hasAccessibleChild(
+      JSXElementMock('div', [], [
+        JSXElementMock('input', [JSXAttributeMock('type', 'hidden')]),
+      ]),
+      elementType,
+    ),
+    false,
+    'has chidren -> hidden child input JSXElement -> false',
+  );
+
+  t.equal(
+    hasAccessibleChild(
+      JSXElementMock('div', [], [
+        JSXElementMock('CustomInput', [JSXAttributeMock('type', 'hidden')]),
+      ]),
+      elementType,
+    ),
+    true,
+    'has children + custom JSXElement of type hidden -> true',
+  );
+
+  t.equal(
+    hasAccessibleChild(
+      JSXElementMock('div', [], [
+        JSXElementMock('CustomInput', [JSXAttributeMock('type', 'hidden')]),
+      ]),
+      () => 'input',
+    ),
+    false,
+    'custom JSXElement mapped to input if type is hidden -> false',
+  );
+
+  t.end();
+});

package/__tests__/src/util/implicitRoles/input-test.js

@@ -0,0 +1,87 @@
+import test from 'tape';
+
+import JSXAttributeMock from '../../../../__mocks__/JSXAttributeMock';
+import getImplicitRoleForInput from '../../../../src/util/implicitRoles/input';
+
+test('isAbstractRole', (t) => {
+  t.test('works for buttons', (st) => {
+    st.equal(
+      getImplicitRoleForInput([JSXAttributeMock('type', 'button')]),
+      'button',
+    );
+
+    st.equal(
+      getImplicitRoleForInput([JSXAttributeMock('type', 'image')]),
+      'button',
+    );
+
+    st.equal(
+      getImplicitRoleForInput([JSXAttributeMock('type', 'reset')]),
+      'button',
+    );
+
+    st.equal(
+      getImplicitRoleForInput([JSXAttributeMock('type', 'submit')]),
+      'button',
+    );
+
+    st.end();
+  });
+
+  t.equal(
+    getImplicitRoleForInput([JSXAttributeMock('type', 'checkbox')]),
+    'checkbox',
+    'works for checkboxes',
+  );
+
+  t.equal(
+    getImplicitRoleForInput([JSXAttributeMock('type', 'radio')]),
+    'radio',
+    'works for radios',
+  );
+
+  t.equal(
+    getImplicitRoleForInput([JSXAttributeMock('type', 'range')]),
+    'slider',
+    'works for ranges',
+  );
+
+  t.test('works for textboxes', (st) => {
+    st.equal(
+      getImplicitRoleForInput([JSXAttributeMock('type', 'email')]),
+      'textbox',
+    );
+    st.equal(
+      getImplicitRoleForInput([JSXAttributeMock('type', 'password')]),
+      'textbox',
+    );
+    st.equal(
+      getImplicitRoleForInput([JSXAttributeMock('type', 'search')]),
+      'textbox',
+    );
+    st.equal(
+      getImplicitRoleForInput([JSXAttributeMock('type', 'tel')]),
+      'textbox',
+    );
+    st.equal(
+      getImplicitRoleForInput([JSXAttributeMock('type', 'url')]),
+      'textbox',
+    );
+
+    st.end();
+  });
+
+  t.equal(
+    getImplicitRoleForInput([JSXAttributeMock('type', '')]),
+    'textbox',
+    'works for the default case',
+  );
+
+  t.equal(
+    getImplicitRoleForInput([JSXAttributeMock('type', true)]),
+    'textbox',
+    'works for the true case',
+  );
+
+  t.end();
+});

package/__tests__/src/util/implicitRoles/menu-test.js

@@ -0,0 +1,20 @@
+import test from 'tape';
+
+import JSXAttributeMock from '../../../../__mocks__/JSXAttributeMock';
+import getImplicitRoleForMenu from '../../../../src/util/implicitRoles/menu';
+
+test('isAbstractRole', (t) => {
+  t.equal(
+    getImplicitRoleForMenu([JSXAttributeMock('type', 'toolbar')]),
+    'toolbar',
+    'works for toolbars',
+  );
+
+  t.equal(
+    getImplicitRoleForMenu([JSXAttributeMock('type', '')]),
+    '',
+    'works for non-toolbars',
+  );
+
+  t.end();
+});

package/__tests__/src/util/implicitRoles/menuitem-test.js

@@ -0,0 +1,38 @@
+import test from 'tape';
+
+import JSXAttributeMock from '../../../../__mocks__/JSXAttributeMock';
+import getImplicitRoleForMenuitem from '../../../../src/util/implicitRoles/menuitem';
+
+test('isAbstractRole', (t) => {
+  t.equal(
+    getImplicitRoleForMenuitem([JSXAttributeMock('type', 'command')]),
+    'menuitem',
+    'works for menu items',
+  );
+
+  t.equal(
+    getImplicitRoleForMenuitem([JSXAttributeMock('type', 'checkbox')]),
+    'menuitemcheckbox',
+    'works for menu item checkboxes',
+  );
+
+  t.equal(
+    getImplicitRoleForMenuitem([JSXAttributeMock('type', 'radio')]),
+    'menuitemradio',
+    'works for menu item radios',
+  );
+
+  t.equal(
+    getImplicitRoleForMenuitem([JSXAttributeMock('type', '')]),
+    '',
+    'works for non-toolbars',
+  );
+
+  t.equal(
+    getImplicitRoleForMenuitem([JSXAttributeMock('type', true)]),
+    '',
+    'works for the true case',
+  );
+
+  t.end();
+});

package/__tests__/src/util/isAbstractRole-test.js

@@ -0,0 +1,51 @@
+import test from 'tape';
+import { elementType } from 'jsx-ast-utils';
+
+import isAbstractRole from '../../../src/util/isAbstractRole';
+import {
+  genElementSymbol,
+  genAbstractRoleElements,
+  genNonAbstractRoleElements,
+} from '../../../__mocks__/genInteractives';
+
+test('isAbstractRole', (t) => {
+  t.equal(
+    isAbstractRole(undefined, []),
+    false,
+    'does NOT identify JSX Components (no tagName) as abstract role elements',
+  );
+
+  t.test('elements with an abstract role', (st) => {
+    genAbstractRoleElements().forEach(({ openingElement }) => {
+      const { attributes } = openingElement;
+      st.equal(
+        isAbstractRole(
+          elementType(openingElement),
+          attributes,
+        ),
+        true,
+        `identifies \`${genElementSymbol(openingElement)}\` as an abstract role element`,
+      );
+    });
+
+    st.end();
+  });
+
+  t.test('elements with a non-abstract role', (st) => {
+    genNonAbstractRoleElements().forEach(({ openingElement }) => {
+      const { attributes } = openingElement;
+      st.equal(
+        isAbstractRole(
+          elementType(openingElement),
+          attributes,
+        ),
+        false,
+        `does NOT identify \`${genElementSymbol(openingElement)}\` as an abstract role element`,
+      );
+    });
+
+    st.end();
+  });
+
+  t.end();
+});

package/__tests__/src/util/isContentEditable-test.js

@@ -0,0 +1,52 @@
+import test from 'tape';
+
+import isContentEditable from '../../../src/util/isContentEditable';
+import JSXAttributeMock from '../../../__mocks__/JSXAttributeMock';
+
+test('isContentEditable - HTML5', (t) => {
+  t.equal(
+    isContentEditable('some tag', [
+      JSXAttributeMock('contentEditable', 'true'),
+    ]),
+    true,
+    'identifies HTML5 contentEditable elements',
+  );
+
+  t.test('not content editable', (st) => {
+    st.equal(
+      isContentEditable('some tag', [
+        JSXAttributeMock('contentEditable', null),
+      ]),
+      false,
+      'does not identify HTML5 content editable elements with null as the value',
+    );
+
+    st.equal(
+      isContentEditable('some tag', [
+        JSXAttributeMock('contentEditable', undefined),
+      ]),
+      false,
+      'does not identify HTML5 content editable elements with undefined as the value',
+    );
+
+    st.equal(
+      isContentEditable('some tag', [
+        JSXAttributeMock('contentEditable', true),
+      ]),
+      false,
+      'does not identify HTML5 content editable elements with true as the value',
+    );
+
+    st.equal(
+      isContentEditable('some tag', [
+        JSXAttributeMock('contentEditable', 'false'),
+      ]),
+      false,
+      'does not identify HTML5 content editable elements with "false" as the value',
+    );
+
+    st.end();
+  });
+
+  t.end();
+});

package/__tests__/src/util/isDOMElement-test.js

@@ -0,0 +1,30 @@
+import test from 'tape';
+import { dom } from 'aria-query';
+import { elementType } from 'jsx-ast-utils';
+
+import isDOMElement from '../../../src/util/isDOMElement';
+import JSXElementMock from '../../../__mocks__/JSXElementMock';
+
+test('isDOMElement', (t) => {
+  t.test('DOM elements', (st) => {
+    dom.forEach((_, el) => {
+      const element = JSXElementMock(el);
+
+      st.equal(
+        isDOMElement(elementType(element.openingElement)),
+        true,
+        `identifies ${el} as a DOM element`,
+      );
+    });
+
+    st.end();
+  });
+
+  t.equal(
+    isDOMElement(JSXElementMock('CustomElement')),
+    false,
+    'does not identify a custom element',
+  );
+
+  t.end();
+});

package/__tests__/src/util/isDisabledElement-test.js

@@ -0,0 +1,88 @@
+import test from 'tape';
+
+import isDisabledElement from '../../../src/util/isDisabledElement';
+import JSXAttributeMock from '../../../__mocks__/JSXAttributeMock';
+
+test('isDisabledElement', (t) => {
+  t.test('HTML5', (st) => {
+    st.equal(
+      isDisabledElement([
+        JSXAttributeMock('disabled', 'disabled'),
+      ]),
+      true,
+      'identifies HTML5 disabled elements',
+    );
+
+    st.equal(
+      isDisabledElement([
+        JSXAttributeMock('disabled', null),
+      ]),
+      true,
+      'identifies HTML5 disabled elements with null as the value',
+    );
+
+    st.equal(
+      isDisabledElement([
+        JSXAttributeMock('disabled', undefined),
+      ]),
+      false,
+      'does not identify HTML5 disabled elements with undefined as the value',
+    );
+
+    st.end();
+  });
+
+  t.test('ARIA', (st) => {
+    st.equal(
+      isDisabledElement([
+        JSXAttributeMock('aria-disabled', 'true'),
+      ]),
+      true,
+      'does not identify ARIA disabled elements',
+    );
+
+    st.equal(
+      isDisabledElement([
+        JSXAttributeMock('aria-disabled', true),
+      ]),
+      true,
+      'does not identify ARIA disabled elements',
+    );
+
+    st.equal(
+      isDisabledElement([
+        JSXAttributeMock('aria-disabled', 'false'),
+      ]),
+      false,
+      'does not identify ARIA disabled elements',
+    );
+
+    st.equal(
+      isDisabledElement([
+        JSXAttributeMock('aria-disabled', false),
+      ]),
+      false,
+      'does not identify ARIA disabled elements',
+    );
+
+    st.equal(
+      isDisabledElement([
+        JSXAttributeMock('aria-disabled', null),
+      ]),
+      false,
+      'does not identify ARIA disabled elements with null as the value',
+    );
+
+    st.equal(
+      isDisabledElement([
+        JSXAttributeMock('aria-disabled', undefined),
+      ]),
+      false,
+      'does not identify ARIA disabled elements with undefined as the value',
+    );
+
+    st.end();
+  });
+
+  t.end();
+});