概要 こんにちは、booostのバックエンドエンジニアのma_meです。 今回はこちらの記事から着想を得て、個人開発で AI、DevTools Recorder、playwright-cli の３ツールを組み合わせてe2eテストを書いてみたところ、作成とメンテナンスが楽になる手応えを感じましたので、その方法を紹介します。 全体の流れ ① ブラウザで操作を録画（Chrome DevTools Recorder） ↓ ② 録画JSONをCodexないしClaude Codeに渡す ↓ ③ AIがJSONを読み取り、Playwrightテストコードに変換 ↓ ④ 必要に応じてplaywright-cliで画面のスナップショットを取り、セレクタを補正させる ↓ ⑤ テストファイルが完成 では実際にやっていきましょう。 Step 1: ブラウザ操作を録画する Chrome DevToolsの「Rec