mcpField
P
playwright

playwright

github.com/full-stack-skillsテスト・品質288 回インストール4 週間前に更新
リポジトリ

playwright について

Playwrightによるブラウザーのエンドツーエンドテストを設定、作成、実行するためのスキルです。ロケーター、フィクスチャ、複数ページ、CI、レポートやトレースを使った調査を扱います。

主な機能

  1. 01Playwrightの導入と設定
  2. 02ロケーターとフィクスチャの案内
  3. 03ブラウザーとAPIのテストパターン
  4. 04テスト実行とUIモード
  5. 05レポート、トレース、スクリーンショット

活用シーン

  1. 01ブラウザーのエンドツーエンドテスト作成
  2. 02CI実行向けのテスト設定
  3. 03トレースを使った失敗調査

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/full-stack-skills/testing-skills --skill playwright

インストール後、Claude Code で/playwrightを入力して読み込まれたか確認します。

同梱ファイルagents/openai.yamlLICENSE.txt

詳細

このスキルを使う場面

次のような場合にこのスキルを使います。

  • Playwright を使ってブラウザーの E2E テストを作成またはデバッグする場合(複数ブラウザー、複数タブ、自動待機)
  • プロジェクト、ロケーター、Fixture、CI の実行を設定する場合

このスキルの使い方

  1. インストール:npm init playwright を実行します。ブラウザーと言語を選択すると、サンプルと設定が生成されます。
  2. 作成:page.goto、getByRole、click、fill、expect を使います。自動待機とアサーション、複数ページと API リクエストに対応します。
  3. 実行:npx playwright test を実行します。headed/UI モード、レポート、trace を利用できます。

ベストプラクティス

  • getByRole/getByLabel を優先し、脆弱な xpath は避けます。
  • テストケースは独立させ、繰り返し実行できるようにします。fixture または beforeEach を使って状態を準備します。
  • CI では依存関係とブラウザーをインストールします。失敗時には trace とスクリーンショットを保存します。

キーワード

playwright, E2E, エンドツーエンドテスト, 複数ブラウザー

コメント