web-dev-qa-db-ja.com

jest.mock（ 'Axios'）を使うときに迎撃器をモックする方法？

JESTを使用してテストを実行するとき、基本テストスーツの構文があります。

_jest.mock('axios');

describe('app', () => {
    let render

    beforeEach(() => {
        axiosMock.get.mockResolvedValueOnce({
            data: {greeting: 'hello there'},
        }),
        render= renderApp()
    });

    test('should render something', () => {
        expect(something).toBeInTheDocument();
    });


});
_

問題は、JESTコマンド出力でテストを実行するときにコードに迎撃を行っています。

TypeError：未定義のプロパティ 'Interceptors'を読み取ることはできません

そしてインターセプターオブジェクトを指す

_axiosInstance.interceptors.request.use(..._

axiosInstance _axios.create_の戻りを保存する変数です。

_export const axiosInstance = axios.create({..._

SO のこのAXIOSスレッドを参照して、JEST でAXIOSをテストする方法はありません。

reactjsjestjsaxiosreact-testing-library
4
Eugen Sunic

これは最後、平らで単純なjest.fn()

jest.mock('axios', () => {
    return {
        interceptors: {
            request: { use: jest.fn(), eject: jest.fn() },
            response: { use: jest.fn(), eject: jest.fn() },
        },
    };
});
 _
8
Eugen Sunic

使用されている場合は、インターセプターと_axios.create_を必ずモックアウトしてください。

_// Replace any instances with the mocked instance (a new mock could be used here instead):
axios.create.mockImplementation((config) => axios);

// Mock out the interceptor (assuming there is only one):
let requestCallback = () => {
  console.log("There were no interceptors");
};
axios.interceptors.request.use.mockImplementation((callback) => {
  requestCallback = callback;
});

// Mock out the get request so that it returns the mocked data but also calls the 
// interceptor code:
axios.get.mockImplementation(() => {
  requestCallback();
  return {
    data: "this is some data"
  };
});
_

注これが機能しない場合：

この例では、作成コールとインターセプターコールがJESTがそれらを損なっている場所にあると想定しています。 _axios.create_または_axiosInstance.interceptors.request.use_線を関数の範囲外に配置すると、上記のモッキングが失敗する可能性があります。これは、JESTがそれらを解除できる例のファイルです。

_const axios = require('axios');

const DEBUG = true;

const customRequest = (url) => {
  // Example of axios.create from https://www.npmjs.com/package/axios#axioscreateconfig
  const axiosInstance = axios.create({
    baseURL: 'https://some-domain.com/api/',
    timeout: 1000,
    headers: {'X-Custom-Header': 'foobar'}
  });

  // Example of interceptor taken from https://stackoverflow.com/a/52737325/7470360:
  axiosInstance.interceptors.request.use((config) => {
    if (DEBUG) { console.info("Request called", config); }
    return config;
  }, (error) => {
    if (DEBUG) { console.error("Request error ", error); }
    return Promise.reject(error);
  });

  return axiosInstance.get(url);
}

module.exports = customRequest;
_

モッキングコードは、_axios.create_呼び出しとaxiosInstancecustomRequest呼び出しを解除します。関数外の作成または傍受のどちらかを移動すると、モックが失敗するようになります。

4
A Jar of Clay