jsx_a11y/no-autofocus Correctness

🛠️ An auto-fix is available for this rule.

What it does

Enforce that autoFocus prop is not used on elements.

Why is this bad?

Autofocusing elements can cause usability issues for sighted and non-sighted users alike. It can be disorienting when focus is shifted without user input and can interfere with assistive technologies. Users should control when and where focus moves on a page.

Examples

Examples of incorrect code for this rule:

<div autoFocus />
<div autoFocus="true" />
<div autoFocus="false" />
<div autoFocus={undefined} />

Examples of correct code for this rule:

<div />;

Configuration

This rule accepts a configuration object with the following properties:

ignoreNonDOM

type: boolean

default: false

Determines if developer-created components are checked.

How to use

To enable this rule in the CLI or using the config file, you can use:

CLI

oxlint --deny jsx-a11y/no-autofocus --jsx-a11y-plugin

Config (.oxlintrc.json)

{
  "plugins": ["jsx-a11y"],
  "rules": {
    "jsx-a11y/no-autofocus": "error"
  }
}

References

• Rule Source