📝

[jest, msw] apiが何回呼ばれたかをテストしたい

2024/02/03に公開

Jest

MSW

tech

教えてもらったので覚書き。

まとめ

マーカーとなるjestのmock関数を定義する
mswでapiをcallしているところに仕込む
jestのmock関数が何回呼ばれたかを確認する
最後に：お片付け

具体的なやりかた

1. マーカーとなるjestのmock関数を定義する

const hogeMock = jest.fn()

jest.fn() がモック関数と呼ばれるもの。
モック関数は、呼ばれた回数を記録しているらしい。
今回はマーカーとして使うだけなので、引数（括弧の中）には何も入れません。

2. mswでapiをcallしているところに仕込む

apiの呼び出しは、mswを使っています。
mswのserver.use()の中に、先ほど定義したmockを仕込みます。
apiレスポンスの直前に入れました。

server.use(
    rest.get(
      `/ja/api/hoge/${id}`,
      (_, res, ctx) => {
        hogeMock();
        return res(
          ctx.status(200),
          ctx.json({
            name: 'XXXX',
          }),
        );
      },
    ),
  );

3. jestのmock関数が何回呼ばれたかを確認する

テストの期待値を確認するところで、toHaveBeenCalledTimes　というマッチャーを使います。

expect(hogeMock).toHaveBeenCalledTimes(1);

4. 最後に：お片付け

モックが他のテストで意図しない動きをしないよう、リセットします。

hogeMock.mockClear();

afterEachフックの中に書きました。

おまけ

同じことを書かれている方がいました（ソースはこちらの方の記事かもしれません）。