GoScrobble/web/node_modules/eslint-plugin-jsx-a11y/docs/rules/no-autofocus.md

40 lines
937 B
Markdown
Raw Permalink Normal View History

2022-04-25 02:47:15 +00:00
# no-autofocus
Enforce that autoFocus prop is not used on elements. Autofocusing elements can cause usability issues for sighted and non-sighted users, alike.
## Rule details
This rule takes one optional object argument of type object:
```json
{
"rules": {
"jsx-a11y/no-autofocus": [ 2, {
"ignoreNonDOM": true
}],
}
}
```
For the `ignoreNonDOM` option, this determines if developer created components are checked.
### Succeed
```jsx
<div />
```
### Fail
```jsx
<div autoFocus />
<div autoFocus="true" />
<div autoFocus="false" />
<div autoFocus={undefined} />
```
## Accessibility guidelines
General best practice (reference resources)
### Resources
- [WHATWG HTML Standard, The autofocus attribute](https://html.spec.whatwg.org/multipage/interaction.html#attr-fe-autofocus)
- [The accessibility of HTML 5 autofocus](https://www.brucelawson.co.uk/2009/the-accessibility-of-html-5-autofocus/)