Javascript 我如何开玩笑地测试axios？

我的反应是：

export function fetchPosts() {
    const request = axios.get(`${WORDPRESS_URL}`);
    return {
        type: FETCH_POSTS,
        payload: request
    }
}

在这种情况下如何进行测试

Jest在他们的站点上为异步代码提供了这样一个用例，其中他们使用了一个模拟函数，但是我可以用Axios来实现吗

参考：

到目前为止，我这样做是为了测试它是否返回正确的类型：

it('should dispatch actions with the correct type', () => {
    store.dispatch(fetchPosts());
    let action = store.getActions();
    expect(action[0].type).toBe(FETCH_POSTS);
});

如何传入模拟数据并测试其返回结果？

。 在这种情况下，服务在./chatbot中描述。 在模拟适配器中，指定使用API端点时返回的内容

import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import chatbot from './chatbot';

describe('Chatbot', () => {
    it('returns data when sendMessage is called', done => {
        var mock = new MockAdapter(axios);
        const data = { response: true };
        mock.onGet('https://us-central1-hutoma-backend.cloudfunctions.net/chat').reply(200, data);

        chatbot.sendMessage(0, 'any').then(response => {
            expect(response).toEqual(data);
            done();
        });
    });
});

您可以在这里看到整个示例：

服务：

测试：

我是这样做的：

import nock from 'nock'
import axios from 'axios'
import httpAdapter from 'axios/lib/adapters/http'

axios.defaults.adapter = httpAdapter

describe('foo', () => {
    it('bar', () => {
        nock('https://example.com:443')
            .get('/example')
            .reply(200, 'some payload')

        // test...
    })
})

---

我可以按照以下步骤进行：

创建一个文件夹\uuuuu mocks\uuuu/（正如@Januartha comment所指出的）

实现一个

axios.js

mock文件

在测试中使用我的已实现模块

模拟将自动进行

模拟模块的示例：

module.exports = {
    get: jest.fn((url) => {
        if (url === '/something') {
            return Promise.resolve({
                data: 'data'
            });
        }
    }),
    post: jest.fn((url) => {
        if (url === '/something') {
            return Promise.resolve({
                data: 'data'
            });
        }
        if (url === '/something2') {
            return Promise.resolve({
                data: 'data2'
            });
        }
    }),
    create: jest.fn(function () {
        return this;
    })
};

---

对于那些希望使用axios mock adapter代替文档中的mockfetch示例的人，我成功地使用了以下内容：

文件actions.test.js： 要测试文件actions/index.js中的

signInUser

的成功案例：

鉴于这是通过jest完成的，因此必须模拟localstorage调用。这在文件src/setupTests.js中：

---

不使用任何其他库：

import * as axios from "axios";

// Mock out all top level functions, such as get, put, delete and post:
jest.mock("axios");

// ...

test("good response", () => {
  axios.get.mockImplementation(() => Promise.resolve({ data: {...} }));
  // ...
});

test("bad response", () => {
  axios.get.mockImplementation(() => Promise.reject({ ... }));
  // ...
});

可以指定响应代码：

axios.get.mockImplementation(() => Promise.resolve({ status: 200, data: {...} }));

可以根据以下参数更改模拟：

axios.get.mockImplementation((url) => {
    if (url === 'www.example.com') {
        return Promise.resolve({ data: {...} });
    } else {
        //...
    }
});

Jest v23引入了一些语法糖来模拟承诺：

axios.get.mockImplementation(() => Promise.resolve({ data: {...} }));

它可以简化为

axios.get.mockResolvedValue({ data: {...} });

被拒绝的承诺还有一个等价物：

mockRejectedValue

进一步阅读：

• 解释

  jest.mock（“axios”）

  行的范围的
• 它解决了将上述技术应用于Axios请求拦截器的问题

---

我确实尝试过这一点，但我觉得axios与nock的配合不太好。但是谢谢你的帮助没有lessnock是在testsHow中处理http调用的最佳方法你使用了localStorageMock@Kermit_ice_tea

src/setupTests.js

作为jest/酶测试的全局设置记录在create react应用程序中。在该文件中，我创建了一个对象，我使用伪函数（getItem、setItem）任意调用该对象。神奇之处在于我将

global.localStorage

设置为该对象的底部。我可以在一行中完成这项工作，而不是将对象命名为localStorageMock。整个设置的目的只是为了避免任何处理本地存储的代码在测试期间被破坏。Hi@shorif2000我在这里实现了它，在模拟中编写手动模拟并不是一个好的实践，就像在Januartha中编写手动模拟一样抱歉，我的输入错误。我要在这里纠正它。我在回复上打了一个“\uuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu。Sorry@AmadeuCavalcanteFilho啊，当然，没问题：）如果我不想嘲笑axios，而是想让它提出一个真正的要求，那怎么办？哈哈哈，那就别嘲笑了

axios.get.mockImplementation((url) => {
    if (url === 'www.example.com') {
        return Promise.resolve({ data: {...} });
    } else {
        //...
    }
});

axios.get.mockImplementation(() => Promise.resolve({ data: {...} }));

axios.get.mockResolvedValue({ data: {...} });