Executive summary
What this proves
AccessPatch found automatically detectable issues, separates deterministic safe patches from human decisions, and leaves an audit trail for the pull request.
What this does not claim
It does not promise instant compliance. Manual review remains required for meaning, intent, keyboard behavior, screen reader experience, and legal sign-off.
Safe Patches
Dry-run creates patches/suggested-fixes.patch. --apply-safe only changes deterministic fixes such as document language, missing titles, existing labels, duplicate IDs, button types, and focus-visible fallbacks.
- button-name: Add an accessible name using the existing text "Open menu".
- button-name: Add an accessible name using the existing text "Open cart".
- button-name: Add an accessible name using the existing text "Save headphones".
- button-name: Add an accessible name using the existing text "Save lamp".
- button-name: Add an accessible name using the existing text "Save cable kit".
- button-name: Add an accessible name using the existing text "Save travel dock".
- document-title: Add a concise document title in the head element.
- html-has-lang: Add a lang attribute to the root html element, for example lang="en".
Manual Review
These items need a human because the correct fix depends on content meaning, design intent, or user-flow behavior.
- image-alt: Decorative intent should be confirmed before suppressing an image from assistive technology.
- color-contrast: Color contrast changes can affect brand tokens, states, and visual hierarchy.
- color-contrast: Color contrast changes can affect brand tokens, states, and visual hierarchy.
- color-contrast: Color contrast changes can affect brand tokens, states, and visual hierarchy.
- color-contrast: Color contrast changes can affect brand tokens, states, and visual hierarchy.
- color-contrast: Color contrast changes can affect brand tokens, states, and visual hierarchy.
- color-contrast: Color contrast changes can affect brand tokens, states, and visual hierarchy.
- color-contrast: Color contrast changes can affect brand tokens, states, and visual hierarchy.
- color-contrast: Color contrast changes can affect brand tokens, states, and visual hierarchy.
- color-contrast: Color contrast changes can affect brand tokens, states, and visual hierarchy.
- color-contrast: Color contrast changes can affect brand tokens, states, and visual hierarchy.
- image-alt: A tool must not invent meaningful alt text for content images.
- image-alt: A tool must not invent meaningful alt text for content images.
- image-alt: A tool must not invent meaningful alt text for content images.
- image-alt: A tool must not invent meaningful alt text for content images.
- image-alt: A tool must not invent meaningful alt text for content images.
- image-alt: A tool must not invent meaningful alt text for content images.
- image-alt: A tool must not invent meaningful alt text for content images.
- image-alt: A tool must not invent meaningful alt text for content images.
- image-alt: A tool must not invent meaningful alt text for content images.
- link-name: Icon-only controls need a semantic label. Do not guess the action from an icon alone.
- link-name: Icon-only controls need a semantic label. Do not guess the action from an icon alone.
WCAG Map
| Tag | Total issues | Safe | Needs review |
|---|---|---|---|
| wcag2a | 20 | 8 | 12 |
| wcag111 | 10 | 0 | 10 |
| wcag143 | 10 | 0 | 10 |
| wcag2aa | 10 | 0 | 10 |
| wcag412 | 8 | 6 | 2 |
| wcag244 | 2 | 0 | 2 |
| wcag242 | 1 | 1 | 0 |
| wcag311 | 1 | 1 | 0 |
Disclaimer
Automated testing cannot prove full WCAG compliance. This tool identifies automatically detectable issues and suggests or applies safe fixes. Manual review is required for full conformance assessment.
Developer Details
critical safe button-name Buttons must have discernible text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag412
- Suggested fix
- Add an accessible name using the existing text "Open menu".
- Manual review
- Not required for this issue classification.
- Source guess
- examples/static-html-demo/index.html:16 (high, matched axe HTML snippet)
- Targets
- button[data-accesspatch-label="Open menu"]
- HTML
<button data-accesspatch-label="Open menu"><span aria-hidden="true">menu</span></button>
critical safe button-name Buttons must have discernible text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag412
- Suggested fix
- Add an accessible name using the existing text "Open cart".
- Manual review
- Not required for this issue classification.
- Source guess
- examples/static-html-demo/index.html:17 (high, matched axe HTML snippet)
- Targets
- button[data-accesspatch-label="Open cart"]
- HTML
<button data-accesspatch-label="Open cart"><span aria-hidden="true">cart</span></button>
critical safe button-name Buttons must have discernible text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag412
- Suggested fix
- Add an accessible name using the existing text "Save headphones".
- Manual review
- Not required for this issue classification.
- Source guess
- examples/static-html-demo/index.html:46 (high, matched axe HTML snippet)
- Targets
- button[data-accesspatch-label="Save headphones"]
- HTML
<button data-accesspatch-label="Save headphones"> <span aria-hidden="true">save</span> </button>
critical safe button-name Buttons must have discernible text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag412
- Suggested fix
- Add an accessible name using the existing text "Save lamp".
- Manual review
- Not required for this issue classification.
- Source guess
- examples/static-html-demo/index.html:56 (high, matched axe HTML snippet)
- Targets
- button[data-accesspatch-label="Save lamp"]
- HTML
<button data-accesspatch-label="Save lamp"><span aria-hidden="true">save</span></button>
critical safe button-name Buttons must have discernible text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag412
- Suggested fix
- Add an accessible name using the existing text "Save cable kit".
- Manual review
- Not required for this issue classification.
- Source guess
- examples/static-html-demo/index.html:65 (high, matched axe HTML snippet)
- Targets
- button[data-accesspatch-label="Save cable kit"]
- HTML
<button data-accesspatch-label="Save cable kit"> <span aria-hidden="true">save</span> </button>
critical safe button-name Buttons must have discernible text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag412
- Suggested fix
- Add an accessible name using the existing text "Save travel dock".
- Manual review
- Not required for this issue classification.
- Source guess
- examples/static-html-demo/index.html:75 (high, matched axe HTML snippet)
- Targets
- button[data-accesspatch-label="Save travel dock"]
- HTML
<button data-accesspatch-label="Save travel dock"> <span aria-hidden="true">save</span> </button>
serious manual-only color-contrast Elements must meet minimum color contrast ratio thresholds
- URL
- controlled broken demo page
- WCAG tags
- wcag2aa, wcag143
- Suggested fix
- Adjust foreground/background colors or design tokens after checking brand and state requirements.
- Manual review
- Color contrast changes can affect brand tokens, states, and visual hierarchy.
- Source guess
- examples/static-html-demo/index.html:28 (medium, matched selector .low)
- Targets
- div > .low
- HTML
<p class="low">Low contrast text is intentionally hard to read here.</p>
serious manual-only color-contrast Elements must meet minimum color contrast ratio thresholds
- URL
- controlled broken demo page
- WCAG tags
- wcag2aa, wcag143
- Suggested fix
- Adjust foreground/background colors or design tokens after checking brand and state requirements.
- Manual review
- Color contrast changes can affect brand tokens, states, and visual hierarchy.
- Source guess
- examples/static-html-demo/index.html:28 (medium, matched selector .low)
- Targets
- article:nth-child(1) > .low
- HTML
<p class="low">Studio comfort, travel case, quick charge.</p>
serious manual-only color-contrast Elements must meet minimum color contrast ratio thresholds
- URL
- controlled broken demo page
- WCAG tags
- wcag2aa, wcag143
- Suggested fix
- Adjust foreground/background colors or design tokens after checking brand and state requirements.
- Manual review
- Color contrast changes can affect brand tokens, states, and visual hierarchy.
- Source guess
- examples/static-html-demo/index.html:28 (medium, matched selector .low)
- Targets
- article:nth-child(2) > .low
- HTML
<p class="low">Warm light presets and desk clamp.</p>
serious manual-only color-contrast Elements must meet minimum color contrast ratio thresholds
- URL
- controlled broken demo page
- WCAG tags
- wcag2aa, wcag143
- Suggested fix
- Adjust foreground/background colors or design tokens after checking brand and state requirements.
- Manual review
- Color contrast changes can affect brand tokens, states, and visual hierarchy.
- Source guess
- examples/static-html-demo/index.html:28 (medium, matched selector .low)
- Targets
- article:nth-child(3) > .low
- HTML
<p class="low">Reusable clips and sleeves.</p>
serious manual-only color-contrast Elements must meet minimum color contrast ratio thresholds
- URL
- controlled broken demo page
- WCAG tags
- wcag2aa, wcag143
- Suggested fix
- Adjust foreground/background colors or design tokens after checking brand and state requirements.
- Manual review
- Color contrast changes can affect brand tokens, states, and visual hierarchy.
- Source guess
- examples/static-html-demo/index.html:28 (medium, matched selector .low)
- Targets
- article:nth-child(4) > .low
- HTML
<p class="low">HDMI, USB-C, ethernet, compact case.</p>
serious manual-only color-contrast Elements must meet minimum color contrast ratio thresholds
- URL
- controlled broken demo page
- WCAG tags
- wcag2aa, wcag143
- Suggested fix
- Adjust foreground/background colors or design tokens after checking brand and state requirements.
- Manual review
- Color contrast changes can affect brand tokens, states, and visual hierarchy.
- Source guess
- examples/static-html-demo/index.html:28 (medium, matched selector .low)
- Targets
- article:nth-child(5) > .low
- HTML
<p class="low">Desk timer with silent alerts.</p>
serious manual-only color-contrast Elements must meet minimum color contrast ratio thresholds
- URL
- controlled broken demo page
- WCAG tags
- wcag2aa, wcag143
- Suggested fix
- Adjust foreground/background colors or design tokens after checking brand and state requirements.
- Manual review
- Color contrast changes can affect brand tokens, states, and visual hierarchy.
- Source guess
- examples/static-html-demo/index.html:28 (medium, matched selector .low)
- Targets
- article:nth-child(6) > .low
- HTML
<p class="low">Dense foam and washable cover.</p>
serious manual-only color-contrast Elements must meet minimum color contrast ratio thresholds
- URL
- controlled broken demo page
- WCAG tags
- wcag2aa, wcag143
- Suggested fix
- Adjust foreground/background colors or design tokens after checking brand and state requirements.
- Manual review
- Color contrast changes can affect brand tokens, states, and visual hierarchy.
- Source guess
- examples/static-html-demo/index.html:28 (medium, matched selector .low)
- Targets
- article:nth-child(7) > .low
- HTML
<p class="low">Oak finish and steel legs.</p>
serious manual-only color-contrast Elements must meet minimum color contrast ratio thresholds
- URL
- controlled broken demo page
- WCAG tags
- wcag2aa, wcag143
- Suggested fix
- Adjust foreground/background colors or design tokens after checking brand and state requirements.
- Manual review
- Color contrast changes can affect brand tokens, states, and visual hierarchy.
- Source guess
- examples/static-html-demo/index.html:28 (medium, matched selector .low)
- Targets
- article:nth-child(8) > .low
- HTML
<p class="low">Soft light with USB power.</p>
serious manual-only color-contrast Elements must meet minimum color contrast ratio thresholds
- URL
- controlled broken demo page
- WCAG tags
- wcag2aa, wcag143
- Suggested fix
- Adjust foreground/background colors or design tokens after checking brand and state requirements.
- Manual review
- Color contrast changes can affect brand tokens, states, and visual hierarchy.
- Source guess
- examples/static-html-demo/index.html:28 (medium, matched selector .low)
- Targets
- article:nth-child(9) > .low
- HTML
<p class="low">Foldable aluminum stand.</p>
serious safe document-title Documents must have <title> element to aid in navigation
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag242
- Suggested fix
- Add a concise document title in the head element.
- Manual review
- Not required for this issue classification.
- Source guess
- examples/static-html-demo/index.html:2 (high, matched axe HTML snippet)
- Targets
- html
- HTML
<html>
serious safe html-has-lang <html> element must have a lang attribute
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag311
- Suggested fix
- Add a lang attribute to the root html element, for example lang="en".
- Manual review
- Not required for this issue classification.
- Source guess
- examples/static-html-demo/index.html:2 (high, matched axe HTML snippet)
- Targets
- html
- HTML
<html>
critical manual-only image-alt Images must have alternative text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag111
- Suggested fix
- Write accurate alt text based on the image purpose and surrounding content.
- Manual review
- A tool must not invent meaningful alt text for content images.
- Source guess
- examples/static-html-demo/index.html:23 (medium, matched selector .hero-image)
- Targets
- .hero-image
- HTML
<img class="hero-image" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='240'%3E%3Crect width='420' height='240' fill='%2360a5fa'/%3E%3C/svg%3E">
critical manual-only image-alt Images must have alternative text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag111
- Suggested fix
- Write accurate alt text based on the image purpose and surrounding content.
- Manual review
- A tool must not invent meaningful alt text for content images.
- Source guess
- Not mapped in this report.
- Targets
- article:nth-child(1) > img
- HTML
<img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Crect width='240' height='160' fill='%23f97316'/%3E%3C/svg%3E">
critical manual-only image-alt Images must have alternative text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag111
- Suggested fix
- Write accurate alt text based on the image purpose and surrounding content.
- Manual review
- A tool must not invent meaningful alt text for content images.
- Source guess
- Not mapped in this report.
- Targets
- article:nth-child(2) > img
- HTML
<img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Crect width='240' height='160' fill='%2322c55e'/%3E%3C/svg%3E">
critical review-required image-alt Images must have alternative text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag111
- Suggested fix
- If the image is truly decorative, add alt=""; otherwise write meaningful alt text.
- Manual review
- Decorative intent should be confirmed before suppressing an image from assistive technology.
- Source guess
- examples/static-html-demo/index.html:60 (medium, matched selector .decorative)
- Targets
- .decorative
- HTML
<img class="decorative divider" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Crect width='240' height='160' fill='%238b5cf6'/%3E%3C/svg%3E">
critical manual-only image-alt Images must have alternative text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag111
- Suggested fix
- Write accurate alt text based on the image purpose and surrounding content.
- Manual review
- A tool must not invent meaningful alt text for content images.
- Source guess
- Not mapped in this report.
- Targets
- article:nth-child(4) > img
- HTML
<img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Crect width='240' height='160' fill='%23ef4444'/%3E%3C/svg%3E">
critical manual-only image-alt Images must have alternative text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag111
- Suggested fix
- Write accurate alt text based on the image purpose and surrounding content.
- Manual review
- A tool must not invent meaningful alt text for content images.
- Source guess
- Not mapped in this report.
- Targets
- article:nth-child(5) > img
- HTML
<img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Crect width='240' height='160' fill='%230ea5e9'/%3E%3C/svg%3E">
critical manual-only image-alt Images must have alternative text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag111
- Suggested fix
- Write accurate alt text based on the image purpose and surrounding content.
- Manual review
- A tool must not invent meaningful alt text for content images.
- Source guess
- Not mapped in this report.
- Targets
- article:nth-child(6) > img
- HTML
<img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Crect width='240' height='160' fill='%2314b8a6'/%3E%3C/svg%3E">
critical manual-only image-alt Images must have alternative text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag111
- Suggested fix
- Write accurate alt text based on the image purpose and surrounding content.
- Manual review
- A tool must not invent meaningful alt text for content images.
- Source guess
- Not mapped in this report.
- Targets
- article:nth-child(7) > img
- HTML
<img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Crect width='240' height='160' fill='%23f59e0b'/%3E%3C/svg%3E">
critical manual-only image-alt Images must have alternative text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag111
- Suggested fix
- Write accurate alt text based on the image purpose and surrounding content.
- Manual review
- A tool must not invent meaningful alt text for content images.
- Source guess
- Not mapped in this report.
- Targets
- article:nth-child(8) > img
- HTML
<img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Crect width='240' height='160' fill='%237c3aed'/%3E%3C/svg%3E">
critical manual-only image-alt Images must have alternative text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag111
- Suggested fix
- Write accurate alt text based on the image purpose and surrounding content.
- Manual review
- A tool must not invent meaningful alt text for content images.
- Source guess
- Not mapped in this report.
- Targets
- article:nth-child(9) > img
- HTML
<img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Crect width='240' height='160' fill='%2310b981'/%3E%3C/svg%3E">
serious manual-only link-name Links must have discernible text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag244, wcag412
- Suggested fix
- Add an accessible name after confirming the control purpose.
- Manual review
- Icon-only controls need a semantic label. Do not guess the action from an icon alone.
- Source guess
- examples/static-html-demo/index.html:85 (high, matched axe HTML snippet)
- Targets
- a[href$="timer"]
- HTML
<a href="/timer"><span aria-hidden="true">></span></a>
serious manual-only link-name Links must have discernible text
- URL
- controlled broken demo page
- WCAG tags
- wcag2a, wcag244, wcag412
- Suggested fix
- Add an accessible name after confirming the control purpose.
- Manual review
- Icon-only controls need a semantic label. Do not guess the action from an icon alone.
- Source guess
- examples/static-html-demo/index.html:93 (high, matched axe HTML snippet)
- Targets
- a[href$="rest"]
- HTML
<a href="/rest"><span aria-hidden="true">></span></a>