E2Eテストって何?

E2E(End to End)テストとは、アプリケーション全体を通して、実際のユーザーの操作を再現するテストのことです。

例えば、ECサイトであれば「商品を検索 → カートに入れる → 購入手続き → 注文完了」という一連の流れを、実際にブラウザを操作してテストします。

なぜE2Eテストが必要なの?

単体テスト(ユニットテスト)では各機能が個別に正しく動くことを確認できますが、それらを組み合わせたときに問題が起きないかは分かりません。

E2Eテストでは、システム全体が連携して正しく動作するかを確認できます。

具体例

例えば、以下のような問題を発見できます。

ログイン機能は動くが、ログイン後に画面遷移できない
データベースへの保存は成功するが、画面に反映されない
APIのレスポンスは正しいが、フロントエンドで表示が崩れる

E2Eテストの流れ

テストシナリオの作成: ユーザーがどう操作するかを決める
自動化ツールの設定: Playwright、Selenium、Cypressなどを使用
テストコードの作成: 実際の操作をコードで記述
テストの実行: ブラウザが自動で動いて確認
結果の確認: 成功・失敗を確認して修正

主なE2Eテストツール

ツール	特徴
Playwright	モダンで高速、複数ブラウザ対応
Cypress	開発者フレンドリーで使いやすい
Selenium	歴史が長く、対応言語が豊富

簡単なコード例(Playwright)

e2e.test.js

import { test, expect } from '@playwright/test';

test('ログインテスト', async ({ page }) => {
  // ログインページにアクセス
  await page.goto('https://example.com/login');
  
  // メールアドレスを入力
  await page.fill('input[name="email"]', 'test@example.com');
  
  // パスワードを入力
  await page.fill('input[name="password"]', 'password123');
  
  // ログインボタンをクリック
  await page.click('button[type="submit"]');
  
  // ダッシュボードに遷移することを確認
  await expect(page).toHaveURL('https://example.com/dashboard');
  
  // ユーザー名が表示されることを確認
  await expect(page.locator('.user-name')).toHaveText('テストユーザー');
});

E2Eテストのメリット・デメリット

メリット

ユーザー視点での動作確認ができる
システム全体の統合を確認できる
リグレッションを防げる

リグレッション: 既存の機能が新しい変更によって壊れてしまうこと

デメリット

実行時間が長い
メンテナンスコストが高い
環境構築が複雑になりがち

まとめ

E2Eテストは、実際のユーザー操作をシミュレートして、システム全体が正しく動作するかを確認するテストです。

開発の最終段階で品質を保証する重要な役割を果たしますが、実行時間やメンテナンスコストを考慮して、適切な範囲でテストを作成することが大切です。