Mocking APi 开玩笑答案

【问题标题】：Mocking APi calls jestMocking APi 开玩笑
【发布时间】：2023-03-14 23:40:01
【问题描述】：

我有一个负责我的 API 调用的 DataService - 我试图开玩笑地模拟 api 调用，但它似乎不起作用。我不确定我做错了什么 - 我的 DataService 似乎未定义。

这里是函数

const getStepData = (id) => {
  return async dispatch => {
    try {
      dispatch(fetchStepBegin());

      const res = await DataService.fetchStepData(id);
      const sortedTask = sortedTaskData(res)

      const sortedStepData = sortStepData(res)
      const newData = createSortedDataForDragAndDrop(sortedTask, sortedStepData)
      dispatch(fetchRawStepDataSuccess(res.data))
      dispatch(fetchStepDataSuccess(newData))
    }
    catch (err) {
      dispatch(fetchStepError(err))
      throw (err)
    }
  }
}

这是我编写的测试 - 我很确定我的嘲笑不正确

  it('Data Api end point called with corrent studyId', () => {
    jest.mock(DataService);
    DataService.fetchStepData() = jest.fn()
    CellStepManagementOperations.getStepData(5);
    expect(DataService.fetchStepData).toHaveBeenCalledWith(5);

  });

【问题讨论】：

标签： javascript reactjs redux jestjs

【解决方案1】：

我认为这里的问题是您正在尝试测试异步动作创建者，同步。因此，您的 expect 函数不会在运行前等待您的 getStepData 完成。

我不得不做一些与您正在尝试做的事情非常相似的事情，我使用了一个名为 redux-testkit 的库。请参阅有关使用服务here 测试异步操作创建者的部分。您甚至可以为您的 API 服务设置模拟返回值，我发现这在测试时非常有用。

使用此库，您将能够在运行 expect 函数之前为您的 getStepData 异步操作创建者完成 await。

您将不得不使用您的代码，但它可能看起来像这样：

it('Data Api end point called with corrent studyId', () => {
  jest.mock(DataService);
  DataService.fetchStepData() = jest.fn()
  const dispatches = await Thunk(CellStepManagementOperations.getStepData).execute(5);
  expect(DataService.fetchStepData).toHaveBeenCalledWith(5);
});

【讨论】：