Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add missing rule descriptions #904

Merged
merged 1 commit into from Oct 30, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
1 change: 1 addition & 0 deletions .eslintrc
Expand Up @@ -21,6 +21,7 @@
"files": ["src/rules/*"],
"extends": ["plugin:eslint-plugin/rules-recommended"],
"rules": {
"eslint-plugin/require-meta-docs-description": ["error", { "pattern": "^(Enforce|Require|Disallow)" }],
"eslint-plugin/require-meta-docs-url": [
"error",
{ "pattern": "https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/tree/HEAD/docs/rules/{{name}}.md" },
Expand Down
6 changes: 3 additions & 3 deletions README.md
Expand Up @@ -120,7 +120,7 @@ configuration file by mapping each custom component name to a DOM element type.

| Name                                          | Description | 💼 | ❌ |
| :----------------------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------------------------------------------------------------------- | :---- | :-- |
| [accessible-emoji](docs/rules/accessible-emoji.md) | | | ❌ |
| [accessible-emoji](docs/rules/accessible-emoji.md) | Enforce emojis are wrapped in `<span>` and provide screenreader access. | | ❌ |
| [alt-text](docs/rules/alt-text.md) | Enforce all elements that require alternative text have meaningful information to relay back to end user. | ☑️ 🔒 | |
| [anchor-ambiguous-text](docs/rules/anchor-ambiguous-text.md) | Enforce `<a>` text to not exactly match "click here", "here", "link", or "a link". | | |
| [anchor-has-content](docs/rules/anchor-has-content.md) | Enforce all anchors to contain accessible content. | ☑️ 🔒 | |
Expand All @@ -139,7 +139,7 @@ configuration file by mapping each custom component name to a DOM element type.
| [img-redundant-alt](docs/rules/img-redundant-alt.md) | Enforce `<img>` alt prop does not contain the word "image", "picture", or "photo". | ☑️ 🔒 | |
| [interactive-supports-focus](docs/rules/interactive-supports-focus.md) | Enforce that elements with interactive handlers like `onClick` must be focusable. | ☑️ 🔒 | |
| [label-has-associated-control](docs/rules/label-has-associated-control.md) | Enforce that a `label` tag has a text label and an associated control. | ☑️ 🔒 | |
| [label-has-for](docs/rules/label-has-for.md) | | | ❌ |
| [label-has-for](docs/rules/label-has-for.md) | Enforce that `<label>` elements have the `htmlFor` prop. | | ❌ |
| [lang](docs/rules/lang.md) | Enforce lang attribute has a valid value. | | |
| [media-has-caption](docs/rules/media-has-caption.md) | Enforces that `<audio>` and `<video>` elements must have a `<track>` for captions. | ☑️ 🔒 | |
| [mouse-events-have-key-events](docs/rules/mouse-events-have-key-events.md) | Enforce that `onMouseOver`/`onMouseOut` are accompanied by `onFocus`/`onBlur` for keyboard-only users. | ☑️ 🔒 | |
Expand All @@ -153,7 +153,7 @@ configuration file by mapping each custom component name to a DOM element type.
| [no-onchange](docs/rules/no-onchange.md) | Enforce usage of `onBlur` over `onChange` on select menus for accessibility. | | ❌ |
| [no-redundant-roles](docs/rules/no-redundant-roles.md) | Enforce explicit role property is not the same as implicit/default role property on element. | ☑️ 🔒 | |
| [no-static-element-interactions](docs/rules/no-static-element-interactions.md) | Enforce that non-interactive, visible elements (such as `<div>`) that have click handlers use the role attribute. | ☑️ 🔒 | |
| [prefer-tag-over-role](docs/rules/prefer-tag-over-role.md) | | | |
| [prefer-tag-over-role](docs/rules/prefer-tag-over-role.md) | Enforces using semantic DOM elements over the ARIA `role` property. | | |
| [role-has-required-aria-props](docs/rules/role-has-required-aria-props.md) | Enforce that elements with ARIA roles must have all required attributes for that role. | ☑️ 🔒 | |
| [role-supports-aria-props](docs/rules/role-supports-aria-props.md) | Enforce that elements with explicit or implicit roles defined contain only `aria-*` properties supported by that `role`. | ☑️ 🔒 | |
| [scope](docs/rules/scope.md) | Enforce `scope` prop is only used on `<th>` elements. | ☑️ 🔒 | |
Expand Down
9 changes: 7 additions & 2 deletions docs/rules/label-has-for.md
@@ -1,12 +1,12 @@
# jsx-a11y/label-has-for

❌ This rule is deprecated.
❌ This rule is deprecated. It was replaced by [`label-has-associated-control`](label-has-associated-control.md).

💼 This rule is _disabled_ in the following configs: ☑️ `recommended`, 🔒 `strict`.

<!-- end auto-generated rule header -->

*This rule was deprecated in v6.1.0. It will no longer be maintained. Please use [`label-has-associated-control`](label-has-associated-control.md) instead.*
_This rule was deprecated in v6.1.0. It will no longer be maintained._

Enforce label tags have associated control.

Expand Down Expand Up @@ -81,13 +81,15 @@ However, if `allowChildren` is set to `true`, no error will be raised. If you wa
Note that passing props as spread attribute without `htmlFor` explicitly defined will cause this rule to fail. Explicitly pass down `htmlFor` prop for rule to pass. The prop must have an actual value to pass. Use `Label` component above as a reference. **It is a good thing to explicitly pass props that you expect to be passed for self-documentation.** For example:

#### Bad

```jsx
function Foo(props) {
return <label {...props} />
}
```

#### Good

```jsx
function Foo({ htmlFor, ...props}) {
return <label htmlFor={htmlFor} {...props} />
Expand All @@ -106,6 +108,7 @@ function Foo(props) {
```

### Succeed

```jsx
<label htmlFor="firstName">
<input type="text" id="firstName" />
Expand All @@ -114,12 +117,14 @@ function Foo(props) {
```

### Fail

```jsx
<input type="text" id="firstName" />
<label>First Name</label>
```

## Accessibility guidelines

- [WCAG 1.3.1](https://www.w3.org/WAI/WCAG21/Understanding/info-and-relationships)
- [WCAG 3.3.2](https://www.w3.org/WAI/WCAG21/Understanding/labels-or-instructions)
- [WCAG 4.1.2](https://www.w3.org/WAI/WCAG21/Understanding/name-role-value)
1 change: 1 addition & 0 deletions src/rules/accessible-emoji.js
Expand Up @@ -20,6 +20,7 @@ const schema = generateObjSchema();
export default {
meta: {
docs: {
description: 'Enforce emojis are wrapped in `<span>` and provide screenreader access.',
url: 'https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/tree/HEAD/docs/rules/accessible-emoji.md',
},
deprecated: true,
Expand Down
2 changes: 2 additions & 0 deletions src/rules/label-has-for.js
Expand Up @@ -88,7 +88,9 @@ const getValidityStatus = (node, required, allowChildren, elementType) => {
export default {
meta: {
deprecated: true,
replacedBy: ['label-has-associated-control'],
docs: {
description: 'Enforce that `<label>` elements have the `htmlFor` prop.',
url: 'https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/tree/HEAD/docs/rules/label-has-for.md',
},
schema: [schema],
Expand Down
5 changes: 2 additions & 3 deletions src/rules/no-aria-hidden-on-focusable.js
Expand Up @@ -12,14 +12,13 @@ import getElementType from '../util/getElementType';
import isFocusable from '../util/isFocusable';
import { generateObjSchema } from '../util/schemas';

const errorMessage = 'aria-hidden="true" must not be set on focusable elements.';
const schema = generateObjSchema();

export default {
meta: {
docs: {
url: 'https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/tree/HEAD/docs/rules/no-aria-hidden-on-focusable.md',
description: errorMessage,
description: 'Disallow `aria-hidden="true"` from being set on focusable elements.',
},
schema: [schema],
},
Expand All @@ -35,7 +34,7 @@ export default {
if (isAriaHidden && isFocusable(type, attributes)) {
context.report({
node,
message: errorMessage,
message: 'aria-hidden="true" must not be set on focusable elements.',
});
}
},
Expand Down
1 change: 1 addition & 0 deletions src/rules/prefer-tag-over-role.js
Expand Up @@ -35,6 +35,7 @@ const getLastPropValue = (rawProp) => {
export default {
meta: {
docs: {
description: 'Enforces using semantic DOM elements over the ARIA `role` property.',
url: 'https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/tree/HEAD/docs/rules/prefer-tag-over-role.md',
},
schema: [schema],
Expand Down