Playwright

e2e-testing は、安定したエンドツーエンドテスト自動化のための Playwright 向けガイドです。ファイル構成、Page Object Model の活用、設定、CI 対応、アーティファクトのデバッグ、flaky テストの扱いまで、実運用を見据えたパターンを整理しています。

ui-demo は、Playwright を使って洗練されたWebアプリのデモ動画を収録するのに役立ちます。カーソルの動きが見え、自然なテンポで進むので、操作手順の紹介、オンボーディング動画、機能ツアー、チュートリアル風の収録に向いています。安定した結果を出すには、まず discover、次に rehearse、最後に record という流れで進めてください。特に、プロトタイプや変化の速い UI で効果的です。

tdd-workflow は、新機能の追加、バグ修正、リファクタリング向けのテストファースト・ワークフロー skill です。ユニットテスト、統合テスト、E2E テストをまたいで 80% 以上のカバレッジを求め、明確なチェックポイントとエッジケース検証も組み込みます。Test Automation を実践的に進めたいときや、コード変更をより予測しやすくしたいときに使う skill です。

data-scraper-agent は、Web スクレイピング、データ強化、保存までを一貫して行う、再利用可能な公開データパイプラインの構築を支援します。GitHub Actions を使って、ジョブ、価格、ニュース、リポジトリ、スポーツ、掲載情報などを定期監視する用途に向いており、出力先は Notion、Sheets、Supabase に対応します。一度きりの抽出よりも、継続的な追跡に最適です。

canary-watch は、リリース、マージ、依存関係更新のあとに、本番またはステージングのライブ URL をチェックして回帰を検出するためのデプロイ後監視スキルです。

browser-qaは、デプロイ後のビジュアルテスト、操作確認、レスポンシブなスクリーンショット取得、アクセシビリティレビューを browser automation で行うためのブラウザQAスキルです。frontend developers や QA teams が、汎用的なプロンプトではなく再現性のある browser-qa guide を使って、staging や preview のページを検証するのに役立ちます。

webapp-testingは、Python PlaywrightでローカルWebアプリを検証するためのスキルです。`scripts/with_server.py`でサーバーを起動し、描画後のUI確認、セレクタ探索、スクリーンショットやコンソールログ取得を行い、偵察重視の手順でフロントエンド挙動を確かめられます。

browse は、QA、dogfooding、ブラウザ自動化に使える高速なヘッドレスブラウザ skill です。ページを開く、要素を操作する、状態を確認する、操作前後を比較する、スクリーンショットを取得する、レスポンシブレイアウトやフォーム、アップロード、ダイアログ、要素状態を検証するといった用途に使えます。汎用的なプロンプトではなく、ブラウザ上の証拠が必要なときに browse を導入してください。

cloudスキルは、Browser AutomationでBrowser Use Cloudを導入・活用するためのガイドです。クイックスタート、v2 / v3 API、SDKの使い方、sessions、profiles、CDP接続、proxies、webhooks、ライブモニタリングまで幅広く確認できます。

gstack は、QAテスト、dogfooding、リリース確認、バグ収集に使えるブラウザ駆動の AI skill です。実際のページを開き、UI をクリックして操作し、状態を検証し、前後差分を比較し、レスポンシブレイアウトをテストし、スクリーンショット付きの証拠を記録します。信頼できるブラウザ結果が必要な UI デザインレビューやデプロイ検証では、とくに有用です。gstack skill から得られる結果をもとに判断したい場面に向いています。

webapp-testing は、ローカル Web アプリの確認、デバッグ、テストに使える Playwright ベースのスキルです。静的 HTML のチェック、動的アプリの事前調査、スクリーンショット取得、コンソールログ収集、セレクター探索、scripts/with_server.py を使ったサーバーライフサイクル設定まで、エージェントの作業を段階的に導きます。

