di-test

Accessibility testing tool that finds WCAG violations and catches patterns automated tools miss.

View project on GitHub

di-test — Accessibility Testing Platform

A tool that helps you find accessibility issues on websites. It combines two approaches: automated WCAG compliance scanning (using CWAC) and visual pattern detection that catches things automated tools miss — like text that looks like a heading but isn’t marked up as one.

You don’t need to be a developer to use it. Install the plugin, point it at a URL, and get a plain-language report of what it finds.

Scanning Modes

The plugin auto-detects your environment and selects the best available mode:

Mode When What you get
Full (Visual patterns + complete CWAC suite) x86-64 systems with CWAC installed (dependencies auto-installed) All audit plugins: axe-core, language, readability, broken links, SEO, and more
Fallback (Visual patterns + axe-core) ARM64 systems or when CWAC is unavailable axe-core accessibility scanning via Playwright — catches WCAG violations on any architecture

You’ll see which mode is active when you start a scan. No configuration needed.

Who Is This For?

  • Accessibility advisors running audits across government or organisational websites
  • Web content managers checking pages for common accessibility patterns
  • Digital inclusion teams building evidence for remediation priorities
  • Developers integrating accessibility checks into their workflow

Our Approach

These principles guide everything the tool does:

  • Never auto-fail WCAG — the tool flags patterns for review, not violations. A human auditor makes the final call.
  • Explain, don’t judge — every finding includes a plain language explanation of what was detected and why it matters.
  • Deterministic first, AI second — rules-based analysis runs first; AI interprets what it found. The AI never invents findings.
  • Auditor trust > AI cleverness — findings include CSS selectors, XPaths, HTML snippets, and screenshots so you can independently verify everything.
  • Zero modification to CWAC — the tool wraps CWAC without changing its source code.

Quick Start

Claude Desktop (Cowork or Code tab)

Uses Fallback mode: Visual patterns + axe-core, no CWAC.

  1. Select + then Plugins then Add plugin
  2. Select the By Anthropic dropdown, then Add marketplace from GitHub and enter: 
    https://github.com/cgbarlow/di-test/
  3. Find and install DI Accessibility Testing Platform from the marketplace
  4. Start scanning:
    • /di-test:full-scan https://example.govt.nz — Run a full accessibility scan (WCAG + visual patterns) and generate reports
    • /di-test:scan https://example.govt.nz — Run an accessibility scan
    • /di-test:visual-scan https://example.com/page — Run visual pattern detection
    • /di-test:report — Generate a report in Markdown + Word

Claude Code (CLI)

Mode used depends on environment, x86-64 system required for full CWAC suite.

  1. In a Claude Code session: 
    /plugin marketplace add https://github.com/cgbarlow/di-test
/plugin install di-test@di-test-marketplace
  2. Start scanning with the same commands as above.

Dependencies are installed automatically. You never need to run pip install or npm install manually.

For manual setup without the plugin system, see Manual Setup.

Available Commands

You can use these commands, but you don’t have to. You can simply ask in natural language and the AI will understand your intent and a suitable command will be used.

Command What it does
/di-test:full-scan Run both CWAC + visual scans and generate all reports
/di-test:scan Run a CWAC accessibility scan against one or more URLs
/di-test:visual-scan Run visual pattern detection (headings, cards)
/di-test:report Generate a report in Markdown and Word formats
/di-test:scan-status Check the status of a running scan
/di-test:results Get detailed findings from a completed scan
/di-test:summary Get a high-level summary of findings
/di-test:list-scans List all active and historical scan results

What Does a Scan Look Like?

Here’s a real example. We scanned the FinCap Our Team page and found 52 patterns to review:

  • 20 heading-like elements — team member names styled to look like headings (large, bold) but marked up as <p> tags instead of <h3>. Screen reader users can’t navigate to them using heading shortcuts.
  • 22 card structures — repeated person cards that may need review for keyboard focus and screen reader behaviour.
  • 3 government identity checks — logo detected, but no copyright notice or privacy policy link found.
  • 2 link quality issues — links opening in new windows without warning users.
  • 1 disclosure widget — an ARIA-expanded element detected for review.
  • 1 heading text quality — an empty heading detected.
  • 1 skip link check — no skip navigation link found.
  • 1 page title — title present and reviewed for descriptiveness.
  • 1 print stylesheet reminder — print styles detected for manual verification.

Every finding includes a plain-language explanation, the exact CSS selector to locate it, and a confidence score. See the full scan report and more examples.

What It Scans

CWAC scans (full mode) check for WCAG compliance issues:

  • Axe-core violations (missing alt text, incorrect list structure, colour contrast)
  • Language readability (Flesch-Kincaid grade levels)
  • Reflow issues (horizontal overflow at 320px viewport)
  • Focus indicator visibility

axe-core scans (fallback mode) check for:

  • All axe-core WCAG violations (same engine as CWAC’s axe_core_audit plugin)
  • Works on any architecture via Playwright

Visual pattern scans catch things automated tools miss:

  • Text that looks like a heading but isn’t marked up as one
  • Card-like content groups that may need accessibility review
  • Elements with heading CSS classes (e.g., class="h3") on non-heading tags
  • Government identity elements (branding, contact info, copyright, privacy links)
  • CAPTCHA implementations that may be accessibility barriers
  • Carousels and sliders without pause/stop controls
  • Disclosure widgets and accordions missing proper ARIA attributes
  • Heading text that is vague, too long, duplicated, or skips hierarchy levels
  • Links with non-descriptive text, missing new-window warnings, or duplicate destinations
  • Skip navigation link presence and functionality
  • Modal dialog accessibility implementation patterns
  • Page title quality (missing, empty, or generic titles)
  • Print stylesheet presence reminders

For technical details, see CWAC MCP Server and Visual Pattern Scanner.

Future Scope

  • Sticky/fixed-position content detection
  • Combined reporting (visual + CWAC findings in one report)
  • Persistent scan state across server restarts
  • Scan cancellation support

Acknowledgements

This tool was instigated by Di Drayton, Accessibility Subject Matter Expert, who defined the original specification for visual pattern detection (SPEC-000-A, SPEC-000-B).

The CWAC integration wraps the Centralised Web Accessibility Checker, created by the Web Standards team within the Digital Public Service branch of Te Tari Taiwhenua, Department of Internal Affairs, New Zealand Government. CWAC is licensed under GPL-3.0.

Built by Chris Barlow.

Licence

This project is licensed under CC-BY-SA-4.0 (Creative Commons Attribution-ShareAlike 4.0 International).

Contributing

See CONTRIBUTING.md for how to get involved, Architecture for project structure and design decisions, and Manual Setup for development environment setup.