scottaohara · GitHub

@chutchins25 @straker

Adds support for `role="image"` as a valid role equivalent to
`role="img"` (ARIA 1.3,
[w3c/aria#1370](w3c/aria#1370)).
## What & why
ARIA 1.3 adds `image` as an alias of `img` with an identical mapping;
axe previously treated `role="image"` as an invalid role.
Per the review discussion, this does **not** use a synonym-normalization
mechanism (which would force every reporting path to remember the role
the author used vs. the one our code resolved it to). Instead, `image`
is a first-class role that shares `img`'s definition and is allowed
wherever `img` is:
- `image` is added to `lib/standards/aria-roles.js`, spread from a
shared `imgRole` object so it stays in sync with `img`.
- `image` is added to every `html-elms` `allowedRoles` list that
includes `img` (`embed`, `iframe`, `object`). `svg` needs no change — it
is `allowedRoles: true`, so it already accepts any role.
- The `role-img-alt` and `svg-img-alt` selectors match both roles via
`:is([role='img'], [role='image'])`. Without the `svg-img-alt` change,
`<svg role="image">` matched neither rule — `svg-img-alt`'s selector
omitted it and `role-img-alt` is gated by `html-namespace-matches` — so
axe accepted the role and then never checked for an accessible name.
- `image` is added to the `aria-roledescription` check's
`supportedRoles`, so `role="image"` passes where `role="img"` does.
Because there is no synonym resolution, an unallowed `role="image"`
reports **`image`** (the role the author used), not `img`.
## Tests
- `is-valid-role` / `aria-roles` integration — `image` is a valid role.
- `get-element-unallowed-roles` — `image` allowed on
`svg`/`embed`/`object`/`iframe`; reported as authored when unallowed
(e.g. on `hr`).
- `role-img-alt` integration + virtual-rules — matches `role="image"`.
- `svg-img-alt` integration + virtual-rules — matches `role="image"`.
- `aria-roledescription` — `role="image"` passes against the check's
default `supportedRoles`.
- ACT specs `7d6734` and `23a2a8` still pass with the broadened
selectors.
## Not in scope
`role-img-alt` and `svg-img-alt` metadata still name only `img` in their
`description`/`help` strings. Updating them regenerates
`locales/_template.json`, invalidates those translations, and needs a
matching axe-rule-help change — tracked in #5272.
Closes #4656
---------
Co-authored-by: Steven Lambert <2433219+straker@users.noreply.github.com>

Read the original on github.com ↗