乐闻世界logo
搜索文章和话题

Jest 如何 mock Axios 请求?

7 个月前提问
5 个月前修改
浏览次数63

1个答案

1

当在使用Jest进行单元测试时,Mock Axios请求是一个常见的需求,因为我们通常不希望在测试中执行真实的HTTP请求。Mocking可以帮助我们模拟请求的响应数据,并确保我们的测试在没有网络连接的情况下也能够运行。以下是如何在Jest中mock Axios请求的步骤:

  1. 安装Mocking库(可选):虽然Jest内置了一些mocking功能,但是我们可以使用像jest-mock-axios之类的库来简化流程。

  2. 创建Mock:在测试文件中,我们可以调用jest.mock('axios')来自动mock整个axios模块。这会使得所有的axios调用都被Jest所拦截。

  3. 编写Mock实现:接下来,我们可以提供一个mock实现,这样当我们的代码尝试发送一个HTTP请求时,它将返回我们提供的数据。

  4. 执行测试:在测试中,我们会检查代码是否正确处理了mock的响应。

  5. 验证Mock被正确调用:最后,我们可以检查mock的axios方法(如getpost)是否被正确调用,以及调用时是否使用了正确的参数。

以下是一个示例:

javascript
// 引入需要测试的方法和axios import { fetchData } from './fetchData'; import axios from 'axios'; // 在顶层作用域中mock整个axios模块 jest.mock('axios'); describe('fetchData', () => { it('should return data when fetchData is called', async () => { // 设置当调用axios.get时返回的数据 const mockedResponse = { data: { items: ['item1', 'item2'] } }; axios.get.mockResolvedValue(mockedResponse); // 调用需要测试的方法 const result = await fetchData(); // 检查预期的数据是否被返回 expect(result).toEqual(mockedResponse.data.items); // 检查axios.get是否被正确调用了一次,并且是被正确的URL调用的 expect(axios.get).toHaveBeenCalledTimes(1); expect(axios.get).toHaveBeenCalledWith('expected-url'); }); });

在上面的代码示例中,我们模拟了fetchData函数内部调用的axios.get请求,并设置了当它被调用时返回的数据。然后我们执行了一个测试来验证fetchData是否返回了我们在mock中设置的数据,同时也验证了axios.get是否被正确调用了。

这样,我们就可以在不依赖实际网络请求的情况下,测试我们的异步代码能否正确处理HTTP响应。

2024年6月29日 12:07 回复

你的答案