eslint-config-pcln-accessibility

Sharable eslint accessibility rules by priceline

Usage

If you want to use this ESLint configuration in a project, you can install it with the following steps.

First, install this package, ESLint and the necessary plugins.

npm install --save-dev eslint-config-pcln-accessibility eslint-plugin-jsx-a11y@6.x

Then create a file named .eslintrc with following contents in the root folder of your project (or add it to your existing .eslintrc file):

{
  "extends": "pcln-accessibility"
}

That's it! You will now see warnings in your editor if you're violating accessibility eslint rules

Accessibility Checks

The following rules from the eslint-plugin-jsx-a11y plugin are activated with warnings:

• alt-text
• anchor-has-content
• anchor-is-valid
• aria-activedescendant-has-tabindex
• aria-props
• aria-proptypes
• aria-role
• aria-unsupported-elements
• click-events-have-key-events
• heading-has-content
• lable-has-for
• img-redundant-alt
• no-access-key
• no-distracting-elements
• no-interactive-element-to-noninteractive-role
• no-noninteractive-tabindex
• no-static-element-interactions
• no-redundant-roles
• role-has-required-aria-props
• role-supports-aria-props
• scope
• tabindex-no-positive