1つのAPIでChromium・Firefox・WebKitを操作し、Webアプリのテストやブラウザー自動化を行うフレームワークです。
優良食堂ギット飯が実際に動かして検証し、選んだリポジトリです解説ページへ →中辛 の解説
Webアプリの画面操作を自動化し、E2Eテストや操作スクリプトをChromium・Firefox・WebKitの3ブラウザーで実行するためのフレームワークです。READMEでは用途別に5つの入り口が示されています。Playwright Testはテストランナー、CLIはコーディングエージェント向け、MCPはAIエージェント向け、Libraryはテストランナーを使わないスクリプト向け、VS Code拡張はエディター内でのテスト実行とコード生成向けです。導入方法は用途ごとに異なり、Playwright Testは npm init playwright@latest で始める方法と、手動で追加する方法が案内されています。CLI・MCP・Libraryはnpmやnpxのコマンドで導入します。テストはデフォルトでヘッドレス(画面を表示せずに)実行され、Linux・macOS・Windowsでの対応がREADMEの表に記載されています。README内の画面キャプチャは未完成(TODO)のままで、デモ動画はありません。
こんなリポジトリです
こんなときに便利です
- Webアプリの主要な画面操作を、テストとして自動で繰り返し確認したい開発者(Playwright Test)
- コーディングエージェントにブラウザー操作を任せ、操作確認やスクリーンショット取得を行いたい開発者(CLI)
- テストランナーを使わず、スクリーンショット・PDF生成・リクエストの遮断をスクリプトで行いたい開発者(Library)
主な機能
ほかとの違い
1つのフレームワークから、テスト・スクリプト・AIエージェント向けの操作経路を選べ、単一APIで3ブラウザーを扱える点です。
このリポジトリの作り方
はじめてですか? むずかしくありません — 上から順にたどれば、自分の環境で動かして味見できます。
準備するもの
- Playwright Testをnpm initで導入する場合のみ:npm init playwright@latest を実行します。
- Playwright Testを手動で追加する場合のみ(初期化経路とは代替関係):npm i -D @playwright/test と npx playwright install を実行します。
- コーディングエージェント向けCLIを使う場合のみ:npm install -g @playwright/cli@latest を実行します。他の利用経路の共通要件ではありません。
- Claude CodeでMCPを使う場合のみ:claude mcp add playwright npx @playwright/mcp@latest を実行して登録します。
- JavaScriptのLibraryでブラウザー操作スクリプトを書く場合のみ:npm i playwright を実行します。
すぐに始める
方法A: npm init で始める(Playwright Test)
- Playwright Testの導入コマンドを実行します。
npm init playwright@latest
- テストを実行します。
npx playwright test
方法B: 手動で追加する(方法Aの代わりに使う)
- テスト用パッケージを追加します。
npm i -D @playwright/test
- ブラウザーをインストールします。
npx playwright install
- テストを実行します。
npx playwright test
ギット飯トライで味見
入れるのが面倒で少し不安だったなら — 安全スキャンからインストールまで、ターミナル一行で終わります。
ターミナルに貼り付ければ、ギット飯の安全スキャン → 隔離フォルダへ clone → インストール → 実行方法の案内まで自動です。はじめてでも大丈夫 — この一行だけです。
npx gitbap-try microsoft/playwright
Node.js さえあれば、インストールなしで動きます · ギット飯トライとは? →
これを仕事に活かす
味見がすんだら次は応用です — 仕事やビジネスに活かす方法をまとめました。
レシピ — AI にこのまま頼んでみてください
レシピを読み込んでいます…
スター推移 · 7日
確認日時
使いやすさ · まねしやすいか
- ゆるいライセンス
- テストあり
- サンプル集
- 最近の更新
- AGENTS.md
- llms.txt
- テンプレート
最近の更新あり · 2019 年に作成
「自動化・ワークフロー」 こういうリポジトリを毎週受け取りませんか?
毎週月曜の朝、選んだ一膳だけ。広告なし · いつでも解除。
自分のリポジトリですか? README にギット飯バッジを貼る
[](https://www.gitbap.com/r/microsoft/playwright)Claude からそのまま使う — ギット飯のつなぎ方
ギット飯を Claude につなぐと、こうしたリポジトリを Claude・Cursor・Codex から直接さがして試せます。
Claude の設定 → コネクタにこのアドレスを貼り付け。
https://www.gitbap.com/api/mcpプラグインを入れると /gitbap-trending·/gitbap-try のスラッシュコマンドで、その場でリポジトリを試せます。Claude Code で下の 2 行を順に実行してください。
/plugin marketplace add jakeparkcolde/gitbap-cowork/plugin install gitbap-cowork@gitbapAI が README をもとに要約しました · 原文を見る