テスト戦略：コードへの信頼を築く

テストはあなたのセーフティネットです。テストがあれば、自信を持ってリリースでき、恐れずにリファクタリングできます。

テストピラミッド

単体テスト（土台）

• 高速で独立している
• 個々の関数やコンポーネントをテストする
• 高いカバレッジ、低いコスト

結合テスト（中間）

• コンポーネント間の連携をテストする
• データベースクエリ
• APIエンドポイント

E2Eテスト（頂点）

• 完全なユーザーフローをテストする
• 低速だが包括的
• 重要なパスに注力する

何をテストするか

実装ではなく、振る舞いをテストする

❌ 悪い例：内部状態をテストする

expect(component.state.isOpen).toBe(true)

✅ 良い例：ユーザーに見える振る舞いをテストする

expect(screen.getByRole('dialog')).toBeVisible()

Reactコンポーネントのテスト

React Testing Library

ユーザーの操作に注目します。

test('submits form with user data', async () => {
  render(<SignupForm />)
  
  await userEvent.type(
    screen.getByLabelText(/email/i), 
    'test@example.com'
  )
  await userEvent.click(screen.getByRole('button'))
  
  expect(screen.getByText(/success/i)).toBeInTheDocument()
})

APIのテスト

エンドポイントを徹底的にテストしましょう。

• 正常系（ハッピーパス）
• エラーケース
• エッジケース
• 認証・認可

モックのベストプラクティス

• 自分のコードではなく、外部サービスをモックする
• 現実的なモックデータを使う
• モックを最新の状態に保つ

継続的インテグレーション

テストを自動的に実行しましょう。

• すべてのプルリクエストで
• デプロイの前に
• 低速なテストは夜間に

テストカバレッジ

意味のあるカバレッジを目指しましょう。

• 80%が良い目標
• 100%が常に現実的とは限らない
• 重要なパスに注力する

テストを省略してよいとき

省略しても構わない場合もあります。

• プロトタイプや技術検証（スパイク）
• 純粋なUIのスタイリング
• サードパーティライブラリのラッパー

まとめ

良いテストは開発を遅くするのではなく、速くします。テストスイートに投資しましょう。それはあなたの心の平穏への投資です。