仕様策定からリリースまで、AIコーディングエージェントを導く本番品質のエンジニアリングワークフロー集。
lackeyjb/playwright-skill
コーディングエージェントがPlaywrightの自動化スクリプトを作成・実行できるAgent Skill
- スター
- 3,221
- フォーク
- 266
- 未解決の Issue
- 9
- 最終コミット
- 19 日前
これは何?
Playwright Skillは、Claude Codeなどのコーディングエージェントが、ページの簡単な確認から複数ステップのフローまで、必要に応じてPlaywrightによる自動化を作成・実行できるAgent Skillです。あらかじめ用意されたスクリプトに頼るのではなく、エージェントがリクエストごとにコードを生成し、ファイル形式とインライン形式の両方でモジュール解決に対応する同梱のexecutor(run.js)を通じて実行します。
このSkillは基本の指示を簡潔に保ち、タスクで必要になった場合にのみ、より詳細なPlaywright APIリファレンスを読み込みます。デフォルトではブラウザを表示し(headless: false)、実行速度を調整するSLOW_MO設定に対応しています。また、dev-serverの検出や一時的なスクリーンショットの処理などを行う、lib/helpers.js内の任意のヘルパー関数も利用できます。PW_ARTIFACT_DIRが設定されていない場合、成果物はOSの一時ディレクトリに保存されます。
Vercelのskills CLI、Claude Codeプラグイン、またはskills/playwright-skillフォルダをエージェントのSkillディレクトリにコピーしてインストールできます。セットアップではnpm run setupを実行し、PlaywrightとChromiumをインストールします。
主な機能
- 01固定スクリプトを実行するのではなく、リクエストごとにカスタムのPlaywrightコードを作成する
- 02同梱のexecutorを使い、安定したモジュール解決でファイル形式とインライン形式のスクリプトを実行する
- 03ブラウザを表示する設定がデフォルトで、SLOW_MO設定にも対応する
- 04タスクで必要な場合にのみ、詳細なAPIリファレンスを読み込む
- 05dev-serverの検出やスクリーンショットの処理に使える任意のヘルパーを備える
ユースケース
- エージェントにチェックを作成・実行させて、ページやサインアップフローをテストする
- モバイルとデスクトップのビューポートでスクリーンショットを撮る
- ループ、アサーション、ネットワークインターセプトを含む再利用可能な自動化スクリプトを作成する
- サイトのリンク切れや画像の欠落を確認する
クイックスタート
- 1
skills CLI で skill をグローバルにインストールします
npx skills add lackeyjb/playwright-skill --skill playwright-skill --global --yes - 2
インストールした skill のディレクトリからセットアップを実行します
npm run setup - 3
エージェントに簡単なブラウザータスク(google.com が読み込まれるかの確認など)を実行させて、動作を確認します
使う前に知っておきたいこと
- コーディングエージェント向けに設計されており、単体で直接使うテストランナーではありません。
- Node.js が必要です。セットアップ時に Playwright と Chromium をダウンロードします。
トピック
よくある質問
- playwright-skill とは?
- コーディングエージェントがPlaywrightの自動化スクリプトを作成・実行できるAgent Skill Playwright Skillは、Claude Codeなどのコーディングエージェントが、ページの簡単な確認から複数ステップのフローまで、必要に応じてPlaywrightによる自動化を作成・実行できるAgent Skillです。あらかじめ用意されたスクリプトに頼るのではなく、エージェントがリクエストごとにコードを生成し、ファイル形式とインライン形式の両方でモジュール解決に対応する同梱のexecutor(run.js)を通じて実行します。
- playwright-skill は無料で使えますか?ライセンスは?
- playwright-skill は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。
- playwright-skill は今もメンテナンスされていますか?
- 活発にメンテナンス中。playwright-skill の最終コミットは 2026年10月1日 です。
- playwright-skill は何に使えますか?
- エージェントにチェックを作成・実行させて、ページやサインアップフローをテストする モバイルとデスクトップのビューポートでスクリーンショットを撮る ループ、アサーション、ネットワークインターセプトを含む再利用可能な自動化スクリプトを作成する サイトのリンク切れや画像の欠落を確認する
- playwright-skill のインストール方法は?
- skills CLI で skill をグローバルにインストールします: npx skills add lackeyjb/playwright-skill --skill playwright-skill --global --yes インストールした skill のディレクトリからセットアップを実行します: npm run setup エージェントに簡単なブラウザータスク(google.com が読み込まれるかの確認など)を実行させて、動作を確認します
- playwright-skill はどこで入手できますか?
- ソースコードとインストール手順は GitHub にあります:https://github.com/lackeyjb/playwright-skill
概要はプロジェクトの README をもとに AI が生成しています。GitHub の数値は毎日更新されます。
関連プロジェクト
Claude Code、OpenCode、Codex、Cursorなどのコーディングエージェント向けスキルを管理するTUI
Claude Code、Codex CLI、Cursor、OpenCode、Copilot、Antigravity、Pi向けの94プラグイン、202エージェント、185スキル、105コマンドを集めたマーケットプレイス。
Claude Code、Codex CLI、Cursor CLI、Gemini CLI向けの平易なエージェントスキル。セッション報告を誰にでも分かる一画面の結論にまとめます。
Claude CodeやCursorなど17のコーディングツールのAIエージェント用スキル、コマンド、エージェントを管理するObsidianプラグイン。
WebサイトのURLから、音楽に同期した効果音とモーションブラー付きの60 fps製品ローンチ動画を作るClaude Codeスキル。