Skip to content
This repository has been archived by the owner on Jul 15, 2023. It is now read-only.

Commit

Permalink
[Issue #211,#212,#213,#214,#215,#216] Renamed a11y rules to be prefix…
Browse files Browse the repository at this point in the history
…ed with react-
  • Loading branch information
HamletDRC committed Sep 2, 2016
1 parent 03c8deb commit 311d69a
Show file tree
Hide file tree
Showing 16 changed files with 56 additions and 51 deletions.
12 changes: 6 additions & 6 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -70,12 +70,6 @@ Supported Rules

Rule Name | Description | Since
:---------- | :------------ | -------------
`a11y-img-has-alt` | Enforce that an `img` element contains the `alt` attribute or `role='presentation'` for decorative image. All images must have `alt` text to convey their purpose and meaning to **screen reader users**. Besides, the `alt` attribute specifies an alternate text for an image, if the image cannot be displayed. | 2.0.11
`a11y-props` | Enforce all `aria-*` attributes are valid. Elements cannot use an invalid `aria-*` attribute. This rule will fail if it finds an `aria-*` attribute that is not listed in [WAI-ARIA states and properties](https://www.w3.org/TR/wai-aria/states_and_properties#state_prop_def). | 2.0.11
`a11y-role-has-required-aria-props` | Elements with aria roles must have all required attributes according to the role. | 2.0.11
`a11y-role` | Elements with aria roles must use a **valid**, **non-abstract** aria role. A reference to role defintions can be found at [WAI-ARIA roles](https://www.w3.org/TR/wai-aria/roles#role_definitions). | 2.0.11
`a11y-role-supports-aria-props` | Enforce that elements with explicit or implicit roles defined contain only `aria-*` properties supported by that `role`. Many aria attributes (states and properties) can only be used on elements with particular roles. Some elements have implicit roles, such as `<a href='hrefValue' />`, which will be resolved to `role='link'`. A reference for the implicit roles can be found at [Default Implicit ARIA Semantics](https://www.w3.org/TR/html-aria/#sec-strong-native-semantics). | 2.0.11
`a11y-tabindex-no-positive` | Enforce tabindex value is **not greater than zero**. Avoid positive tabindex attribute values to synchronize the flow of the page with keyboard tab order. | 2.0.11
`chai-prefer-contains-to-index-of` | Avoid Chai assertions that invoke indexOf and compare for a -1 result. It is better to use the chai .contain() assertion API instead because the failure message will be more clearer if the test fails. | 2.0.10
`chai-vague-errors` | Avoid Chai assertions that result in vague errors. For example, asserting `expect(something).to.be.true` will result in the failure message "Expected true received false". This is a vague error message that does not reveal the underlying problem. It is especially vague in TypeScript because stack trace line numbers often do not match the source code. A better pattern to follow is the xUnit Patterns [Assertion Message](http://xunitpatterns.com/Assertion%20Message.html) pattern. The previous code sample could be better written as `expect(something).to.equal(true, 'expected something to have occurred');`| 1.0
`export-name` | The name of the exported module must match the filename of the source file. This is case-sensitive but ignores file extension. Since version 1.0, this rule takes a list of regular expressions as a parameter. Any export name matching that regular expression will be ignored. For example, to allow an exported name like myChartOptions, then configure the rule like this: "export-name": \[true, "myChartOptionsg"\]| 0.0.3
Expand Down Expand Up @@ -140,8 +134,14 @@ Rule Name | Description | Since
`prefer-type-cast` | Prefer the tradition type casts instead of the new 'as-cast' syntax. For example, prefer '<string>myVariable' instead of 'myVariable as string'. Rule ignores any file ending in .tsx. If you prefer the opposite and want to see the 'as type' casts, then enable the tslint rule named 'no-angle-bracket-type-assertion'| 2.0.4
`promise-must-complete` | When a Promise instance is created, then either the reject() or resolve() parameter must be called on it within all code branches in the scope. For more examples see the [feature request](https://github.com/Microsoft/tslint-microsoft-contrib/issues/34). | 1.0
`react-iframe-missing-sandbox` | React iframes must specify a sandbox attribute. If specified as an empty string, this attribute enables extra restrictions on the content that can appear in the inline frame. The value of the attribute can either be an empty string (all the restrictions are applied), or a space-separated list of tokens that lift particular restrictions. You many not use both allow-scripts and allow-same-origin at the same time, as that allows the embedded document to programmatically remove the sandbox attribute in some scenarios. | 2.0.10
`react-a11y-img-has-alt` | Enforce that an `img` element contains the `alt` attribute or `role='presentation'` for decorative image. All images must have `alt` text to convey their purpose and meaning to **screen reader users**. Besides, the `alt` attribute specifies an alternate text for an image, if the image cannot be displayed. | 2.0.11
`react-a11y-lang` | For accessibility of your website, html elements must have a lang attribute and the attribute must be a valid language code.<br/>References:<br/>* [H58: Using language attributes to identify changes in the human language](https://www.w3.org/TR/WCAG20-TECHS/H58.html)<br/>* [lang attribute must have a valid value](https://dequeuniversity.com/rules/axe/1.1/valid-lang)<br/>[List of ISO 639-1 codes](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes) | 2.0.11
`react-a11y-meta` | For accessibility of your website, HTML meta elements must not have http-equiv="refresh". | 2.0.11
`react-a11y-props` | Enforce all `aria-*` attributes are valid. Elements cannot use an invalid `aria-*` attribute. This rule will fail if it finds an `aria-*` attribute that is not listed in [WAI-ARIA states and properties](https://www.w3.org/TR/wai-aria/states_and_properties#state_prop_def). | 2.0.11
`react-a11y-role-has-required-aria-props` | Elements with aria roles must have all required attributes according to the role. | 2.0.11
`react-a11y-role-supports-aria-props` | Enforce that elements with explicit or implicit roles defined contain only `aria-*` properties supported by that `role`. Many aria attributes (states and properties) can only be used on elements with particular roles. Some elements have implicit roles, such as `<a href='hrefValue' />`, which will be resolved to `role='link'`. A reference for the implicit roles can be found at [Default Implicit ARIA Semantics](https://www.w3.org/TR/html-aria/#sec-strong-native-semantics). | 2.0.11
`react-a11y-role` | Elements with aria roles must use a **valid**, **non-abstract** aria role. A reference to role defintions can be found at [WAI-ARIA roles](https://www.w3.org/TR/wai-aria/roles#role_definitions). | 2.0.11
`react-a11y-tabindex-no-positive` | Enforce tabindex value is **not greater than zero**. Avoid positive tabindex attribute values to synchronize the flow of the page with keyboard tab order. | 2.0.11
`react-a11y-titles` | For accessibility of your website, HTML title elements must not be empty, must be more than one word, and must not be more than 60 characters long.<br/>References:<br/>* [WCAG 2.0 - Requirement 2.4.2 Page Titled (Level A)](http://www.w3.org/TR/WCAG20/#navigation-mechanisms-title)<br/>* [OAA-Accessibility Rule 13: Title element should not be empty](http://oaa-accessibility.org/wcag20/rule/13/)<br/>* [OAA-Accessibility Rule 24: Title content should be concise](http://oaa-accessibility.org/wcag20/rule/24/)<br/>* [OAA-Accessibility Rule 25: Title text must contain more than one word](http://oaa-accessibility.org/wcag20/rule/25/)<br/> | 2.0.11
`react-no-dangerous-html` | Do not use React's dangerouslySetInnerHTML API. This rule finds usages of the dangerouslySetInnerHTML API (but not any JSX references). For more info see the [react-no-dangerous-html Rule wiki page](https://github.com/Microsoft/tslint-microsoft-contrib/wiki/react-no-dangerous-html-Rule). | 0.0.2
`react-this-binding-issue` | Several errors can occur when using React and React.Component subclasses. When using React components you must be careful to correctly bind the 'this' reference on any methods that you pass off to child components as callbacks. For example, it is common to define a private method called 'onClick' and then specify `onClick={this.onClick}` as a JSX attribute. If you do this then the 'this' reference will be undefined when your private method is invoked. The React documentation suggests that you bind the 'this' reference on all of your methods within the constructor: `this.onClick = this.onClick.bind(this);`. This rule will create a violation if 1) a method reference is passed to a JSX attribute without being bound in the constructor. And 2) a method is bound multiple times in the constructor. Another issue that can occur is binding the 'this' reference to a function within the render() method. For example, many people will create an anonymous lambda within the JSX attribute to avoid the 'this' binding issue: `onClick={() => { this.onClick(); }}`. The problem with this is that a new instance of an anonymous function is created every time render() is invoked. When React compares virutal DOM properties within shouldComponentUpdate() then the onClick property will look like a new property and force a re-render. You should avoid this pattern because creating function instances within render methods breaks any logic within shouldComponentUpdate() methods. This rule creates violations if 1) an anonymous function is passed as a JSX attribute. And 2) if a function instantiated in local scope is passed as a JSX attribute. This rule can be configured via the "allow-anonymous-listeners" parameter. If you want to suppress violations for the anonymous listener scenarios then configure that rule like this: `"react-this-binding-issue": [ true, { 'allow-anonymous-listeners': true } ]` | 2.0.8, 2.0.9
Expand Down
6 changes: 6 additions & 0 deletions recommended_ruleset.js
Original file line number Diff line number Diff line change
Expand Up @@ -128,6 +128,12 @@ module.exports = {
"ordered-imports": true,
"prefer-array-literal": true,
"prefer-const": true,
"react-a11y-img-has-alt": true,
"react-a11y-props": true,
"react-a11y-role": true,
"react-a11y-role-has-required-aria-props": true,
"react-a11y-role-supports-aria-props": true,
"react-a11y-tabindex-no-positive": true,
"typedef": [true, "callSignature", "indexSignature", "parameter", "propertySignature", "variableDeclarator", "memberVariableDeclarator"],
"underscore-consistent-invocation": true,
"variable-name": true,
Expand Down
11 changes: 4 additions & 7 deletions src/a11yImgHasAltRule.ts → src/reactA11yImgHasAltRule.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,3 @@
/**
* @copyright Microsoft Corporation. All rights reserved.
*
* @a11yImgHasAltRule tslint rule for accessibility.
*/

import * as ts from 'typescript';
import * as Lint from 'tslint/lib/lint';

Expand All @@ -29,9 +23,12 @@ Add more details in 'alt' attribute or use role='presentation' for presentationa
A reference for the presentation role can be found at https://www.w3.org/TR/wai-aria/roles#presentation.`;
}

/**
* Enforces that img elements have alt text.
*/
export class Rule extends Lint.Rules.AbstractRule {
public static metadata: ExtendedMetadata = {
ruleName: 'a11y-img-has-alt',
ruleName: 'react-a11y-img-has-alt',
type: 'maintainability',
description: 'Enforce that an `img` element contains the `alt` attribute or `role=\'presentation\'` for decorative image.',
options: 'string[]',
Expand Down
6 changes: 2 additions & 4 deletions src/a11yPropsRule.ts → src/reactA11yPropsRule.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
/**
* @copyright Microsoft Corporation. All rights reserved.
*
* @a11yPropsRule tslint rule for accessibility.
* Enforce all `aria-*` attributes are valid.
*/

import * as ts from 'typescript';
Expand All @@ -22,7 +20,7 @@ https://www.w3.org/TR/2014/REC-wai-aria-20140320/states_and_properties#state_pro

export class Rule extends Lint.Rules.AbstractRule {
public static metadata: ExtendedMetadata = {
ruleName: 'a11y-props',
ruleName: 'react-a11y-props',
type: 'maintainability',
description: 'Enforce all `aria-*` attributes are valid. Elements cannot use an invalid `aria-*` attribute.',
options: null,
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
/**
* @copyright Microsoft Corporation. All rights reserved.
*
* @a11yRoleHasRequiredAriaPropsRule tslint rule for accessibility.
* Elements with aria roles must have all required attributes according to the role
*/

import * as ts from 'typescript';
Expand Down Expand Up @@ -46,7 +44,7 @@ A reference to role definitions can be found at https://www.w3.org/TR/wai-aria/r

export class Rule extends Lint.Rules.AbstractRule {
public static metadata: ExtendedMetadata = {
ruleName: 'a11y-role-has-required-aria-props',
ruleName: 'react-a11y-role-has-required-aria-props',
type: 'maintainability',
description: 'Elements with aria roles must have all required attributes according to the role.',
options: null,
Expand Down
6 changes: 2 additions & 4 deletions src/a11yRoleRule.ts → src/reactA11yRoleRule.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
/**
* @copyright Microsoft Corporation. All rights reserved.
*
* @a11yRole tslint rule for accessibility.
* Elements with aria roles must use a **valid**, **non-abstract** aria role
*/

import * as ts from 'typescript';
Expand Down Expand Up @@ -31,7 +29,7 @@ https://www.w3.org/TR/wai-aria/roles#role_definitions.`;

export class Rule extends Lint.Rules.AbstractRule {
public static metadata: ExtendedMetadata = {
ruleName: 'a11y-role',
ruleName: 'react-a11y-role',
type: 'maintainability',
description: 'Elements with aria roles must use a **valid**, **non-abstract** aria role.',
options: null,
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
/**
* @copyright Microsoft Corporation. All rights reserved.
*
* @a11yRoleSupportsAriaPropsRule tslint rule for accessibility.
* Enforce that elements with explicit or implicit roles defined contain only `aria-*` properties supported by that `role
*/

import * as ts from 'typescript';
Expand Down Expand Up @@ -33,7 +31,7 @@ export function getFailureStringForImplicitRole(tagName: string, roleName: strin

export class Rule extends Lint.Rules.AbstractRule {
public static metadata: ExtendedMetadata = {
ruleName: 'a11y-role-supports-aria-props',
ruleName: 'react-a11y-role-supports-aria-props',
type: 'maintainability',
description: 'Enforce that elements with explicit or implicit roles defined contain only `aria-*` properties supported by that `role`.',
options: null,
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
/**
* @copyright Microsoft Corporation. All rights reserved.
*
* @a11yTabindexNoPositiveRule tslint rule for accessibility.
* Enforce tabindex value is **not greater than zero**
*/

import * as ts from 'typescript';
Expand All @@ -16,7 +14,7 @@ export function getFailureString(): string {

export class Rule extends Lint.Rules.AbstractRule {
public static metadata: ExtendedMetadata = {
ruleName: 'a11y-tabindex-no-positive',
ruleName: 'react-a11y-tabindex-no-positive',
type: 'maintainability',
description: 'Enforce tabindex value is **not greater than zero**.',
options: null,
Expand Down
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import { TestHelper } from './TestHelper';
import { getFailureStringNoAlt, getFailureStringEmptyAlt } from '../src/a11yImgHasAltRule';
import { getFailureStringNoAlt, getFailureStringEmptyAlt } from '../src/reactA11yImgHasAltRule';

/**
* Unit test for a11y-img-has-alt rule
*/
describe('a11yImgHasAlt', () => {
const ruleName: string = 'a11y-img-has-alt';
const ruleName: string = 'react-a11y-img-has-alt';

describe('default tests', () => {
describe('should pass', () => {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import { TestHelper } from './TestHelper';
import { getFailureString } from '../src/a11yPropsRule';
import { getFailureString } from '../src/reactA11yPropsRule';

/**
* Unit tests for aria-props rule.
*/
describe('a11yPropsRule', () => {
const ruleName: string = 'a11y-props';
const ruleName: string = 'react-a11y-props';

describe('should pass', () => {
it('when the aria-* attribute name is correct', () => {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import { TestHelper } from './TestHelper';
import { getFailureStringForNotImplicitRole } from '../src/a11yRoleHasRequiredAriaPropsRule';
import { getFailureStringForNotImplicitRole } from '../src/reactA11yRoleHasRequiredAriaPropsRule';

/**
* Unit test for a11y-role-has-required-aria-props rule
*/
describe('a11yRoleHasRequiredAriaPropsRule', () => {
const ruleName: string = 'a11y-role-has-required-aria-props';
const ruleName: string = 'react-a11y-role-has-required-aria-props';

describe('should pass', () => {
const fileDirectory: string = 'test-data/a11yRoleHasRequiredAriaProps/PassingTestInputs/';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
import { TestHelper } from './TestHelper';
import { getFailureStringInvalidRole, getFailureStringUndefinedRole } from '../src/a11yRoleRule';
import { getFailureStringInvalidRole, getFailureStringUndefinedRole } from '../src/reactA11yRoleRule';

/**
* Unit tests for a11y-role
*/

// tslint:disable:no-empty
describe('a11yRoleRule', () => {
const ruleName: string = 'a11y-role';
const ruleName: string = 'react-a11y-role';

describe('should pass', () => {
it('when the role name is correct', () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,13 @@ import { TestHelper } from './TestHelper';
import {
getFailureStringForImplicitRole,
getFailureStringForNotImplicitRole
} from '../src/a11yRoleSupportsAriaPropsRule';
} from '../src/reactA11yRoleSupportsAriaPropsRule';

/**
* Unit test for a11y-role-supports-aria-props rule.
*/
describe('a11yRoleSupportsAriaPropsRule', () => {
const ruleName: string = 'a11y-role-supports-aria-props';
const ruleName: string = 'react-a11y-role-supports-aria-props';

describe('should pass', () => {
describe('implicit role test', () => {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import { TestHelper } from './TestHelper';
import { getFailureString } from '../src/a11yTabindexNoPositiveRule';
import { getFailureString } from '../src/reactA11yTabindexNoPositiveRule';

/**
* Unit test for tabindex-no-positive
*/
describe('a11yTabindexNoPositive', () => {
const ruleName: string = 'a11y-tabindex-no-positive';
const ruleName: string = 'react-a11y-tabindex-no-positive';

describe('should pass', () => {
it('when the attribute name is not tabindex', () => {
Expand Down
Loading

0 comments on commit 311d69a

Please sign in to comment.