feat: add template-no-role-presentation-on-focusable

[johanrd]

Note

This is part of a series where Claude has audited eslint-plugin-ember against jsx-a11y, vuejs-accessibility, angular-eslint, lit-a11y and html-validate, ember-template-lint, and the HTML and WCAG specs.

Per WAI-ARIA 1.2 "Presentational Roles Conflict Resolution":

"User agents MUST NOT expose elements having explicit or inherited presentational role in the accessibility tree, with these exceptions: If an element is focusable, or otherwise interactive, user agents MUST ignore the presentation role and expose the element with its implicit role, in order to ensure that the element is operable."

That is a UA-directed conflict-resolution procedure. The practical consequence for authors: role="presentation" on a focusable element is silently ignored by the UA. The author said "decorative," the UA exposes the element anyway with its implicit role. This rule flags the author-side anti-pattern before it reaches the browser.

role="none" is handled identically. WAI-ARIA 1.2 explicitly defines none as a synonym for presentation.

Shares focusable-detection with template-no-aria-hidden-on-focusable — both target the same anti-pattern shape via different attributes.

Flags

<button role="presentation">Click</button>
<a href="/x" role="presentation">Link</a>
<a href="/x" role="none">Link</a>
<input type="text" role="presentation" />
<div tabindex="0" role="presentation"></div>
<button tabindex="-1" role="presentation">…</button>              {{! tabindex="-1" is still focusable per HTML §6.6.3 (programmatic focus target, exposed in a11y tree); WAI-ARIA conflict resolution applies — flagged. jsx-a11y / vue-a11y exempt it; we follow the spec. }}

Allows

<div role="presentation"><button tabindex="-1">…</button></div>   {{! role on non-focusable; children handled recursively }}
<CustomBtn role="presentation" />                                 {{! component, opaque }}

Prior art

Plugin	Rule	Notes
vuejs-accessibility	no-role-presentation-on-focusable	Checks role === "presentation" only (not "none"). Our rule extends to "none" per spec synonymy.
jsx-a11y	—	No equivalent rule.
lit-a11y	—	No equivalent rule.
@angular-eslint/template	—	No equivalent rule.