oxc-project/oxc · error

Elements with the '{role}' interactive role must be focusabl

Error message

Elements with the '{role}' interactive role must be focusable.

What it means

Variant of the jsx-a11y/interactive-supports-focus diagnostic for the 'always' configuration, firing when an element with an interactive role is not focusable, regardless of event handlers. The element must be reachable via keyboard focus.

Source

Thrown at crates/oxc_linter/src/rules/jsx_a11y/interactive_supports_focus.rs:32

    rule::{DefaultRuleConfig, Rule},
    utils::{
        KEYBOARD_EVENT_HANDLERS, MOUSE_EVENT_HANDLERS, get_element_type,
        get_string_literal_prop_value, has_jsx_prop, has_jsx_prop_ignore_case, is_disabled_element,
        is_hidden_from_screen_reader, is_interactive_element, is_interactive_role,
        is_non_interactive_element, is_non_interactive_role, is_presentation_role,
    },
};

fn must_be_tabbable_diagnostic(role: &str, span: Span) -> OxcDiagnostic {
    OxcDiagnostic::warn(format!("Elements with the '{role}' interactive role must be tabbable."))
        .with_help(
            "Add `tabIndex={0}` to make the element reachable via sequential keyboard navigation.",
        )
        .with_label(span)
}

fn must_be_focusable_diagnostic(role: &str, span: Span) -> OxcDiagnostic {
    OxcDiagnostic::warn(format!("Elements with the '{role}' interactive role must be focusable."))
        .with_help("Add `tabIndex={0}` or `tabIndex={-1}` to make the element focusable.")
        .with_label(span)
}

const EVENT_HANDLERS: &[&[&str]] = &[MOUSE_EVENT_HANDLERS, KEYBOARD_EVENT_HANDLERS];

const DEFAULT_TABBABLE: &[&str] =
    &["button", "checkbox", "link", "searchbox", "spinbutton", "switch", "textbox"];

#[derive(Debug, Default, Clone, Deserialize)]
pub struct InteractiveSupportsFocus(Box<InteractiveSupportsFocusConfig>);

#[derive(Debug, Clone, JsonSchema, Deserialize)]
#[serde(rename_all = "camelCase", default, deny_unknown_fields)]
pub struct InteractiveSupportsFocusConfig {
    /// An array of interactive ARIA roles that should be considered tabbable (require `tabIndex={0}`).
    /// Interactive roles not in this list are only required to be focusable (`tabIndex={-1}` is sufficient).
    /// Defaults to `["button", "checkbox", "link", "searchbox", "spinbutton", "switch", "textbox"]`.

View on GitHub (pinned to e1e7af627c)

Solutions

1. Add tabIndex to make the element focusable.
2. Replace the role-bearing element with a native focusable element such as button or a.
3. Disable the rule if the element is focusable through other means (e.g. roving tabindex managed elsewhere).

When it happens

Trigger: Thrown at crates/oxc_linter/src/rules/jsx_a11y/interactive_supports_focus.rs:32 when the library encounters an invalid state.

Common situations: See trigger scenarios.

AI-assisted analysis of oxc-project/oxc@e1e7af627c (2026-08-20). Data as JSON: /api/errors/10b16429617aeb3a. Report an issue: GitHub.