jsx_a11y/no-distracting-elements Correctness

✅ This rule is turned on by default.

What it does

Enforces that no distracting elements are used.

Why is this necessary?

Elements that can be visually distracting can cause accessibility issues with visually impaired users. Such elements are most likely deprecated, and should be avoided. By default, <marquee> and <blink> elements are visually distracting.

What it checks

This rule checks for marquee and blink element.

Example

Examples of incorrect code for this rule:

<marquee />
<marquee {...props} />
<marquee lang={undefined} />
<blink />
<blink {...props} />
<blink foo={undefined} />

Examples of correct code for this rule:

<div />
<Marquee />
<Blink />

How to use

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

CLI

oxlint --deny jsx-a11y/no-distracting-elements --jsx-a11y-plugin

Config (.oxlintrc.json)

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

References

• Rule Source