テストで外部サービスを直接呼んでしまうエラー（supabaseUrl is required）

はじめに

React + TypeScript + Chakra UI + Supabase を使った「学習記録アプリ」を Jest でテストする際に、実際に詰まったエラーと解決方法をまとめます。

1. supabaseUrl is required.

状況:

外部サービス用のクライアント（Supabase, Firebase など）をテスト中に呼び出してしまい、.env がないためエラーになった。

原因:

Jest実行時に本物のクライアントが使われてしまった。モックが適用されていなかった。

解決方法:

src/mocks/supabase.ts を作成してモック化する。

export const supabase = {
  from: () => ({
    select: async () => ({ data: [], error: null }),
    insert: async () => ({ error: null }),
    delete: async () => ({ error: null }),
    update: async () => ({ error: null }),
  }),
};

さらに jest.config.js に moduleNameMapper を設定し、必ずモックが使われるようにする。

まとめ

Jest で外部サービスをテストするときは必ずモック化する。