← Back to rules

jsx-a11y/scope Correctness

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

What it does

The scope prop should be used only on <th> elements.

Why is this bad?

The scope attribute makes table navigation much easier for screen reader users, provided that it is used correctly. Incorrectly used, scope can make table navigation much harder and less efficient. A screen reader operates under the assumption that a table has a header and that this header specifies a scope. Because of the way screen readers function, having an accurate header makes viewing a table far more accessible and more efficient for people who use the device.

Examples

Examples of incorrect code for this rule:

<div scope />

Examples of correct code for this rule:

<th scope="col" />
<th scope={scope} />

How to use

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

Config (.oxlintrc.json)

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

Config (oxlint.config.ts)

import { defineConfig } from "oxlint";

export default defineConfig({
  plugins: ["jsx-a11y"],
  rules: {
    "jsx-a11y/scope": "error",
  },
});

CLI

oxlint --deny jsx-a11y/scope --jsx-a11y-plugin

Version

This rule was added in v0.0.19.

References

• Rule Source
• Upstream rule docs
• Open rule in Oxc Playground