diagnose は、手強いバグ、フレークしやすいテスト、パフォーマンス劣化のための構造化されたデバッグ手順です。問題の再現、失敗ケースの最小化、仮説を1つずつ立てること、計測の追加、根本原因の修正、回帰テストによる固定化までを一連で支援します。「debug this」だけでは足りないときに、diagnose ガイドを使ってください。

browser-automation は、スクレイピング、フォーム入力、スクリーンショット、ダウンロード、セッション管理、構造化データ抽出に向けた Playwright ワークフローをエージェントが構築するためのスキルです。レシピ、API リファレンス、本番運用向けブラウザ自動化のヘルパースクリプトを含み、E2E テストではなく実務のブラウザ自動化に焦点を当てています。

testrail は、Playwright と TestRail の同期に特化した skill です。TestRail cases を注釈付きの Playwright tests として取り込み、必要な認証情報と MCP tools を使って JSON reporter results を TestRail に戻します。

report は、Playwright のテストレポート作成を支援する軽量スキルです。既存の成果物を確認し、必要に応じてテストを実行し、結果を解析して、Markdown、Slack、TestRail、CI向けのサマリーを生成します。

init は、JavaScript または TypeScript プロジェクトにエンドツーエンドテスト基盤を追加するための Playwright セットアップ skill です。この init ガイドでは、リポジトリの確認、Playwright のインストール、設定ファイルの生成、テストフォルダの作成、CI で使いやすい Test Automation 向けデフォルト設定の追加までを進められます。

fix は、失敗するテストや flaky なテスト向けの Playwright デバッグ skill です。agent が再現、burn-in runs、trace capture、そして timing、isolation、environment、infrastructure の問題を taxonomy に基づいて診断する流れを進められるよう支援します。

browserstack skill は、BrowserStack のクラウドグリッド上で Playwright テストを設定するためのスキルです。必要な認証情報、connectOptions、ブラウザマトリクスの設定、クロスブラウザ Test Automation に向けた実用的な browserstack の使い方を扱います。

playwright-cli は、Playwright をコマンドラインから操作するブラウザ自動化 skill です。ページを開く、要素を確認する、フローをクリックで進める、フォームに入力する、スクリーンショットを取得する、リクエストをモックする、実際の操作からテストコードを生成する、といった作業に役立ちます。再現性のあるブラウザ自動化や UI テストに適しています。

azure-resource-manager-playwright-dotnet は、Azure Resource Manager と Microsoft Playwright Testing 向けの .NET 管理プレーンスキルです。バックエンド開発やプラットフォーム自動化のチームが、Playwright ワークスペースの作成・管理、名前の使用可否確認、ワークスペースのクォータ管理を行うのに役立ちます。テスト実行ではなく、プロビジョニングやワークスペースのライフサイクル管理に使ってください。

excalidraw-diagram は、単に箱や矢印を並べるだけでなく、視覚的に論旨が伝わる Excalidraw JSON 図を作成する skill です。ワークフロー、アーキテクチャ、シーケンスフロー、意思決定の分岐、概念図など、構造・読みやすさ・実際の関係性が重要な場面に向いています。インストール手順、レンダリングを意識したチェック、よりよい図作成のための実践的なワークフローも含まれています。

Playwrightのエンドツーエンドテストを、page objects、クロスブラウザ実行、CI向けセットアップ、認証処理、安定したテスト構成で作成・デバッグするためのplaywright-testingスキルです。

playwright-best-practices は、安定したテスト作成、flake の削減、認証フローの改善、fixtures と page objects の使い分け、さらに CI・popups・mobile・iframes・websockets・multi-user シナリオへの対応まで、実践的なリポジトリ根拠に基づいて学べる Playwright + TypeScript 向けスキルです。

use-my-browserは、適切なWebレイヤーを選ぶためのブラウザ自動化戦略スキルです。公開Webツール、live Chrome、raw fetch、Playwrightを、サインイン必須の操作、動的ページ、DevTools起点の作業に応じて使い分けられます。