oxc-project/oxc · warning · OxcDiagnostic

Avoid positive integer values for `tabIndex`.

Error message

Avoid positive integer values for `tabIndex`.

What it means

This is the `jsx_a11y/tabindex-no-positive` rule in oxlint. It fires when a `tabIndex` attribute's value (parsed via `parse_jsx_value`) is a positive number, e.g. `tabIndex={1}` or `tabIndex="2"`. Positive values override the document's natural DOM order and create an unpredictable, chaotic tab sequence for keyboard users.

Source

Thrown at crates/oxc_linter/src/rules/jsx_a11y/tabindex_no_positive.rs:14

use oxc_ast::{AstKind, ast::JSXAttributeItem};
use oxc_diagnostics::OxcDiagnostic;
use oxc_macros::declare_oxc_lint;
use oxc_span::{GetSpan, Span};

use crate::{
    AstNode,
    context::LintContext,
    rule::Rule,
    utils::{has_jsx_prop_ignore_case, parse_jsx_value},
};

fn tabindex_no_positive_diagnostic(span: Span) -> OxcDiagnostic {
    OxcDiagnostic::warn("Avoid positive integer values for `tabIndex`.")
        .with_help("Change the `tabIndex` prop to a non-positive value.")
        .with_label(span)
}

#[derive(Debug, Default, Clone)]
pub struct TabindexNoPositive;

declare_oxc_lint!(
    /// ### What it does
    ///
    /// Enforces that positive values for the `tabIndex` attribute are not used
    /// in JSX.
    ///
    /// ### Why is this bad?
    ///
    /// Using `tabIndex` values greater than `0` can make navigation and
    /// interaction difficult for keyboard and assistive technology users,
    /// disrupting the logical order of content.

View on GitHub (pinned to e1e7af627c)

Solutions

  1. Change the value to `0` (joins natural tab order at that DOM position) or `-1` (removable from tab order, focus programmatically).
  2. Reorder the DOM/source so the natural tab order is correct instead of forcing it with indexes.
  3. Sweep the page for other positive tabIndex values — one positive index changes ordering for the whole document.

Example fix

// before
<input tabIndex={1} ... />
<input tabIndex={2} ... />

// after
<input ... />
<input ... />
Defensive patterns

Strategy: validation

Validate before calling

npx oxlint --jsx-a11y/tabindex-no-positive src/

Type guard

const isSafeTabIndex = (v: number | string | undefined) =>
  v === undefined || Number(v) <= 0;

Prevention

When it happens

Trigger: A JSX opening element with a literal `tabIndex` prop whose parsed numeric value is greater than zero — either a JSX expression container with a positive numeric literal or a string literal like "3".

Common situations: Developers trying to force a specific tab order across a page; legacy forms where fields were tab-ordered manually with 1,2,3...; templates copied from old HTML tutorials; last-minute 'fix the focus order' patches that use positive indexes.

Related errors


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