【Playwright MCP】Codex CLI の Webアプリ・デザインテストを自動化!AI 駆動の E2Eテスト実践ガイド 公開日: 2025年9月24日 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Codex CLI と Playwrihgt MCPでE2Eテスト(ブラウザ操作レベルのテスト)を完全自動化する方法をお伝えします! Playwrightを使って、ユーザー操作レベルのテストをAIと対話しながら実装していきましょう。 この内容を学べば、手動で動作確認する手間が減り、手間もバグも一気に削減できるようになります! ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 💡 この動画で学べること ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Playwright MCPの設定方法 スクリーンショットの自動撮影 ブラウザの自動操作テクニック フォーム入力・送信の自動化 レスポンシブ対応の確認方法 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 📌 関連動画 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ ・【Playwright入門】Claude Code × MCPでブラウザテストを完全自動化!AI 駆動の E2Eテスト実践ガイド https://www.youtube.com/watch?v=TDECUH62yYQ ・【Codex CLI対応】仕様駆動開発を1コマンドで導入!Spec Driven Codexで要件定義→設計→実装まで完全自動化 https://www.youtube.com/watch?v=1EQllS_3TJo ・【Codex CLI活用術】MCPサーバを設定する方法!config.toml と CLI コマンドの使い方を初心者向けに解説 https://www.youtube.com/watch?v=1TJydjQM6eo ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🚀 体系的に Codex CLI を学んで一歩先へ! ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Udemy の Codex CLI 実践マスター講座では、さらに高度な内容を体系的に学べます。 ・MCP連携で外部ツールを自在に操る ・Playwright・Supabase操作も自動化 ・Next.js × Supabaseで本格アプリ開発 ・AGENTS.mdを活用した高度な開発手法 ・実践的なアプリ開発の全工程 🎁 限定クーポンで最大90%OFF! https://www.vibecodingstudio.dev/coupons?topic=codex ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🔗 SNS・コミュニティ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🐦 X(Twitter) https://x.com/muscle_coding 📝 note https://note.com/tomada 💻 Qiita https://qiita.com/tomada 📘 Zenn https://zenn.dev/tmasuyama1114 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 💬 Discordコミュニティ(無料) ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 最新情報をキャッチアップしつつ、AI駆動開発を学ぶ仲間と繋がれるDiscordコミュニティも運営してます!気軽に参加してみてください。 Discordに参加する https://discord.gg/qZDRagzbVD ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ ⏰ タイムスタンプ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 00:00 はじめに 00:32 Playwright MCPを設定 02:31 スクショを撮影 07:41 ブラウザを自動操作する方法 09:44 フォーム入力・送信を自動化する方法 12:08 レスポンシブ対応の確認も自動化 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 💬 コメント・質問お待ちしています! ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 実際に試してみた感想や、つまずいた点があればコメント欄で教えてください。 可能な限りお答えします! チャンネル登録・高評価いただけると今後の動画作成の励みになります🙏 #codexcli #codex #MCP #Playwright #E2Eテスト #テスト自動化 #AI駆動開発 #VibeCoding #バイブコーディング #プログラミング #Webアプリ開発 #自動テスト #ModelContextProtocol
この内容はYouTube概要欄へのコピー用プレーンテキストです
