このプロジェクトについて
Leeway UI Check は、AI コーディングエージェントによる UI 変更結果を検証するツールで、Web と Flutter のシナリオに対応しています。基本的な流れは、ユーザーが参照スクリーンショットとページ要件を提供し、コーディングエージェントがページを修正し、Leeway が Playwright で実装結果を取得して、ピクセル・SSIM・レイアウト・テキストのレポートを返し、次の修正に活用するというものです。
主な機能
- 参照画像とページのスクリーンショットを比較し、通常差分画像、厳密差分画像、領域ごとの問題箇所を出力します。
- テキスト、幾何学、インタラクション、リソースのエラーを単一スコアに混ぜず、独立したブロック条件として扱います。
- 5 つの MCP ツールでコーディングエージェントと連携します。コードバージョンの提出、フィードバックの照会、キャンセル、納品です。
- 各ラウンドのソースコードスナップショット、レポート、証跡を保存し、納品前に対応バージョンを確認できます。
使用方法
検証済みの開発環境は Windows / PowerShell、Node 22.16.0、Python 3.13 です。初回インストールでは、リポジトリのクローン、npm ci の実行、Python 仮想環境の作成と workers/requirements.txt のインストール、npm run setup:browser の実行が必要です。その後、npm run build、npm run demo、npm run cli -- report で 3 つのプリセットページバリアントを実行し、ローカルレポートページ(127.0.0.1:4318)を開けます。
自社プロジェクトに組み込む場合は、タスクテンプレートで参照画像、ビューポート、ソースコードディレクトリ、起動コマンドを設定し、タスクを作成して worker を起動し、MCP ガイドに従ってコーディングエージェントを接続します。全体のループは、エージェントがソースコードを修正 → submit → worker がスクリーンショット取得と比較 → レポート → エージェントが再度修正、となります。
制約と制限
プロジェクトの説明では、ローカル単一ユーザー向けの初期バージョンとされています。デフォルトスコアは診断用であり、正式な受け入れには検証済みプロファイルが必要です。OCR、ビジョンモデル、安全な隔離、実モデルによる自動収束は未実装または未検証です。Harness はボタンの業務上の振る舞いを自動推測しないため、確認が必要なインタラクションはタスク設定に記述する必要があり、レポート内の修正提案は検証待ちの仮説です。ドキュメントには、使用ガイド、MCP 接続、よくある質問、アーキテクチャ説明、スコア調整、更新履歴、貢献ガイド、安全境界が含まれます。プロジェクトは MIT ライセンスです。
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.