Playwright MCPを使ってE2Eテストを楽に書く

ナレッジワークでは、お客様に安定したサービスを提供するため、E2Eテストを活用した品質保証に取り組んでいます。ただし、E2Eテストの開発・保守には多くの時間と労力が必要で、正直なところ手間だと感じる場面も少なくありません。本記事では、そうした課題を Playwright MCP を活用して解消した取り組みをご紹介します。 ※ Playwright MCP は Playwright をAIエージェントなどから実行し、ブラウザ操作を行えるようにする MCP（Model Context Provider）です 課題 主に次の3点に課題がありました。 ロケーターの記述に手間がかかる テストケースの記述に手間がかかる テストのデバッグに時間がかかる それぞれ具体的に説明します。 ロケーターの記述に手間がかかる E2Eテストでは、ページ上で行いたい操作に必要なボタンやインプットなどのロケーター（セレク

[takafumiat]

MCP使わなくてもそれを実現する手段はあるのだが、playwright codegen使えば良いだけじゃないの？プロンプト考えたりMCP経由でplaywrightを実行するだけ時間の無駄だと思った。

[manaten]

“Accessibility tree”

[misshiki]

“E2Eテストは、実際のプロダクトにアクセスしてブラウザを操作して実行する特性上、実行時間が長くなりがちです。...今回、これらのE2Eテストにまつわる課題を Playwright MCP の活用によって解消しました。”

[naka-06_18]

ここらへんどこでテストコードを管理するか、どう起動するかがバリエーションある／LLMからplaywright-mcp呼ぶラインは固まっていると思う

[nemoba]

POMで保守性を担保しながら、POMで人とAIの分解点になってるのが良いね。モデル繋がりでオブジェクト指向の開発とかにも活かせる気配を感じる

[diabah_blue]

E2Eテストを完全に任せるのは不確実性が上がってよくないと感じていたけれど、この方法なら実務でも使えそう。

[hiroomi]

"お客様に安定したサービスを提供するため、E2Eテストを活用した品質保証に取り組んでいます。"