如何模拟 axios 配置模块？

Question

我有一个配置 axios 的模块：

// config/axiosConfig.js

import axios from 'axios';

const instance = axios.create({

    baseURL: 'http://localhost:8080/api/v1'

});

export default instance;

以及一个使用它来进行 api 调用的模块：

// store/actions.ts

import axiosInstance from 'config/axiosConfig';

export const fetchUsers = () => (dispatch: ThunkDispatch<{}, {}, AnyAction>) => {

    dispatch(loading(true));

    return axiosInstance.get('/users')

        .then(res => {

            dispatch(loading(false));

            dispatch(fetched(res.data));

        })

        .catch(err => dispatch(error(true)));

}

...

我想模拟 axios 配置文件来测试我的 api 文件。我尝试了很多很多方法但没有任何效果。我以为这会很简单

// store/actions.test.ts

import axiosInstance from 'config/axiosConfig';

jest.mock('config/axiosConfig');

axiosConfig.get.mockResolvedValue({users: mockUserList});

...

但我想事情并不是这样的。

axiosConfig.get.mockResolvedValue({users: mockUserList});编辑：当我放入测试内部而不是放在模拟调用下时，我的问题中的方法有效。

Answer 1

尝试一下（将其放在文件顶部或内部顶部beforeAll或beforeEach取决于您的喜好）：jest.mock('config/axiosConfig', () => ({  async get(urlPath) {    return {      users: mockUserList,    };  },}));这是使用工厂函数的简单模拟。到处使用模拟jest提供了一种更好的方法来避免重复。您创建一个__mocks__目录，然后在其中创建模块，然后覆盖许多内置函数。然后，您只需使用以下代码即可摆脱困境。// file.test.tsjest.mock('fs')// Rest of your testing code below如果这不起作用，则 和 中的模块分辨率设置jest.config.js可能tsconfig.js会有所不同。