A11y Audit Until Clean
おすすめ手動実行コード品質最大 8 ラウンド
A11y Audit Until Clean について
変更した UI のアクセシビリティ問題を解消するためのループです。各ラウンドでアクセシビリティ監査を実行し、レポートに基づいてコードを修正します。最大 8 ラウンドまで行います。
主な機能
- 01手動トリガーで、開始のタイミングは利用者が決められる
- 02npm run test:a11y の終了コードで成否を判定
- 03最大 8 ラウンドで無限の再試行を防止
- 04現在は Cursor に対応
活用シーン
- 01UI の変更を含む PR を出す前
- 02新しいフォームやダイアログのコンポーネントを追加した後
- 03監査レポートの重大な違反を順に解消するとき
- 目標
- 変更した UI の重大なアクセシビリティ違反が 0 件で、監査コマンドで確認できる状態にします。
- 終了条件
- npm run test:a11y が終了コード 0 で終わったとき、または 8 ラウンドで通らなかったときに停止します。
- 各ラウンドの間に実行
- npm run test:a11y
起動プロンプト
Cursor に貼り付けて実行すると、終了条件を満たすまでエージェントが以下の手順を繰り返します。
prompt.md
「A11y Audit Until Clean」ループを開始します。 目標:変更した UI の重大なアクセシビリティ違反が 0 件で、監査コマンドで確認できる状態にします。 最大ラウンド数:8。 ステップ 1:a11y 監査を実行 — npm run test:a11y を実行し、報告された違反を読み取ります。終了コードが 0 なら合格とみなし、ループを終えます。 `npm run test:a11y` ステップ 2:重大な違反を特定 — レポートから変更した UI に関わる重大な問題を選び、該当するコンポーネントや要素を突き止めます。 ステップ 3:コードを修正 — ラベルの追加、コントラストの調整、セマンティクスの修正など、問題ごとに最小限の変更を加えます。その後、次のラウンドで再び監査します。 各ラウンドの間に実行:`npm run test:a11y` 終了条件:npm run test:a11y が終了コード 0 で終わったとき、または 8 ラウンドで通らなかったときに停止します。
手順
各ラウンドは順番に実行され、終了条件を満たさなければ次のラウンドへ進みます(最大 8 ラウンド)。
01
a11y 監査を実行
npm run test:a11y を実行し、報告された違反を読み取ります。終了コードが 0 なら合格とみなし、ループを終えます。
$
npm run test:a11y02
重大な違反を特定
レポートから変更した UI に関わる重大な問題を選び、該当するコンポーネントや要素を突き止めます。
03
コードを修正
ラベルの追加、コントラストの調整、セマンティクスの修正など、問題ごとに最小限の変更を加えます。その後、次のラウンドで再び監査します。
未達 → 次のラウンド条件を満たせば終了
対応エージェント
この Loop をそのまま実行できるコーディングエージェントです。
Cursor
Claude Code
コメント
Markdown 対応