Socket
Socket
Sign inDemoInstall

eslint-plugin-jsx-a11y

Package Overview
Dependencies
154
Maintainers
2
Versions
81
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 2.1.0 to 2.2.0

docs/rules/click-events-have-key-events.md

9

CHANGELOG.md

@@ -0,1 +1,10 @@

2.2.0 / 2016-08-26
==================
- [new] Add `click-events-have-key-events` rule.
- [new] Add `no-static-element-interactions` rule.
- [devDependencies] Upgrade `eslint`, `eslint-config-airbnb`, `mocha` to latest.
- [lint] Fix all new linting errors with upgrade
- [nit] Use `error` syntax over `2` syntax in recommended config.
2.1.0 / 2016-08-10

@@ -2,0 +11,0 @@ ==================

4

docs/rules/mouse-events-have-key-events.md
# mouse-events-have-key-events
Enforce onmouseover/onmouseout are accompanied by onfocus/onblur. Coding for the keyboard is important for users with physical disabilities who cannot use a mouse, AT compatability, and screenreader users.
Enforce onmouseover/onmouseout are accompanied by onfocus/onblur. Coding for the keyboard is important for users with physical disabilities who cannot use a mouse, AT compatibility, and screenreader users.

@@ -25,2 +25,2 @@ ## Rule details

<div onMouseOut={ () => void 0 } {...otherProps} />
```
```

@@ -12,2 +12,3 @@ 'use strict';

'aria-unsupported-elements': require('./rules/aria-unsupported-elements'),
'click-events-have-key-events': require('./rules/click-events-have-key-events'),
'heading-has-content': require('./rules/heading-has-content'),

@@ -24,2 +25,3 @@ 'href-no-hash': require('./rules/href-no-hash'),

'no-onchange': require('./rules/no-onchange'),
'no-static-element-interactions': require('./rules/no-static-element-interactions'),
'onclick-has-focus': require('./rules/onclick-has-focus'),

@@ -40,23 +42,25 @@ 'onclick-has-role': require('./rules/onclick-has-role'),

rules: {
'jsx-a11y/anchor-has-content': 2,
'jsx-a11y/aria-props': 2,
'jsx-a11y/aria-proptypes': 2,
'jsx-a11y/aria-role': 2,
'jsx-a11y/aria-unsupported-elements': 2,
'jsx-a11y/heading-has-content': 2,
'jsx-a11y/href-no-hash': 2,
'jsx-a11y/html-has-lang': 2,
'jsx-a11y/img-has-alt': 2,
'jsx-a11y/img-redundant-alt': 2,
'jsx-a11y/label-has-for': 2,
'jsx-a11y/mouse-events-have-key-events': 2,
'jsx-a11y/no-access-key': 2,
'jsx-a11y/no-marquee': 2,
'jsx-a11y/no-onchange': 2,
'jsx-a11y/onclick-has-focus': 2,
'jsx-a11y/onclick-has-role': 2,
'jsx-a11y/role-has-required-aria-props': 2,
'jsx-a11y/role-supports-aria-props': 2,
'jsx-a11y/scope': 2,
'jsx-a11y/tabindex-no-positive': 2
'jsx-a11y/anchor-has-content': 'error',
'jsx-a11y/aria-props': 'error',
'jsx-a11y/aria-proptypes': 'error',
'jsx-a11y/aria-role': 'error',
'jsx-a11y/aria-unsupported-elements': 'error',
'jsx-a11y/click-events-have-key-events': 'error',
'jsx-a11y/heading-has-content': 'error',
'jsx-a11y/href-no-hash': 'error',
'jsx-a11y/html-has-lang': 'error',
'jsx-a11y/img-has-alt': 'error',
'jsx-a11y/img-redundant-alt': 'error',
'jsx-a11y/label-has-for': 'error',
'jsx-a11y/mouse-events-have-key-events': 'error',
'jsx-a11y/no-access-key': 'error',
'jsx-a11y/no-marquee': 'error',
'jsx-a11y/no-onchange': 'error',
'jsx-a11y/no-static-element-interactions': 'warn',
'jsx-a11y/onclick-has-focus': 'error',
'jsx-a11y/onclick-has-role': 'error',
'jsx-a11y/role-has-required-aria-props': 'error',
'jsx-a11y/role-supports-aria-props': 'error',
'jsx-a11y/scope': 'error',
'jsx-a11y/tabindex-no-positive': 'error'
}

