module.exports = { plugins: [ 'jsx-a11y', 'react' ], parserOptions: { ecmaFeatures: { jsx: true, }, }, rules: { // ensure emoji are accessible // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/accessible-emoji.md // disabled; rule is deprecated 'jsx-a11y/accessible-emoji': 'off', // Enforce that all elements that require alternative text have meaningful information // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/alt-text.md 'jsx-a11y/alt-text': ['error', { elements: ['img', 'object', 'area', 'input[type="image"]'], img: [], object: [], area: [], 'input[type="image"]': [], }], // Enforce that anchors have content // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/anchor-has-content.md 'jsx-a11y/anchor-has-content': ['error', { components: [] }], // ensure tags are valid // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/0745af376cdc8686d85a361ce36952b1fb1ccf6e/docs/rules/anchor-is-valid.md 'jsx-a11y/anchor-is-valid': ['error', { components: ['Link'], specialLink: ['to'], aspects: ['noHref', 'invalidHref', 'preferButton'], }], // elements with aria-activedescendant must be tabbable // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/aria-activedescendant-has-tabindex.md 'jsx-a11y/aria-activedescendant-has-tabindex': 'error', // Enforce all aria-* props are valid. // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/aria-props.md 'jsx-a11y/aria-props': 'error', // Enforce ARIA state and property values are valid. // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/aria-proptypes.md 'jsx-a11y/aria-proptypes': 'error', // Require ARIA roles to be valid and non-abstract // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/aria-role.md 'jsx-a11y/aria-role': ['error', { ignoreNonDOM: false }], // Enforce that elements that do not support ARIA roles, states, and // properties do not have those attributes. // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/aria-unsupported-elements.md 'jsx-a11y/aria-unsupported-elements': 'error', // Ensure the autocomplete attribute is correct and suitable for the form field it is used with // https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/29c68596b15c4ff0a40daae6d4a2670e36e37d35/docs/rules/autocomplete-valid.md 'jsx-a11y/autocomplete-valid': ['off', { inputComponents: [], }], // require onClick be accompanied by onKeyUp/onKeyDown/onKeyPress // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/click-events-have-key-events.md 'jsx-a11y/click-events-have-key-events': 'error', // Enforce that a control (an interactive element) has a text label. // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/control-has-associated-label.md 'jsx-a11y/control-has-associated-label': ['error', { labelAttributes: ['label'], controlComponents: [], ignoreElements: [ 'audio', 'canvas', 'embed', 'input', 'textarea', 'tr', 'video', ], ignoreRoles: [ 'grid', 'listbox', 'menu', 'menubar', 'radiogroup', 'row', 'tablist', 'toolbar', 'tree', 'treegrid', ], depth: 5, }], // ensure tags have content and are not aria-hidden // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/heading-has-content.md 'jsx-a11y/heading-has-content': ['error', { components: [''] }], // require HTML elements to have a "lang" prop // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/html-has-lang.md 'jsx-a11y/html-has-lang': 'error', // ensure iframe elements have a unique title // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/iframe-has-title.md 'jsx-a11y/iframe-has-title': 'error', // Prevent img alt text from containing redundant words like "image", "picture", or "photo" // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/img-redundant-alt.md 'jsx-a11y/img-redundant-alt': 'error', // Elements with an interactive role and interaction handlers must be focusable // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/interactive-supports-focus.md 'jsx-a11y/interactive-supports-focus': 'error', // Enforce that a label tag has a text label and an associated control. // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/b800f40a2a69ad48015ae9226fbe879f946757ed/docs/rules/label-has-associated-control.md 'jsx-a11y/label-has-associated-control': ['error', { labelComponents: [], labelAttributes: [], controlComponents: [], assert: 'both', depth: 25 }], // require HTML element's lang prop to be valid // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/lang.md 'jsx-a11y/lang': 'error', // media elements must have captions // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/media-has-caption.md 'jsx-a11y/media-has-caption': ['error', { audio: [], video: [], track: [], }], // require that mouseover/out come with focus/blur, for keyboard-only users // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/mouse-events-have-key-events.md 'jsx-a11y/mouse-events-have-key-events': 'error', // Prevent use of `accessKey` // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-access-key.md 'jsx-a11y/no-access-key': 'error', // prohibit autoFocus prop // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-autofocus.md 'jsx-a11y/no-autofocus': ['error', { ignoreNonDOM: true }], // prevent distracting elements, like and // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-distracting-elements.md 'jsx-a11y/no-distracting-elements': ['error', { elements: ['marquee', 'blink'], }], // WAI-ARIA roles should not be used to convert an interactive element to non-interactive // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-interactive-element-to-noninteractive-role.md 'jsx-a11y/no-interactive-element-to-noninteractive-role': ['error', { tr: ['none', 'presentation'], }], // A non-interactive element does not support event handlers (mouse and key handlers) // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-noninteractive-element-interactions.md 'jsx-a11y/no-noninteractive-element-interactions': ['error', { handlers: [ 'onClick', 'onMouseDown', 'onMouseUp', 'onKeyPress', 'onKeyDown', 'onKeyUp', ] }], // WAI-ARIA roles should not be used to convert a non-interactive element to interactive // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-noninteractive-element-to-interactive-role.md 'jsx-a11y/no-noninteractive-element-to-interactive-role': ['error', { ul: ['listbox', 'menu', 'menubar', 'radiogroup', 'tablist', 'tree', 'treegrid'], ol: ['listbox', 'menu', 'menubar', 'radiogroup', 'tablist', 'tree', 'treegrid'], li: ['menuitem', 'option', 'row', 'tab', 'treeitem'], table: ['grid'], td: ['gridcell'], }], // Tab key navigation should be limited to elements on the page that can be interacted with. // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-noninteractive-tabindex.md 'jsx-a11y/no-noninteractive-tabindex': ['error', { tags: [], roles: ['tabpanel'], }], // require onBlur instead of onChange // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-onchange.md 'jsx-a11y/no-onchange': 'off', // ensure HTML elements do not specify redundant ARIA roles // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-redundant-roles.md 'jsx-a11y/no-redundant-roles': 'error', // Enforce that DOM elements without semantic behavior not have interaction handlers // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-static-element-interactions.md 'jsx-a11y/no-static-element-interactions': ['error', { handlers: [ 'onClick', 'onMouseDown', 'onMouseUp', 'onKeyPress', 'onKeyDown', 'onKeyUp', ] }], // Enforce that elements with ARIA roles must have all required attributes // for that role. // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/role-has-required-aria-props.md 'jsx-a11y/role-has-required-aria-props': 'error', // Enforce that elements with explicit or implicit roles defined contain // only aria-* properties supported by that role. // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/role-supports-aria-props.md 'jsx-a11y/role-supports-aria-props': 'error', // only allow to have the "scope" attr // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/scope.md 'jsx-a11y/scope': 'error', // Enforce tabIndex value is not greater than zero. // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/tabindex-no-positive.md 'jsx-a11y/tabindex-no-positive': 'error', // ---------------------------------------------------- // Rules that no longer exist in eslint-plugin-jsx-a11y // ---------------------------------------------------- // require that JSX labels use "htmlFor" // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/label-has-for.md // deprecated: replaced by `label-has-associated-control` rule 'jsx-a11y/label-has-for': ['off', { components: [], required: { every: ['nesting', 'id'], }, allowChildren: false, }], }, };