「エージェントもスキルもMCPもある」で止まった
先日Agent Teamsの記事を書いたとき、コメントで「結局Skillsって何なんですか」と聞かれました。よく考えたら私も最初は同じところで止まっていました。Playwright MCPを入れてAIにブラウザを触らせるようになった。次に/playwright init-agentsでPlanner・Generator・Healerという3つのエージェントを知った。そこにさらにClaude Codeの「Skills」という仕組みが出てきて、Playwright用のSkill実装まで公開され始めている。1年目のエンジニアはもちろん、16年やっている私でも「これ全部入れる必要あるんですか」と聞かれたら一瞬詰まります。
今回はこの3つを整理してみます。結論から言うと、MCP＝ブラウザを触るための口、Agents＝テスト作りの役割分担、Skills＝自分の手順をAIに覚えさせる汎用の箱、という住み分けです。この3層で見えると、迷いがだいぶ減ります。
おさらい：MCPは「口」でしかない
まずMCPの話は以前の入門記事で書きました。MCP（Model Context Protocol）は、AIがブラウザやファイルなど外部のものを操作するための共通プロトコルです。Playwright MCPを繋ぐと、Claude Codeはブラウザを「見て」「クリックして」「入力する」ことができるようになります。
ここで大事なのは、MCPはあくまで手段だという点です。MCPを繋いだだけでは、AIが「何のテストを作るべきか」「どういう手順で進めるべきか」は決まりません。ハンドルとアクセルは付いたけど、目的地も走り方も決まっていない車のようなものです。この後に出てくるAgentsとSkillsは、どちらもこの「口」の上に乗る仕組みという点で共通しています。違うのは、誰が・どう決めた手順で走るか、です。
Agents：Playwrightが用意した定型パイプライン
Playwright Test Agentsは、npx playwright init-agents --loop=claudeで導入する、あらかじめ役割が決まった3つのエージェントです。以前書いた記事で詳しく紹介したので手順はそちらに譲りますが、役割だけおさらいします。
- Planner：動いているアプリを実際に探索して、テストすべき流れをMarkdownの計画書に落とす
- Generator：その計画書をPlaywrightのテストコードに変換する
- Healer：テストを実行し、落ちたテストを自動で修復する（詳しくはHealerの記事）
ここで押さえておきたいのは、この3つは順番も役割もPlaywright側があらかじめ決めているという点です。「探索して→計画して→書いて→直す」という定型のパイプラインで、私たちがやることは各段階でエージェントにプロンプトを渡すことだけです。決まったレールの上を走ってくれる分、初めて自動テストの土台を作るときには一番迷いが少ない選択肢だと思います。
Skills：Claudeが自分で判断して読み込む「箱」
一方でClaude CodeのSkillsは、Test Agentsとは成り立ちが違います。SkillはSKILL.mdというファイル1枚（と必要に応じて参考資料や補助スクリプト）を1つのフォルダにまとめたもので、冒頭のYAMLに「どんな場面で使うか」の説明を書いておきます。Claudeは会話の内容を見て「今はこのSkillが要りそうだ」と自分で判断し、必要になった時だけSKILL.mdを読み込みます（model-invoked、と呼ばれる方式です）。使わない限り本文はコンテキストに乗らないので、Skillをいくつ登録してもトークンを無駄に食わない、という設計になっています。
この「Claudeが自分で必要性を判断する」というところがAgentsとの一番の違いです。Test Agentsは私たちが/playwright init-agentsで明示的に呼び出し、Planner→Generator→Healerという決まった順番で進みます。対してSkillは、汎用の道具箱に手順書を1枚放り込んでおいて、後はClaudeが「あ、今回はこの手順が使えそうだ」と判断するのに任せる形です。決まった作業を毎回同じ手順でやってほしいならAgents、いろんな場面で自分の流儀を思い出してほしいならSkills、というイメージに近いと思います。
実際に公開されているPlaywright向けSkillを見てみる
ここは正直に書いておきたいのですが、Claude Code Skillsもこの手のPlaywright実装も動きが速い分野なので、以下はあくまで執筆時点（2026年8月）で私が確認できた内容です。
まずlackeyjb/playwright-skillというリポジトリがあります。README上の説明では「Claudeが自分の判断でこのSkillを読み込み、簡単なページ確認から複数ステップのフローまで、その場でPlaywrightのコードを書いて実行する」汎用の自動化Skillだそうです。決まったテストファイルを生成するというより、「今この場でブラウザ操作が必要になったらこの手順書を思い出してね」という、まさにSkillらしい立て付けに見えました。
もう1つ、neonwatty/qa-skillsはQAパイプライン向けのSkill集で、探索・複数ロールでのログイン・モバイル監査など6種類の専門エージェント構成を持つとのことでした。こちらはSkillという名前が付いていますが、中身は複数の役割を組み合わせたパイプラインに近く、AgentsとSkillsの線引きが実装によってかなり曖昧になっているのも実感しました。
TestDinoのブログ記事「Claude Code with Playwright」では、探索・テストケース生成・自動化・保守の4エージェントがファイル経由で結果を受け渡す構成が紹介されていて、ここでもコンテキストの一部としてapp.context.mdやPlaywright Skillを使っている、という記述がありました。SkillとAgentが排他的なものではなく、「Agentの中の1ステップでSkillを参照する」という組み合わせ方も普通に出てきているようです。
Playwright公式のplaywright-cli（公式ドキュメント）も、playwright-cli install --skillsでローカルにSkillをインストールし、コーディングエージェントがコマンド一覧を毎回大きなツール定義として読み込まずに済むようにする、という設計を取っています。トークン効率を重視するなら、こちらのようにSkillベースで運用する流れが公式でも進んでいるようでした。
「Skillsは何でも解決してくれる」わけではない
Medium記事「Can Claude Skills Replace Playwright Agents?」（Kailash Pathak氏）の見立てが分かりやすかったので紹介します。この記事によると、Claudeベースのワークフローは「決まった手順を実行して、終わってから結果を評価する」形なのに対して、Playwright Agentは「1つ1つの操作のたびにブラウザの状態を見て、次の一手を判断する」継続的な判断ループだそうです。つまりHealerが落ちたテストを直すのは、その場その場でページの状態を見ながら判断しているからこそできることで、これは決まった手順書（Skill）を毎回同じように読み込むのとは仕組みが違う、ということになります。
この整理は私の実感とも合っていました。Skillは「いつもの手順」を思い出させるのは得意ですが、想定外の崩れ方をしたページを見て「じゃあこう直そう」と柔軟に判断するのは、Healerのような専用のループ構造のほうが向いています。Skillsで全部を代替しようとすると、結局Skillの中に複雑な条件分岐を書き込む羽目になり、それなら最初からAgentsを使ったほうが早い、という場面は普通にあると思います（このあたりは私も全パターンを試したわけではないので、実際に崩れ方の激しいUIで両方試した方がいたらコメントで教えてください）。
結局、1年目エンジニアは何を入れればいいのか
ここまでの整理をふまえて、私なりの結論を書いておきます。
まずMCPは前提です。AIにブラウザを触らせたいなら、Playwright MCPは入れておく必要があります。ここは選択肢というより土台です。
次に、これから初めてE2Eテストの土台を作るなら、Test Agents（/playwright init-agents）から始めるのをおすすめします。Planner→Generator→Healerという決まったレールがあるので、何もない状態からテストコードとメンテナンスの仕組みまで一気に立ち上げられます。私も新規プロジェクトのテスト基盤を作るときはここから入ります。
その上で、「毎回同じような細かい手順を自分の言葉で説明し直している」と気付いたらSkillsの出番です。社内独自のログイン手順、特定のテストデータの作り方、いつも使うアサーションの書き方など、Test Agentsの標準パイプラインではカバーしきれない「自分のチーム固有のやり方」を覚えさせておく箱として使うと、繰り返し説明する手間が減ります。逆に言うと、標準的なテスト生成・修復で足りている段階でSkillsから手を出す必要はありません。順番としてはMCP→Agents→Skills、で困りごとが増えるたびに足していくのが遠回りに見えて一番早いと思います。
まとめ
MCPはブラウザを触るための口、Playwright Test Agentsはその上でPlaywright側が用意した探索・生成・修復の定型パイプライン、Claude Code Skillsは自分の手順をClaudeに覚えさせておく汎用の箱です。3つは競合するというより、下から積み上がっていく関係に近いと感じました。ただしSkillsまわりの仕様や呼び出し条件はこの記事を書いている今もかなりのペースで変わっているので、実際に導入する際は公式ドキュメントとリポジトリのREADMEを直接確認することをおすすめします。私も次に大きな仕様変更があったら、この記事をアップデートするつもりです。
コメント