🌐

他システム連携ありのE2EテストをPlaywright Agentsで自動化してみた

に公開

1. はじめに

本記事では、弊社で実施したPlaywright Agents を用いた E2E テスト自動化の PoCについて紹介します。
筆者はこれまであまり技術記事を書いた経験がなく、今回は書き物の練習も兼ねたアウトプットになります。

題材としては以下となります。

  • 自社プロダクト
  • 他システム(外部ベンダの基幹システム)と連携
  • 手動テストの工数削減を目的とした E2E テスト自動化

想定読者

  • E2Eテストの導入・改善を検討している人
  • Playwright / Playwright Agents に興味がある人
  • 他システム連携を含むテスト自動化で詰まっている人

ゴール

  • 他システムを含めた E2E テスト自動化で注意すべき観点が分かること

2. 前提知識・環境

E2Eテスト

  • ユーザー操作を起点に、システム全体の動作を検証するテスト
  • 画面表示・API連携・状態遷移などをまとめて確認できる
  • 単体テスト/結合テストよりも
    👉 「実際に使えるか?」 を保証する位置づけ

Playwright Agents

  • Playwright を使って ブラウザ操作を自動化するエージェント
  • 人間に近い操作(クリック・入力・遷移)を、コード生成込みで実行できる
  • E2Eテストの 自動生成・修復 を目的とした構成を持つ

主な構成要素

  • Planner
    • テストの目的から 実行ステップを計画 する
    • 例:「ログイン → 一覧表示 → 詳細画面遷移」などの流れを定義
  • Generator
    • Planner の計画をもとに Playwright のテストコードを生成
    • セレクタ選択や操作内容を自動で組み立てる
  • Healer
    • テスト失敗時に DOM差分やセレクタ変更を検知して修復
    • UI変更に強い E2E テストを実現するための重要な要素

3. 課題・背景

背景

弊社ではアジャイル開発を採用しており、デプロイ頻度が高い一方で、

  • 自社プロダクトであるため、手動テストに十分な工数を割けない
    という状況がありました。

そのため、
運用しながら改善していくスタイル が基本となっており、メジャーアップデート時にのみテスト専門家を入れて、まとまったメンテナンスを行っていました。

このとき、

  • 専門家の視点で作成した E2E テストシナリオ
  • それを自動で実行できる仕組み
    を用意できれば、デプロイ時に不具合を継続的に検知できるのではないか と考えたのがきっかけです。

本検証の概要

  • テスト専門家が作成したテストシナリオをもとに
  • Playwright Agents で E2E テストを自動実行
  • 実運用を想定し、他システム連携を含めたテストとする

4. 解決アプローチ

方針

今回は PoC を兼ねていたため、正常系のみの最小限の観点に絞ることで、実装負荷を抑えました。

また、検証ポイントとして以下を含めました。

  • 自社システムの 複数アカウントを横断した操作
  • 他システム(大手ベンダー製基幹システム)との連携操作

全体の流れ

  1. テストケースの洗い出し
    (実際に画面を操作するイメージで列挙。今回は約22ステップ)
  2. テストシナリオ作成
    (第三者が単純作業として実行できる粒度まで分解)
  3. Planner でテスト仕様書を生成
  4. Generator でテストコードを生成
  5. 認証情報などを追加し、実行・修正を繰り返す
    (必要に応じて Healer を活用)
  6. 最後まで通ることを確認して完了

5. 結果と詰まりどころ

1ヶ月半かけて、最終的に一連のテストが安定して実行できることを確認できました。
以下、特に詰まったポイントを紹介します。

自社システム起因:同一名称が使い回せない

  • テスト実行ごとにデータが残るため、同名が使えない
  • タイムスタンプを利用して一意な名称を生成
  • 最初に生成したタイムスタンプをテスト全体で使い回すことで整合性を担保

他システム起因:データ反映遅延によるタイムアウト

  • 他システム側の処理が遅く、頻繁にタイムアウト
  • 試した対策:
    • リトライ処理(3〜5回再実行)
    • 待機時間延長(操作間隔・全体タイムアウトを大幅に延長)
      👉 今回は 待機時間延長 が比較的安定しました
      (全体タイムアウトを 20 分に設定するなど、かなり割り切った対応)

他システム起因:通信障害によるデータ送受信の失敗

  • 正直どうしようもないのでリトライ処理 + 全体再実行で割り切って対応

6. まとめ

今回は Playwright Agents を用いて、他システム連携を含む E2E テスト自動化 に挑戦しました。
紆余曲折ありましたが、無事に完走できてよかったです。

併せて行った運用改善

  • テスト終了後にデータを削除するスクリプトの整備
  • GitHub Actions での自動実行
  • Playwright Report を Google Drive に自動転送
  • GitHub Artifacts の自動削除

今後

  • 全機能を対象とした E2E テスト
  • 異常系を含めたリグレッションテストの自動化
    を進めていく予定です。

拙い文章で恐縮ですが、最後まで読んでいただき誠にありがとうございました!

dotD Tech Blog

Discussion