はじめに UIテストを書くとき、 「セレクタを探す → 失敗する → ブラウザを見直す」 という往復に時間を取られていませんか? 本記事では、Claude Code と Playwright MCP を組み合わせて、 実際のブラウザ操作を確認しながら対話的にUIテストを構築する方法を紹介します。 テストコードをあとから書くのではなく、 確認作業そのものをテスト生成につなげる のがこの方法の良いところです。 本記事は、Claude CodeとPlaywrightを利用したことがある方向けに書いています。 各サービスについて詳しく知りたい方は、こちらをご覧ください。 Claude CodeとPlaywrightの参考ブログ 動画で動きを紹介 モバイル表示時のハンバーガーメニューのテストを対話的に作成している例です。 こんなことができます。 生成したテストコードの詳細 この記事で作成したテストコ

