jsx-a11y/click-events-have-key-events

Require a keyboard handler alongside onClick on non-interactive elements so keyboard users are not locked out.

• Category: Accessibility
• Severity: warn
• Source: oxlint-builtin:jsx-a11y
• Framework: global
• Enabled when: always (unless customRulesOnly=true)
• Documentation: https://oxc.rs/docs/guide/usage/linter/rules/jsx_a11y/click-events-have-key-events

Validation prompt

Use this to decide whether a fired diagnostic is real or a false positive.

Fires on JSX elements with onClick that lack onKeyUp, onKeyDown, or onKeyPress, restricted to non-interactive HTML elements like div or span — native <button> and <a href> are skipped, as are elements with aria-hidden='true'. False positive: a wrapper div whose only job is to bubble clicks up from an inner <button> that already handles keyboard input.

Fix prompt

Use this once validation confirms the diagnostic is real.

Prefer replacing the static element with a native <button>, which gives Enter/Space activation for free. If the div must stay, add an onKeyDown handler that fires the same callback when event.key is 'Enter' or ' ', plus role='button' and tabIndex={0} so keyboard users can focus and activate it. See https://oxc.rs/docs/guide/usage/linter/rules/jsx_a11y/click-events-have-key-events

Related rules

More Accessibility rules from the rules reference:

• jsx-a11y/heading-has-content: Disallow empty headings — h1 through h6 must render accessible text content.
• jsx-a11y/html-has-lang: Require a lang attribute on the html element so screen readers use the right pronunciation rules.
• jsx-a11y/iframe-has-title: Require a unique, descriptive title attribute on iframes so assistive-tech users can identify embedded content.
• jsx-a11y/label-has-associated-control: Require every label to wrap its form control or point at one with htmlFor.
• jsx-a11y/no-autofocus: Disallow the autoFocus prop — stolen focus disorients screen-reader and keyboard users.