如何模拟 axios.create([config]) 函数以返回其实例方法，而不是用模拟覆盖它们？答案

【问题标题】：How to mock axios.create([config]) function to return its instance methods instead of overriding them with mock?如何模拟 axios.create([config]) 函数以返回其实例方法，而不是用模拟覆盖它们？
【发布时间】：2020-06-11 04:41:12
【问题描述】：

我正在尝试模拟 axios.create() 因为我在整个应用程序中使用它的实例并且显然需要它的所有实现被模拟破坏，因此无法获得结果正确的get、post方法。

这是代码在实际文件中的样子：

 export const axiosInstance = axios.create({
        headers: {
           ...headers
        },
        transformRequest: [
            function (data, headers) {
                return data;
            },
        ],
    });
    const response = await axiosInstance.get(endpoint);

这是测试文件中 axios 的模拟设置

   jest.mock('axios', () => {
        return {
            create: jest.fn(),
            get: jest.fn(() => Promise.resolve()),
        };
    }
);

我怎样才能获得 axiosInstance 变量中的所有实例方法，而不是仅仅拥有一个什么都不做的模拟函数？

axios.create 和实例方法的文档：https://github.com/axios/axios#instance-methods

【问题讨论】：

大概在其余代码中您只是导入并使用 axiosInstance，那么为什么不模拟 that 而不是 Axios 本身呢？或者，如果您要模拟创建，您的测试替身应该做它所替换的事情，将 get 模拟移动到创建模拟返回的对象中。
好的，建议不要完全模拟 axiosInstance，而是将 axios.get 模拟返回给 axios.create，但这又让我没有其他 XHR 方法
那确实完全模拟 axiosInstance，因为它是 create 的返回；您需要更仔细地考虑要替换的内容。是的，您需要将您使用的其他方法添加到替换中。但是同样，如果这个模拟是为了测试 rest 如果你的代码实例来自 Axios.create 的事实是你可以隐藏的实现细节。
@jonrsharpe 你能举个例子作为答案吗
@jonrsharpe 也是第一种方法，如果我模拟整个导入，我再次需要传递实例方法的整个对象，这会导致我得到同样的结果..

标签： javascript unit-testing jestjs axios react-testing-library

【解决方案1】：

您可以使用 jest 的genMockFromModule。它将为每个模块的方法生成jest.fn()，您将能够在create 上使用.mockReturnThis() 来返回相同的实例。

示例：

./src/__mocks__/axios.js

const axios = jest.genMockFromModule('axios');

axios.create.mockReturnThis();

export default axios;

working example

编辑：

从 Jest 26.0.0+ 重命名为 jest.createMockFromModule

【讨论】：

除了 tnx 的努力之外，我没有太多帮助，我在代码中还有其他一些奇怪的事情，所以它不是那么简单，尽管 +1
你能检查一下这个stackoverflow.com/questions/64961204/…
.genMockFromModule() 自 jest 26.0.0+ 起已弃用，您应该改用 jest.createMockFromModule(moduleName)。

【解决方案2】：

最终坚持使用 axios 模拟，并通过将 axiosInstance 指针分配给创建的 axios 模拟来指向该模拟。基本上就像 @jonrsharpe 建议的那样

简单地说：

import * as m from 'route';
jest.mock('axios', () => {
        return {
            create: jest.fn(),
            get: jest.fn(() => Promise.resolve()),
        };
    }
);
m.axInstance = axios

如果没有它，我会很高兴。

【讨论】：

【解决方案3】：

以下代码有效！

jest.mock("axios", () => {
    return {
        create: jest.fn(() => axios),
        post: jest.fn(() => Promise.resolve()),
    };
});

【讨论】：