github/accessibility-scanner

Finds potential accessibility gaps, files GitHub issues to track them, and attempts to fix them with Copilot.

何ができるか

AI駆動のアクセシビリティスキャナー は、ウェブページ(または指定した任意のURL)に対して自動アクセシビリティチェックを実行するGitHub Actionです。AI駆動のツール(特にGitHub Copilot)を使用して、各検出結果をGitHubのイシューに変換し、Copilotを有効にすると、人間がマージ前にレビューできる修正用のプルリクエストを提案します。

なぜ重要なのか

  • WCAGの問題を早期に発見 – スキャナーはトリガーされたすべてのワークフローで実行されるため、アクセシビリティの回帰問題が本番コードにマージされる前に検出されます。
  • 検出結果を自動的に作業項目に変換 – 各違反は追跡可能なイシューに変換され、ルールやURLごとにオプションでグループ化されるため、チームは問題を見逃すことがありません。
  • AIを活用して迅速な修正 – Copilotを有効にすると、このアクションは問題を修正するPRを草案化し、一般的な問題の是正に必要な手作業を削減します。
  • 既存のCI/CDに統合可能 – GitHub Actionsワークフローの単なるステップにすぎず、write権限を持つPAT(個人用アクセストークン)のみが必要です。

使い方

  1. .github/workflows/ にワークフロー・ファイルを追加(例:a11y-scan.yml)。
  2. スキャン対象のURLを指定する(または、url_configs JSONで、待機するセレクターや除外する要素を指定)。
  3. イシュー、PR、リポジトリへの書き込みを可能にする細粒度個人用アクセストークン(GH_TOKEN)を提供。
  4. オプション設定を構成する – スクリーンショットの有効化、イシューのグループ化、スキャンエンジン(axe、accesslint、またはカスタムプラグイン)の選択、プレビュー用のドライランの実行。
  5. ワークフローを手動またはスケジュール/PRトリガーで実行。アクションは以下の処理を行います:
    • Playwrightを起動し、選択されたスキャナーを実行し、検出結果を収集。
    • 各検出結果に対してGitHubイシューを作成(group_byの設定に応じてグループ化)。
    • Copilotが有効な場合、イシューをCopilotに割り当て、修正提案付きのPRを開く。
    • wontfixラベルを尊重し、閉じたイシューが再開されないようにする。

どのチームに推奨か

  • プロダクトおよびフロントエンドチーム:自動アクセシビリティレグレッションテストを希望する。
  • オープンソースのメンテナ:貢献者にアクセシビリティバグを可視化したい。
  • GitHub Copilotを利用している組織:AIの支援をアクセシビリティ修復に拡張したい。
  • GitHub Actionsを利用可能な任意のリポジトリ:小さなワークフローとPATを追加できる。

制限事項と注意点

  • スキャナーはパブリックプレビュー中 – 機能は変更される可能性があり、完全にアクセシブルなコードを保証しません。
  • AI生成の修正は提案のみであり、マージ前にレビューが必要です。
  • 自動PR作成にはGitHub Copilotに依存しています – Copilotがなければイシューは作成されますが、自動修正はできません。
  • スキャンはヘッドレスなPlaywright環境で実行されます。複雑な認証が必要なページには auth_context 入力が必要な場合があります。
  • アクションはスクリーンショットとキャッシュされた結果用に gh-cache ブランチを作成します。このブランチはリポジトリに表示されます。

クイックスタートチェックリスト

  • ✅ 対象リポジトリでGitHub Actionsとイシューを有効化。
  • ✅ actions、contents、issues、pull-requests、metadata スコープを持つ細粒度PATを作成。
  • ✅ GH_TOKEN という名前のシークレットとしてPATを追加。
  • ✅ 必要な repository、token、cache_key 入力を含むワークフロー・ファイルを追加。
  • ✅ (オプション)GitHub Copilotを有効化し、より良い修正提案のために .github/copilot-instructions.md をカスタム。

すべての詳細はリポジトリのREADMEから直接取得されています。

関連

  • プロジェクト
  • プロジェクト
  • プロジェクト
  • プロジェクト
  • Dispatch