Jestで同一ファイル内で異なる振る舞いのモックを使用したい場合(axios)


初めに

メモ書きようです。
ざっくりと書いていますのでご了承ください。

同一ファイル内で異なる振る舞いのモックを使用したい場合

例えば以下のようなAPIがあったとします。

test.ts
async hoge(): Promise<Hoge> {
    const res = await $axios.$get('/hoge');
}

async fuga(): Promise<Fuga> {
    const res = await $axios.$get('/fuga');
}

異なる振る舞いのモックを作成する場合は以下のように書けます。

test.spec.ts
import { $axios } from '@/store/utils/api.ts';

jest.mock('@/store/utils/api.ts', () => ({
  $axios: {
    $get: jest.fn(),
  }
}));

describe('Test', () => {
  test('hoge', async () => {
    ($axios.$get as jest.Mock).mockImplementation(() =>
      Promise.resolve({
        ~
    }));
  });
  await hoge()
});

describe('Test', () => {
  test('fuga', async () => {
    ($axios.$get as jest.Mock).mockImplementation(() =>
      Promise.resolve({
        ~
    }));
  });
  await fuga()
});