Communitygithub.com

mrfacecheck/viewwright

スコープを限定したプロダクトUI作業と、動作を維持しつつ証拠確認済みのハンドオフを実現するCodexスキル。

viewwright とは?

このスキルは、スコープを限定したプロダクトUI作業において、既存の動作を維持し、証拠に基づいた信頼性の高いハンドオフを実現するために設計されたCodexスキルです。主にCodexエージェント向けに開発されており、ビジュアルリグレッションや機能テストを自動化することで、UI変更の正確性と非破壊性を保証します。viewwrightは、ブラウザ操作のスクリーンショット比較やアサーションを通じて、変更前後の動作が期待通りであることを確認します。これにより、開発者は手動テストに頼ることなく、自信を持ってUIの変更をプロダクションに投入できます。また、スキルはスコープを限定することで、大規模なコードベースでも効率的に動作し、部分的なUI修正や機能追加に特化したワークフローを提供します。

対応~Claude Code✓Codex CLI~Cursor
npx skills add mrfacecheck/viewwright

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

viewwright は何をしますか?

Codexスキル - スコープを限定したプロダクトUI作業と、動作を維持しつつ証拠確認済みのハンドオフ。

概要

このスキルは、CodexエージェントがUIコンポーネントの変更を安全に行い、既存の動作を壊さないことを検証するためのものです。viewwright は、ビジュアルテスティングと機能アサーションを組み合わせ、変更の正確性を証明します。

主な機能

  • スコープの限定: 特定のUIコンポーネントやページに焦点を当て、変更の影響範囲を最小限に抑えます。
  • 動作の維持: 既存のテストやスクリーンショット比較を使用して、変更後も動作が変わらないことを確認します。
  • 証拠確認済みハンドオフ: 変更の成否を視覚的証拠(スクリーンショット差分など)とともに提供し、レビュアーや後続のエージェントが即座に判断できるようにします。

使用方法

  1. スキルを有効にした状態で、CodexにUI変更の指示を与えます。
  2. スキルが自動的に該当UIのスコープを特定し、変更前の状態を記録します。
  3. 変更後、スキルがビジュアルテストと機能テストを実行し、結果をレポートします。

動作環境

  • Codex(GitHub Copilot または OpenAI Codex CLI)
  • Node.js 18以上(推奨)
  • Playwright または Puppeteer(ブラウザ自動操作用)

設定

環境変数 VIEWWRIGHT_SCOPE でスコープを明示的に指定できます(例:pages/dashboard.tsx)。指定しない場合、変更されたファイルを自動検出します。

ライセンス

MIT ライセンス

関連スキル