@@ -63,0 +67,0 @@ }

'use strict';
var _jsxAstUtils = require('jsx-ast-utils');
var _ARIA = require('../util/attributes/ARIA');

@@ -11,4 +13,2 @@

var _jsxAstUtils = require('jsx-ast-utils');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

@@ -15,0 +15,0 @@

'use strict';
var _jsxAstUtils = require('jsx-ast-utils');
var _ARIA = require('../util/attributes/ARIA');

@@ -7,4 +9,2 @@

var _jsxAstUtils = require('jsx-ast-utils');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

@@ -11,0 +11,0 @@

'use strict';
var _jsxAstUtils = require('jsx-ast-utils');
var _role = require('../util/attributes/role');

@@ -7,4 +9,2 @@

var _jsxAstUtils = require('jsx-ast-utils');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

@@ -11,0 +11,0 @@

'use strict';
var _jsxAstUtils = require('jsx-ast-utils');
var _DOM = require('../util/attributes/DOM');

@@ -11,4 +13,2 @@

var _jsxAstUtils = require('jsx-ast-utils');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

@@ -39,6 +39,8 @@

var nodeType = (0, _jsxAstUtils.elementType)(node);
var nodeAttrs = _DOM2.default[nodeType];
var isReservedNodeType = nodeAttrs && nodeAttrs.reserved || false;
var nodeAttrs = _DOM2.default[nodeType] || {};
var _nodeAttrs$reserved = nodeAttrs.reserved;
var isReservedNodeType = _nodeAttrs$reserved === undefined ? false : _nodeAttrs$reserved;
// If it's not reserved, then it can have ARIA-* roles, states, and properties
if (isReservedNodeType === false) {

@@ -45,0 +47,0 @@ return;

'use strict';
var _jsxAstUtils = require('jsx-ast-utils');
var _isHiddenFromScreenReader = require('../util/isHiddenFromScreenReader');

@@ -11,4 +13,2 @@

var _jsxAstUtils = require('jsx-ast-utils');
var _getTabIndex = require('../util/getTabIndex');

@@ -15,0 +15,0 @@

'use strict';
var _jsxAstUtils = require('jsx-ast-utils');
var _isHiddenFromScreenReader = require('../util/isHiddenFromScreenReader');

@@ -11,4 +13,2 @@

var _jsxAstUtils = require('jsx-ast-utils');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

@@ -15,0 +15,0 @@

'use strict';
var _jsxAstUtils = require('jsx-ast-utils');
var _role = require('../util/attributes/role');

@@ -7,4 +9,2 @@

var _jsxAstUtils = require('jsx-ast-utils');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

@@ -11,0 +11,0 @@

'use strict';
var _jsxAstUtils = require('jsx-ast-utils');
var _role = require('../util/attributes/role');

@@ -15,4 +17,2 @@

var _jsxAstUtils = require('jsx-ast-utils');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

@@ -19,0 +19,0 @@

@@ -61,3 +61,3 @@ 'use strict';

if (interactiveMap.hasOwnProperty(tagName) === false) {
if ({}.hasOwnProperty.call(interactiveMap, tagName) === false) {
return false;

@@ -64,0 +64,0 @@ }

{
"name": "eslint-plugin-jsx-a11y",
"version": "2.1.0",
"version": "2.2.0",
"description": "A static analysis linter of jsx and their accessibility with screen readers.",

@@ -24,2 +24,3 @@ "keywords": [

"lint": "eslint --config .eslintrc src tests",
"lint:fix": "npm run lint -- fix",
"pretest": "npm run lint",

@@ -34,7 +35,7 @@ "test": "istanbul cover --dir reports/coverage node_modules/mocha/bin/_mocha tests/**/*.js -- --compilers js:babel-core/register --reporter dot"

"coveralls": "^2.11.8",
"eslint": "^2.10.2",
"eslint-config-airbnb-base": "^3.0.1",
"eslint": "^3.0.0",
"eslint-config-airbnb-base": "^5.0.0",
"eslint-plugin-import": "^1.8.1",
"istanbul": "^1.0.0-alpha.2",
"mocha": "^2.4.5",
"mocha": "^3.0.0",
"rimraf": "^2.5.2"

@@ -41,0 +42,0 @@ },

@@ -78,2 +78,3 @@ <p align="center">

- [aria-unsupported-elements](docs/rules/aria-unsupported-elements.md): Enforce that elements that do not support ARIA roles, states, and properties do not have those attributes.
- [click-events-have-key-events](docs/rules/click-events-have-key-events.md): Enforce a clickable non-interactive element has at least one keyboard event listener.
- [heading-has-content](docs/rules/heading-has-content.md): Enforce heading (`h1`, `h2`, etc) elements contain accessible content.

@@ -90,2 +91,3 @@ - [href-no-hash](docs/rules/href-no-hash.md): Enforce an anchor element's `href` prop value is not just `#`.

- [no-onchange](docs/rules/no-onchange.md): Enforce usage of `onBlur` over `onChange` on select menus for accessibility.
- [no-static-element-interactions](docs/rules/no-static-element-interactions.md): Enforce non-interactive elements have no interactive handlers.
- [onclick-has-focus](docs/rules/onclick-has-focus.md): Enforce that elements with `onClick` handlers must be focusable.

@@ -92,0 +94,0 @@ - [onclick-has-role](docs/rules/onclick-has-role.md): Enforce that non-interactive, visible elements (such as `<div>`) that have click handlers use the role attribute.

@@ -10,2 +10,3 @@ /* eslint-disable global-require */

'aria-unsupported-elements': require('./rules/aria-unsupported-elements'),
'click-events-have-key-events': require('./rules/click-events-have-key-events'),
'heading-has-content': require('./rules/heading-has-content'),

@@ -22,2 +23,3 @@ 'href-no-hash': require('./rules/href-no-hash'),

'no-onchange': require('./rules/no-onchange'),
'no-static-element-interactions': require('./rules/no-static-element-interactions'),
'onclick-has-focus': require('./rules/onclick-has-focus'),

@@ -38,23 +40,25 @@ 'onclick-has-role': require('./rules/onclick-has-role'),

rules: {
'jsx-a11y/anchor-has-content': 2,
'jsx-a11y/aria-props': 2,
'jsx-a11y/aria-proptypes': 2,
'jsx-a11y/aria-role': 2,
'jsx-a11y/aria-unsupported-elements': 2,
'jsx-a11y/heading-has-content': 2,
'jsx-a11y/href-no-hash': 2,
'jsx-a11y/html-has-lang': 2,
'jsx-a11y/img-has-alt': 2,
'jsx-a11y/img-redundant-alt': 2,
'jsx-a11y/label-has-for': 2,
'jsx-a11y/mouse-events-have-key-events': 2,
'jsx-a11y/no-access-key': 2,
'jsx-a11y/no-marquee': 2,
'jsx-a11y/no-onchange': 2,
'jsx-a11y/onclick-has-focus': 2,
'jsx-a11y/onclick-has-role': 2,
'jsx-a11y/role-has-required-aria-props': 2,
'jsx-a11y/role-supports-aria-props': 2,
'jsx-a11y/scope': 2,
'jsx-a11y/tabindex-no-positive': 2,
'jsx-a11y/anchor-has-content': 'error',
'jsx-a11y/aria-props': 'error',
'jsx-a11y/aria-proptypes': 'error',
'jsx-a11y/aria-role': 'error',
'jsx-a11y/aria-unsupported-elements': 'error',
'jsx-a11y/click-events-have-key-events': 'error',
'jsx-a11y/heading-has-content': 'error',
'jsx-a11y/href-no-hash': 'error',
'jsx-a11y/html-has-lang': 'error',
'jsx-a11y/img-has-alt': 'error',
'jsx-a11y/img-redundant-alt': 'error',
'jsx-a11y/label-has-for': 'error',
'jsx-a11y/mouse-events-have-key-events': 'error',
'jsx-a11y/no-access-key': 'error',
'jsx-a11y/no-marquee': 'error',
'jsx-a11y/no-onchange': 'error',
'jsx-a11y/no-static-element-interactions': 'warn',
'jsx-a11y/onclick-has-focus': 'error',
'jsx-a11y/onclick-has-role': 'error',
'jsx-a11y/role-has-required-aria-props': 'error',
'jsx-a11y/role-supports-aria-props': 'error',
'jsx-a11y/scope': 'error',
'jsx-a11y/tabindex-no-positive': 'error',
},

@@ -61,0 +65,0 @@ },

@@ -10,5 +10,5 @@ /**

import { propName } from 'jsx-ast-utils';
import ariaAttributes from '../util/attributes/ARIA';
import getSuggestion from '../util/getSuggestion';
import { propName } from 'jsx-ast-utils';

@@ -15,0 +15,0 @@ const errorMessage = name => {

@@ -10,4 +10,4 @@ /**

import { getLiteralPropValue, propName } from 'jsx-ast-utils';
import ariaAttributes from '../util/attributes/ARIA';
import { getLiteralPropValue, propName } from 'jsx-ast-utils';

@@ -14,0 +14,0 @@ const errorMessage = (name, type, permittedValues) => {

@@ -10,4 +10,4 @@ /**

import { getLiteralPropValue, propName } from 'jsx-ast-utils';
import roles from '../util/attributes/role';
import { getLiteralPropValue, propName } from 'jsx-ast-utils';

@@ -14,0 +14,0 @@ const errorMessage = 'Elements with ARIA roles must use a valid, non-abstract ARIA role.';

@@ -11,5 +11,5 @@ /**

import { elementType, propName } from 'jsx-ast-utils';
import DOM from '../util/attributes/DOM';
import ARIA from '../util/attributes/ARIA';
import { elementType, propName } from 'jsx-ast-utils';

@@ -32,4 +32,6 @@ const errorMessage = invalidProp =>

const nodeType = elementType(node);
const nodeAttrs = DOM[nodeType];
const isReservedNodeType = nodeAttrs && nodeAttrs.reserved || false;
const nodeAttrs = DOM[nodeType] || {};
const {
reserved: isReservedNodeType = false,
} = nodeAttrs;

@@ -36,0 +38,0 @@ // If it's not reserved, then it can have ARIA-* roles, states, and properties

@@ -6,5 +6,5 @@ /**

import { getProp, elementType } from 'jsx-ast-utils';
import isHiddenFromScreenReader from '../util/isHiddenFromScreenReader';
import isInteractiveElement from '../util/isInteractiveElement';
import { getProp, elementType } from 'jsx-ast-utils';
import getTabIndex from '../util/getTabIndex';

@@ -11,0 +11,0 @@

@@ -7,5 +7,5 @@ /**

import { getProp, getPropValue, elementType } from 'jsx-ast-utils';
import isHiddenFromScreenReader from '../util/isHiddenFromScreenReader';
import isInteractiveElement from '../util/isInteractiveElement';
import { getProp, getPropValue, elementType } from 'jsx-ast-utils';

@@ -12,0 +12,0 @@ // ----------------------------------------------------------------------------

@@ -11,6 +11,5 @@ /**

import { getProp, getLiteralPropValue, propName } from 'jsx-ast-utils';
import validRoleTypes from '../util/attributes/role';
import { getProp, getLiteralPropValue, propName } from 'jsx-ast-utils';
const errorMessage = (role, requiredProps) =>

@@ -17,0 +16,0 @@ `Elements with the ARIA role "${role}" must have the following ` +

@@ -11,6 +11,6 @@ /**

import { getProp, getLiteralPropValue, elementType, propName } from 'jsx-ast-utils';
import ROLES from '../util/attributes/role';
import ARIA from '../util/attributes/ARIA';
import getImplicitRole from '../util/getImplicitRole';
import { getProp, getLiteralPropValue, elementType, propName } from 'jsx-ast-utils';

@@ -17,0 +17,0 @@ const errorMessage = (attr, role, tag, isImplicit) => {

@@ -37,3 +37,3 @@ import { getProp, getPropValue, getLiteralPropValue } from 'jsx-ast-utils';

if (interactiveMap.hasOwnProperty(tagName) === false) {
if ({}.hasOwnProperty.call(interactiveMap, tagName) === false) {
return false;

@@ -40,0 +40,0 @@ }

/* eslint-env mocha */
import plugin from '../src';

@@ -7,2 +6,3 @@ import assert from 'assert';

import path from 'path';
import plugin from '../src';

@@ -9,0 +9,0 @@ const rules = fs.readdirSync(path.resolve(__dirname, '../src/rules/'))

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/anchor-has-content';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

@@ -10,6 +10,6 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/aria-props';
import ariaAttributes from '../../../src/util/attributes/ARIA';
import getSuggestion from '../../../src/util/getSuggestion';
import { RuleTester } from 'eslint';

@@ -16,0 +16,0 @@ const parserOptions = {

@@ -10,4 +10,5 @@ /**

import { RuleTester } from 'eslint';
import ariaAttributes from '../../../src/util/attributes/ARIA';
import rule from '../../../src/rules/aria-proptypes';
import { RuleTester } from 'eslint';

@@ -27,4 +28,2 @@ const parserOptions = {

import ariaAttributes from '../../../src/util/attributes/ARIA';
const errorMessage = name => {

@@ -31,0 +30,0 @@ const { type, values: permittedValues } = ariaAttributes[name.toUpperCase()];

@@ -10,6 +10,6 @@ /**

import { RuleTester } from 'eslint';
import assign from 'object-assign';
import rule from '../../../src/rules/aria-role';
import { RuleTester } from 'eslint';
import ROLES from '../../../src/util/attributes/role';
import assign from 'object-assign';

@@ -16,0 +16,0 @@ const parserOptions = {

@@ -11,4 +11,5 @@ /**

import { RuleTester } from 'eslint';
import DOM from '../../../src/util/attributes/DOM';
import rule from '../../../src/rules/aria-unsupported-elements';
import { RuleTester } from 'eslint';

@@ -28,4 +29,2 @@ const parserOptions = {

import DOM from '../../../src/util/attributes/DOM';
const errorMessage = invalidProp => ({

@@ -32,0 +31,0 @@ message: `This element does not support ARIA roles, states and properties. \

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/heading-has-content';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/href-no-hash';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/html-has-lang';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/img-has-alt';
import { RuleTester } from 'eslint';

@@ -153,3 +153,4 @@ const parserOptions = {

errors: [missingPropError('Avatar')],
options: string, parserOptions,
options: string,
parserOptions,
},

@@ -156,0 +157,0 @@ {

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/img-redundant-alt';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/label-has-for';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/lang';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

@@ -11,4 +11,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/mouse-events-have-key-events';
import { RuleTester } from 'eslint';

@@ -15,0 +15,0 @@ const parserOptions = {

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/no-access-key';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/no-marquee';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

@@ -11,4 +11,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/no-onchange';
import { RuleTester } from 'eslint';

@@ -15,0 +15,0 @@ const parserOptions = {

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/onclick-has-focus';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/onclick-has-role';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

@@ -11,4 +11,5 @@ /**

import { RuleTester } from 'eslint';
import validRoleTypes from '../../../src/util/attributes/role';
import rule from '../../../src/rules/role-has-required-aria-props';
import { RuleTester } from 'eslint';

@@ -28,4 +29,2 @@ const parserOptions = {

import validRoleTypes from '../../../src/util/attributes/role';
const errorMessage = role => {

@@ -32,0 +31,0 @@ const requiredProps = validRoleTypes[role.toUpperCase()].requiredProps.toString().toLowerCase();

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/role-supports-aria-props';
import { RuleTester } from 'eslint';
import ROLES from '../../../src/util/attributes/role';

@@ -14,0 +14,0 @@ import ARIA from '../../../src/util/attributes/ARIA';

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/scope';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

@@ -10,4 +10,4 @@ /**

import { RuleTester } from 'eslint';
import rule from '../../../src/rules/tabindex-no-positive';
import { RuleTester } from 'eslint';

@@ -14,0 +14,0 @@ const parserOptions = {

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc