Accessibility TestingReports
Issue Details
Rule, failure summary, WCAG tags, selector, HTML snippet, and matching targets for a single issue.
Issue Details
Clicking an issue in the list opens the detail panel on the right. Everything you need to diagnose and fix one element is on this panel.
Fields
| Field | What it is |
|---|---|
| Rule ID | Machine-readable axe-core rule identifier (e.g., color-contrast, image-alt). |
| Rule description | Human-readable version of the rule (e.g., "Elements must meet minimum color contrast ratio thresholds"). |
| Failure summary | Why this specific element failed the rule. |
| Impact | Critical / Serious / Moderate / Minor. See Severity levels. |
| WCAG tags | All WCAG tags the rule maps to (e.g., wcag2aa, wcag143, cat.color). |
| WCAG criterion | The specific success criterion (e.g., 1.4.3 Contrast (Minimum)). |
| WCAG level | A / AA / AAA. |
| Category | axe-core category (e.g., forms, keyboard, name-role-value). |
| Target selector | CSS path to the failing element on its page. |
| All matching targets | Every selector on the same page where this rule fires (useful for repeated components). |
| HTML snippet | The exact failing markup, syntax-highlighted. |
| Bounding box | { x, y, width, height } — used to draw the red outline in the page snapshot. |
| Page URL | Which scanned URL this issue came from. |
Screenshot (TODO): Issue detail panel with all fields labeled
Common actions from the detail panel
- Copy selector — one click; paste into DevTools to jump to the element.
- Open in snapshot — switches to Element Inspection with the failing element highlighted.
- View WCAG quickref — external link to the W3C success-criterion page.
- Share issue — copy a deep-link to this specific issue for bug tickets or Slack threads.
How to read "failure summary"
The failure summary is axe-core's explanation of why this element failed. Typical phrasings:
- "Element has insufficient color contrast of 3.12 (foreground color: #888888, background color: #ffffff, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1."
- "Element does not have an alt attribute."
- "Element is in tab order but has no keyboard-accessible name."
These messages are copy-paste-ready for bug reports.
Grouping
The issue list can be grouped:
- By rule — all instances of
image-altin one row. Best for fixing repeated components once. - By WCAG criterion — all
1.4.3 Contrast (Minimum)failures together. Best for compliance reporting.
Switch with the dropdown at the top of the issue list.