はじめに
株式会社ネクストスケープ Chief Technology Office所属の小野塚です。
以前、Playwright MCPについての記事を書きまして、非常に使い勝手の良い素晴らしいツールでした。
そのPlaywrightにまた動きがありまして、Playwrightエージェント、Playwright Test Agentというものが発表されました。
エージェントは３種類、Planner、Generator、Healerの３つが用意されていて、この３つを利用することで製品のテストカバレッジが向上するとのことです。
それぞれの役割は以下になります。
- Planner：アプリを探索し、Markdown テスト プランを作成します
- Generater：はMarkdown プランを Playwright テスト ファイルに変換します
- Healer：テストスイートを実行し、失敗したテストを自動的に修復します
ちょっとこの説明だけではピンと来ないと思いますので実際に試してみたいと思います。
まずはアプリケーションを用意しましょう。
今回はASP.NET CoreのWebアプリをベースとした以下のスクリーンショットのようなToDoアプリをAWS Kiroに作ってもらいましたのでこれを元に試してみたいと思います。
ToDoの作成から編集、削除といったように色々な操作がありますのでそれなりのテストが必要になるはずです。
準備
まずはPlaywright Test Agentをインストールします。
npm install -D @playwright/test
次に実行環境なのですが、現時点（2025/10/14）ではClaude CodeとVS Codeで利用可能です。
ただし、VS CodeはVS Code Insiders v1.105以上でなければならないようでして、今回はClaude Codeで試してみたいと思います。
今回用意したアプリケーションのプロジェクトのルートディレクトリで以下のコマンドを叩きます。
npx playwright init-agents --loop=claude
以下のようにテストエージェントの実行に必要なファイルが作成されます。
次に「claude」と入力し、Claude Codeを起動します。ここまでで準備が完了です。
テストプラン作成
では、まずは順番通りPlannerでテストプランを作成してもらおうと思います。
ただ、その前に@plannerと入力してもらい、以下のようにテストエージェントに関する情報が表示されるかどうか、つまり正しくテストエージェントがインストールされているか確認してください。
問題無ければ改めて実行してみましょう。
Claude Codeはinitコマンドでまずはコード解析を行うはずなのでそれは不要なのだろうかと思いつつ以下のプロンプトを実行してみます。
「@planner
このプロジェクトのテスト計画を作成してください」
すると以下のようにMarkdownファイルでテストプランが作られます。
全てを載せるのは冗長ですので幾つか抜き出してお見せします。
以上のようにセキュリティテストも含めた（当然ながら）しっかりしたテストプランが作成されています。
テスト生成
ではこのテストプランに基づき、テストスクリプトを生成してもらいます。
次はGenaratorエージェントに対して指示を行います。
「@generator
テストプラン.mdからPlaywrightテストを生成してください。」
処理が次々と実行され、～.ts形式のスクリプトファイルを作成してくれます。
順番が前後しますが、最初に以下のようなToDoリストを作成しそれに基づきテストスクリプトを作成していきます。
- 基本機能テスト（タスクCRUD）のPlaywrightテスト生成
- フィルタリング機能のテスト生成
- 編集機能のテスト生成
- セキュリティテスト（XSS対策）の生成
以下のようにテストスクリプトが完成すると、どのようにテストを実行すれば良いかも教えてくれますのでそれに従ってテストを実施します。
するとPlaywrightによりテストが実施され、最終的に以下のような結果が表示されます。
テスト修正
175個のテストのうち、117個が失敗しているとのことなので３つのエージェントのうちの最後のエージェント、Healerエージェントに依頼し、修正を行います。
「@healer
テストが失敗しているようです」
修正が実施され、完全に全てが修正されたわけではないですが、再度テストを実施したところ160個はPASSするようになりました。
ちなみに以下７つのブラウザごとのテストを実施してくれます。
- chromium (Desktop Chrome)
- firefox (Desktop Firefox)
- webkit (Desktop Safari)
- Mobile Chrome (Pixel 5)
- Mobile Safari (iPhone 12)
- Microsoft Edge
- Google Chrome
最後に
有償のテストツールでなくともかなり詳細なレベルでのテストを実行してくれるこのPlaywrightのTest Agent、いかがでしょうか。
小規模のToDoアプリでさえ、このレベル（170近くのテスト項目）ですので大規模プロジェクトになると更にすごいボリュームになると思います。
そうなるとちょっと取り扱いが難しくなってくるため、テストプランの段階である程度細かく分けてもらい、それに従ってスクリプトの作成、実行という形にした方が良いかもしれません。
最初に挙げたPlaywright MCP、もしくはChrome DevTools MCPを使うことで自然言語でPlaywrightのスクリプトが作成できるのですが、自分自身で抜け漏れなくスクリプトを作りこむのは如何に簡単に作れるようになったとはいえ、やはり大変な作業です。
しかしながらこのTest Agentを使うことでそれがもっと簡単に実現できるようになります。
かなり使える機能だと思いますので皆さんも是非お試しください。
当社ネクストスケープはこのように生成AIを始めとした新しい技術・知識を日々取り入れており、Webサイト、スマホアプリ、Hololensアプリの開発をはじめ、CMSを利用したサイトの新規構築やリニューアルなど、お客様のニーズに幅広く対応いたします。お困りのことがございましたら、いつでもお気軽にお問い合わせください。
（以下当社お問合せフォーム）
当社では一緒に働いてくれる仲間を募集しています。是非以下のサイトよりお申込みください。
