{"record":{"id":"40f8833d14836866","repo":"oxc-project/oxc","slug":"the-autofocus-attribute-is-found-here-which-can","errorCode":null,"errorMessage":"The `autoFocus` attribute is found here, which can cause usability issues for sighted and non-sighted users.","messagePattern":"The `autoFocus` attribute is found here, which can cause usability issues for sighted and non-sighted users\\.","errorType":"validation","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"crates/oxc_linter/src/rules/jsx_a11y/no_autofocus.rs","lineNumber":22,"sourceCode":"};\nuse oxc_diagnostics::OxcDiagnostic;\nuse oxc_macros::declare_oxc_lint;\nuse oxc_span::Span;\nuse schemars::JsonSchema;\nuse serde::Deserialize;\n\nuse crate::{\n    AstNode,\n    context::LintContext,\n    globals::HTML_TAG,\n    rule::{DefaultRuleConfig, Rule},\n    utils::{\n        get_element_type, get_string_literal_prop_value, has_jsx_prop, has_jsx_prop_ignore_case,\n    },\n};\n\nfn no_autofocus_diagnostic(span: Span) -> OxcDiagnostic {\n    OxcDiagnostic::warn(\"The `autoFocus` attribute is found here, which can cause usability issues for sighted and non-sighted users.\")\n        .with_help(\"Remove the `autoFocus` attribute.\")\n        .with_label(span)\n}\n\n#[derive(Debug, Default, Clone, JsonSchema, Deserialize)]\n#[serde(default, deny_unknown_fields)]\npub struct NoAutofocus {\n    /// Determines if developer-created components are checked.\n    #[serde(rename = \"ignoreNonDOM\")]\n    ignore_non_dom: bool,\n}\n\ndeclare_oxc_lint!(\n    /// ### What it does\n    ///\n    /// Enforce that `autoFocus` prop is not used on elements.\n    ///\n    /// ### Why is this bad?","sourceCodeStart":4,"sourceCodeEnd":40,"githubUrl":"https://github.com/oxc-project/oxc/blob/e1e7af627c8843ab64044ed466b128fcc21a035b/crates/oxc_linter/src/rules/jsx_a11y/no_autofocus.rs#L4-L40","documentation":"This is the `jsx_a11y/no-autofocus` rule in oxlint. It fires when a JSX element carries the `autoFocus` prop (checked with `has_jsx_prop`/`has_jsx_prop_ignore_case`). Auto-focusing an element on load disorients both sighted users (unexpected focus jumps) and screen-reader users (context loss), so jsx-a11y flags it.","triggerScenarios":"Any JSX element with an `autoFocus` attribute. By default only known HTML elements (checked against the `HTML_TAG` globals set) are validated; the `ignoreNonDOM` option (serde `ignoreNonDOM`, default false) controls whether custom components are also flagged.","commonSituations":"Login or search forms that auto-focus the first input; modal dialogs focusing their content; copying old HTML patterns into React; enabling the jsx-a11y recommended preset and hitting dozens of legacy `autoFocus` usages.","solutions":["Remove `autoFocus` and focus programmatically only when appropriate (e.g., focus the first field of a modal the user just opened, using a ref).","For modals, rely on focus-trap/focus-management libraries instead of `autoFocus`.","Set `ignoreNonDOM: true` in the rule config if you only want native HTML elements checked (or the reverse if you use `ignoreNonDOM` semantics differently).","Disable inline for a rare, deliberate auto-focus case."],"exampleFix":"// before\n<input autoFocus onChange={...} />\n\n// after\nconst ref = useRef<HTMLInputElement>(null);\nuseEffect(() => { ref.current?.focus(); }, []);\n<input ref={ref} onChange={...} />","handlingStrategy":"validation","validationCode":"npx oxlint --jsx-a11y/no-autofocus src/","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Use refs + useEffect to focus deliberately, only after user-initiated context changes.","Rely on focus-trap libraries for modals instead of autoFocus.","Decide the ignoreNonDOM setting up front so custom components are handled consistently."],"tags":["jsx-a11y","react","accessibility","focus-management","lint"],"backgroundTag":"autofocus-accessibility","analyzedSha":"e1e7af627c8843ab64044ed466b128fcc21a035b","analyzedAt":"2026-08-20T07:01:07.079Z","contentChangedAt":"2026-08-20T07:01:07.079Z","schemaVersion":2},"datasetVersion":"2026-09-14T00:17:10.932Z"}