---
title: "Click handler on a non-interactive element (ui/click-on-non-interactive)"
description: "A <div onClick> can't be focused or activated by keyboard and isn't announced as a control."
url: http://localhost:4173/rules/ui/click-on-non-interactive
updated: 2026-11-11
---

# Click handler on a non-interactive element

> `ui/click-on-non-interactive` is a vetd rule. It flags: Click handler on a non-interactive element. It runs on every `check`, together with the TypeScript check.

| Fact | Value |
| --- | --- |
| Rule id | `ui/click-on-non-interactive` |
| Severity | warning |
| Group | Interface craft: accessibility, motion and mobile |
| Tags | accessibility |

## Why it matters

A <div onClick> can't be focused or activated by keyboard and isn't announced as a control.

## How to fix it

Use a <button type="button">, or add role, tabIndex={0} and an onKeyDown for Enter/Space.

## Credit

Based on work by:

- [W3C Web Accessibility Initiative](https://www.w3.org/WAI/): WCAG 2.1.1 requires all functionality to be operable by keyboard.
- [Vercel](https://vercel.com): The Web Interface Guidelines require button for actions and links for navigation, never div onClick.

## References

- [Understanding Success Criterion 2.1.1: Keyboard](https://www.w3.org/WAI/WCAG22/Understanding/keyboard.html), W3C
- [<button> HTML button element](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/button), MDN Web Docs
- [Web Interface Guidelines](https://github.com/vercel-labs/web-interface-guidelines), Vercel (vercel-labs)

## See it

Demos in the vetd Lab:

- [Use real buttons and links](http://localhost:4173/lab/web-guidelines/semantic-controls)

## Related rules

- [`ui/icon-button-label`](http://localhost:4173/rules/ui/icon-button-label.md)
- [`ui/outline-none`](http://localhost:4173/rules/ui/outline-none.md)

## Get this text from vetd

MCP: call `explain` with `{ "diagnosticId": "ui/click-on-non-interactive" }`. CLI: `npx vetd explain ui/click-on-non-interactive`.

---

[All 92 rules](http://localhost:4173/rules.md) · Previous: [`ui/video-autoplay`](http://localhost:4173/rules/ui/video-autoplay.md) · Next: [`ui/icon-button-label`](http://localhost:4173/rules/ui/icon-button-label.md)
