前回の続き——つなぎ目の外側、利用者の経路へ
前回のP-05では、部品と部品のつなぎ目を確かめる結合テストを学びました。単体テストが部品の中身、結合テストが配線の確認だった、という整理でした。今回はさらに外側へ出ます。利用者が実際に画面を操作する経路を、端から端まで通して確かめるE2Eテストです。バイブコーディングでは、テストがAIの出力の検収装置になります。E2Eは、その検収を最も本番に近い形で行う一段だと考えてください。
このスライドのポイント
- P-05: つなぎ目を確かめる結合テスト
- 単体＝部品の中身／結合＝配線／今回＝利用者の経路の全体
- テストはAIの出力の検収装置。E2Eは最も本番に近い検収
E2Eテストとは
E2EはEnd to End、つまり端から端までという意味です。E2Eテストとは、ブラウザを自動で操作し、利用者の操作経路、H-03で見た画面遷移をそのまま通して、システム全体を確認するテストのことです。単体テストや結合テストと違い、本物に近い形で最初から最後まで動かします。そのぶん最も本番に近い一方で、最も重く、遅く、壊れやすいという弱点があります。だからこそ、申請して承認されるまで、といった主要動線を数本に絞って作るのが定石になります。
このスライドのポイント
- E2E＝End to End（端から端まで）
- 定義: ブラウザを自動操作し、利用者の操作経路（H-03の画面遷移）をそのまま通して全体を確認するテスト
- 最も本番に近い／最も重い（遅い・壊れやすい）
- だから主要動線（申請して承認されるまで、等）数本に絞るのが定石
なぜ必要か——多すぎても少なすぎても困る
この加減を知らないと、二つの失敗が起きます。一つは、何もかもをE2Eで確かめようとして、遅くて壊れやすいテストの山を作ってしまうことです。AIに頼めば際限なく生成できるので、なおさら増えがちです。もう一つは逆に、E2Eをまったく作らないことです。単体も結合も通っているのに、全部つないだ本番の形を、誰一人として通していない、という状態になります。多すぎても少なすぎても困る、その間合いを取ることが、この講義の狙いです。
このスライドのポイント
- 失敗1: 何もかもE2Eで確かめ、遅く壊れやすいテストの山を作る（AIは際限なく生成できる）
- 失敗2: E2Eゼロで、全部つないだ本番の形を誰も通していない
- 狙い: その間合いを取る
構造——テストピラミッド
3階層の関係は、テストピラミッドという形で整理できます。下から順に、単体テストが多数で速い土台、結合テストが要所を押さえる中段、E2Eテストが少数で主要動線だけを通す頂上です。上に行くほど本番に近づきますが、同時に重く遅くなります。この近さと重さは引き換えの関係、N-10で見たトレードオフです。ですから、土台を厚く、頂上を薄くするのが、安定した形になります。
このスライドのポイント
- テストピラミッド: 下から単体（多数・速い）／結合（要所）／E2E（少数・主要動線のみ）
- 上に行くほど本番に近いが重い＝N-10で見たトレードオフ
- 土台を厚く、頂上を薄くするのが安定した形
具体例——経費アプリのE2Eは2本だけ
経費アプリで考えてみます。E2Eは、あえて2本だけに絞ります。1本目は、申請すると一覧に出て、承認されるまでの正常な流れです。2本目は、不正な入力をすると、H-07で学んだエラー表示が出る流れです。この2本が通れば、商売の背骨にあたる動きは生きている、と判断できます。すべての画面や条件をE2Eで網羅するのではなく、これが通らなければ事業が止まる、という動線を選ぶ。この選び方が、E2E設計の勘所です。
このスライドのポイント
- E2Eは2本に絞る例
- 1本目: 申請→一覧に出る→承認される（正常な背骨）
- 2本目: 不正入力→エラー表示（H-07）
- 選び方: これが通らなければ事業が止まる動線を選ぶ
技術サンプルカード
サンプルは、テストピラミッドに本数の目安を書き込んだ図です。経費アプリの例では、単体テストがおよそ30本、結合テストが8本、E2Eが2本という配分になります。この数字はあくまで目安で、アプリの規模で変わります。読み取ってほしいのは、下ほど本数が多く、上ほど絞られている、という形そのものです。AIには、このアプリでこれが通れば背骨は無事、という主要動線を2、3本選び、E2Eの手順として書いてください、と頼むとよいでしょう。
混同しやすい概念——E2Eと手動の通し確認
E2Eテストと、手作業での通し確認は混同しがちです。H章で学んだ目視の確認は、初めて作ったときや、見た目を確かめるのに向いていますが、一回きりです。E2Eテストは、同じ経路を自動で何度でも繰り返せます。目視は初回と見た目の担当、E2Eは繰り返しの守りの担当、と役割を分けて考えてください。手で通したから大丈夫、はその場限りの確認にすぎず、変更のたびに守ってくれるのは、E2Eのほうです。
バイブコーディングでの確認点
実務で効く確認点を一つお伝えします。E2Eを増やしたくなったら、まずその確認は下の階層、単体や結合でカバーできないかを問い直してください。細かい条件の網羅は、速くて安定した単体テストの得意分野です。それをE2Eでやろうとすると、ピラミッドを逆さに立てることになり、遅くて壊れやすいテスト群に足を取られます。E2Eはあくまで主要動線の最終確認、と用途を守るのが、長続きのコツです。
このスライドのポイント
- E2Eを増やしたくなったら、まず下の階層（単体・結合）でカバーできないか問う
- 細かい条件の網羅は、速くて安定した単体テストの得意分野
- ピラミッドを逆立ちさせない
- 質問例:「この確認は単体テストで代替できませんか。E2Eにすべき理由はありますか」
まとめと次回
一問一答です。E2Eテストを絞り込む基準は何でしょうか。（間）。答えは、主要動線です。これが通れば背骨は無事、と言える数本を選ぶのでした。30秒でまとめます。E2Eは、利用者の操作経路を丸ごと通す、最も本番に近いテストで、重いぶん少数の主要動線に絞る。土台は単体、要所は結合、頂上はE2E、というピラミッドの形を守る。次回のP-07では、直したあとに以前の機能が壊れていないかを確かめる、回帰テストへ進みます。関連資料は「テスト観点プロンプト50」「画面設計チェックリスト100」です。
このスライドのポイント
- 一問一答:「E2Eテストを絞り込む基準は？」→ 主要動線（これが通れば背骨は無事、の数本）
- 30秒まとめ: E2Eは最も本番に近く重い。少数の主要動線に絞る。土台=単体・要所=結合・頂上=E2E
- 次回: P-07 回帰テスト（直したあと、以前の機能が壊れていないか）
- 関連資料: 「テスト観点プロンプト50」「画面設計チェックリスト100」
