fetch-mockを使ったテスト

2663 ワード
test mocha test テキストリンク

mochaにおけるテストでfetch-mockを使ったのでメモしておく。
フロントエンドで、fetch APIを使ってリクエストを行う部分のテストをする際にリクエストをmockするのにfetch-mockを利用した。

mockとは

mockとは、テスト対象クラスが呼び出しているクラスを置き換えるためのテスト用オブジェクトのこと。mockでテスト対象クラスが呼び出しているクラスを置き換え、mockの動作を指定することで意図したテスト条件を作ることができる。

fetch-mockを使ったテスト

fetch-mockを使ったテストの内、GETリクエストのテストの場合をメモしておく。

テストコード例
import fetchMock from "fetch-mock";

describe("APIのテスト", () => {

    afterEach(() => {
        // fetchMockをリセット
        fetchMock.restore();
    });

    it("GETメソッドをmock", async () => {
        // fetch-mockを設定
        fetchMock.get(<リクエストURL>, {
            <レスポンスの内容>
            // 例
            //status: 200,
        });
        const result = <テスト対象メッソド>
    });
});

上記のように、fetchMock.get()の第1引数にURLを指定し、リクエストのURLと一致した場合mockされる。第2引数はレスポンスを指定する。