{"record":{"id":"3cc90d01273d2c8c","repo":"oxc-project/oxc","slug":"the-scope-prop-can-only-be-used-on-th-elemen","errorCode":null,"errorMessage":"The `scope` prop can only be used on `<th>` elements","messagePattern":"The `scope` prop can only be used on `<th>` elements","errorType":"validation","errorClass":"OxcDiagnostic","httpStatus":null,"severity":"warning","filePath":"crates/oxc_linter/src/rules/jsx_a11y/scope.rs","lineNumber":15,"sourceCode":"use oxc_ast::{AstKind, ast::JSXAttributeItem};\nuse oxc_diagnostics::OxcDiagnostic;\nuse oxc_macros::declare_oxc_lint;\nuse oxc_span::Span;\n\nuse crate::{\n    AstNode,\n    context::LintContext,\n    globals::HTML_TAG,\n    rule::Rule,\n    utils::{get_element_type, has_jsx_prop_ignore_case},\n};\n\nfn scope_diagnostic(span: Span) -> OxcDiagnostic {\n    OxcDiagnostic::warn(\"The `scope` prop can only be used on `<th>` elements\")\n        .with_help(\"Remove the `scope` prop on elements other than `<th>`.\")\n        .with_label(span)\n}\n\n#[derive(Debug, Default, Clone)]\npub struct Scope;\n\ndeclare_oxc_lint!(\n    /// ### What it does\n    ///\n    /// The scope prop should be used only on `<th>` elements.\n    ///\n    /// ### Why is this bad?\n    ///\n    /// The scope attribute makes table navigation much easier for screen reader users, provided that it is used correctly.\n    /// Incorrectly used, scope can make table navigation much harder and less efficient.\n    /// 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.\n    ///","sourceCodeStart":1,"sourceCodeEnd":33,"githubUrl":"https://github.com/oxc-project/oxc/blob/e1e7af627c8843ab64044ed466b128fcc21a035b/crates/oxc_linter/src/rules/jsx_a11y/scope.rs#L1-L33","documentation":"This is the `jsx_a11y/scope` rule in oxlint. It fires when the `scope` attribute (found case-insensitively via `has_jsx_prop_ignore_case`) appears on any element other than `<th>` (element type resolved with `get_element_type` against the HTML tag set). `scope` communicates header-cell associations to screen readers and is only meaningful on `<th>`.","triggerScenarios":"A JSX opening element with a `scope` prop where the resolved element type is anything other than `th` — typically `<td scope=\"col\">`, `<div scope>`, or a custom element.","commonSituations":"Copy-pasting header-cell markup into data cells; trying to fix table navigation by adding `scope` to `<td>`; HTML-to-JSX conversions preserving invalid attributes; misunderstanding that `scope` fixes headers, not cells.","solutions":["Remove the `scope` prop from the non-`<th>` element.","If it was meant to label a column/row group, move `scope` onto the corresponding `<th>`.","For complex tables, prefer explicit `headers`/`id` associations on real header cells."],"exampleFix":"// before\n<td scope=\"row\">Q1</td>\n\n// after\n<th scope=\"row\">Q1</th>","handlingStrategy":"validation","validationCode":"npx oxlint --jsx-a11y/scope src/","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Only write scope on <th> elements; never on <td>.","For complex tables, use headers/id pairs instead of creative scope usage.","Check pasted table markup for stray scope attributes."],"tags":["jsx-a11y","react","accessibility","html-table","lint"],"backgroundTag":"scope-attribute-misuse","analyzedSha":"e1e7af627c8843ab64044ed466b128fcc21a035b","analyzedAt":"2026-08-20T07:01:07.079Z","contentChangedAt":"2026-08-20T07:01:07.079Z","schemaVersion":2},"datasetVersion":"2026-09-14T05:17:10.506Z"}