如何用Jest模拟axios.post并捕获请求体，动态返回响应？

你可以通过给jest.fn()传入自定义函数的方式，捕获axios.post调用时的请求体参数，再根据参数内容返回对应的响应数据，核心思路是利用jest mock函数的回调能力直接处理调用参数：

基础实现示例 #

直接在jest.fn()中定义逻辑，接收axios.post的调用参数（通常第二个参数就是请求体data）：

axios.post = jest.fn((url, requestBody) => {
  // 根据请求体内容返回不同响应
  if (requestBody.username === 'admin') {
    return Promise.resolve({ data: { token: 'admin-token', role: '管理员' } });
  } else {
    return Promise.resolve({ data: { token: 'user-token', role: '普通用户' } });
  }
});

结合URL/配置的复杂判断 #

如果需要结合请求URL或配置信息做判断，可以接收完整的调用参数：

axios.post = jest.fn((url, requestBody, config) => {
  if (url === '/api/login' && requestBody.password === 'admin123') {
    return Promise.resolve({ status: 200, data: { msg: '登录成功' } });
  } else {
    return Promise.resolve({ status: 401, data: { msg: '账号或密码错误' } });
  }
});

用mockImplementation写法 #

也可以通过mockImplementation方法实现相同效果，适合已经提前初始化过mock的场景：

// 先初始化mock
jest.mock('axios');
// 再定义动态响应逻辑
axios.post.mockImplementation((url, requestBody) => {
  switch(requestBody.type) {
    case 'create':
      return Promise.resolve({ data: { id: 1001, status: 'created' } });
    case 'update':
      return Promise.resolve({ data: { id: 1001, status: 'updated' } });
    default:
      return Promise.resolve({ data: { status: 'default' } });
  }
});

验证请求体（可选） #

设置完动态mock后，还可以用jest断言验证请求体是否符合预期：

// 调用待测试的代码后
expect(axios.post).toHaveBeenCalledWith(
  '/api/user',
  { name: '张三', age: 25 },
  expect.anything() // 忽略配置参数
);

内容的提问来源于stack exchange，提问作者odnt