role-that-fights-the-tag
This fails the run. Where it is wrong about your code, // ramonda-check-ignore <reason> on the line says so, and the reason is printed on every run.
Reported when a role says the element behaves in a way the tag does not — a link as a button, or a button as a link.
The element keeps its behaviour and the role changes only what is ANNOUNCED about it, so a role that disagrees cannot bring the behaviour with it.
A link announced as a button: a button activates on Space as well as Enter, and a reader told "button" will press Space — which on a link is the browser's scroll shortcut, so the page jumps and nothing happens. It also leaves the list of LINKS a screen reader offers, which is how somebody surveys what a page connects to.
A button announced as a link: the reader now expects a destination — a URL in the status bar, a middle click that opens a tab, "copy link address". None of those exist, and none fail loudly.
The answer is never the role. If it should be a button, use a <button>; if it should go
somewhere, use an <a href>. Both arrive announced correctly, focusable, and with the right
keys already working.
An <a> with no href is not a link at all and is not this — that is
link-without-a-destination, and building a button out of an anchor is a different
conversation.
Next
- All rules — the other checks this one runs beside.
- Checking your app — how to run it, and what it proves.