a11y-ai

:robot: a11y-ai

Experimental tool to automatically detect accessibility issues in web pages using OpenAI and provide suggestions for fixing them.

Can I help fixing your a11y issues?

Installation

npm install -g a11y-ai

Usage

Usage: a11y <command> <files> [options]

If no files are specified, it will scan the current directory and
subdirectories for HTML files.

Commands:
  s, scan                     Scan files or URLs for accessibility issues

  f, fix                      Fix accessibility issues interactively
    -i, --issues <issues>     Comma-separated list of issues to fix (disable scan)
    -s, --chunk-size <tokens> Set input chunk size (default: 1000)
    -c, --char-diff           Use character diff instead of patch-like diff
    -y, --yes                 Apply fixes without prompting
    --context <context>       Provide additional context
    --gpt-diff                Make AI generate diff of fixes (experimental)

  r, report                   Generate a report of issues with fix suggestions
    -i, --issues <issues>     Comma-separated list of issues to fix (disable scan)
    -s, --chunk-size <tokens> Set input chunk size (default: 1000)
    -o, --format <format>     Report format [html, md] (default: html)
    --context <context>       Provide additional context
    --gpt-diff                Make AI generate diff of fixes (experimental)

General options:
  --api                   Use specified API URL
  --verbose               Show detailed logs
  --help                  Show this help

You can also set the API URL using the A11Y_AI_API environment variable.

Examples

• Interactively scan & fix a local file:

  a11y fix site.html
  

• Generate a report of issues with fix suggestions for multiple URLs:

  a11y report https://microsoft.com https://docs.microsoft.com
  

• Interactively fix specific issues with additional context:

  a11y fix doc.html \
    --issues "Add missing images alt attributes" \
    --context "This is a documentation where screenshots shows the different step to setup GitHub Copilot on your account" 
  

• Automagicically scan for all HTML files in the current directory and subdirectories, interactively fix the issues:

  a11y
  

Accessibility issues scanning

Accessibility issues scan is done using Playwright with the axe-playwright plugin.

Known limitations

• Issue scanning is only supported for HTML files, not for JS/TS components (but fixing is supported)
• --gpt-diff options is experimental and may not work well in some cases

Changelog

0.12.0 (2023-05-03)

Features

• restore custom rules for partials (b7f24f6)
• switch to Playwright for issue scanning (8fbd6c6)