单元测试 react redux thunk dispatches with jest and react testing library for "v: 16.13.1",

Question

我有以下功能。

const loadUsers= () => {
  return 异步（调度）=> {
    派遣（用户请求（））；
    让响应=空
    尝试 {
      响应=等待UserService.getUser();
      调度（用户加载（））；
    } 赶上（错误）{
      派遣（用户错误（错误））；
    } 最后 {
      派遣（用户成功（响应））；
    }
  };
};

通过以下单元测试，我可以点击“dispatch(userRequest());”

描述('user thunk', () => {
    它（'dispatches a userRequest'，异步（）=> {
      const dispatch = jest.fn();

      等待 loadUsers()(调度);
      期望（调度）.toHaveBeenCalledWith（userRequest（））;
    });
  });

但是我不知道如何测试线及以下 response= await UserService.getUser();。尽管函数并不复杂，而且我编写复杂的测试也没有太大价值，但我需要它来构建我的管道。

我们将不胜感激。

提前致谢。

更新->用户服务

从 'axios' 导入 axios；

const USERS_ENDPOINT = '/用户';

export const getUser= async () => {
  const response = await axios.get(PRODUCTS_ENDPOINT, {});
  return response.data;
};

导出默认 getUser；

Answer 1

经过几天的研究，我最终按以下方式测试了逻辑。

import thunk from 'redux-thunk';
import configureStore from 'redux-mock-store';
import * as reactRedux from 'react-redux';

import axios from 'axios';
const middlewares = [thunk];
const mockStore = configureStore(middlewares);

describe('load user thunk', () => {
it('dispatches load user and error on call when API is not mocked', async () => {
  const store = mockStore({});
  const requestDispatch= userRequest();
  const errorDispatch= userError("Mock Message");

  await store.dispatch(await loadUsers());
  const actionsResulted = store.getActions();
  const expectedActions = [
    requestDispatch,
    errorDispatch,
  ];
  expect(actionsResulted.length).toEqual(expectedActions.length);
  expect(actionsResulted[0].type).toEqual(expectedActions[0].type);
  expect(actionsResulted[1].type).toEqual(expectedActions[1].type);
}); 

it('dispatches load user and success on call when API is mocked', async () => {
  const store = mockStore({});
  const requestDispatch= userRequest();
  const successDispatch= userSuccess("Mock Data");
  jest
  .spyOn(axios, 'get')
  .mockResolvedValue({ status: 200, data: "Mock Data"});

  await store.dispatch(await loadUsers());
  const actionsResulted = store.getActions();
  const expectedActions = [
    requestDispatch,
    successDispatch,
  ];
  expect(actionsResulted.length).toEqual(expectedActions.length);
  expect(actionsResulted[0].type).toEqual(expectedActions[0].type);
  expect(actionsResulted[1].type).toEqual(expectedActions[1].type);

 });

单元测试 react redux thunk dispatches with jest and react testing library for "v: 16.13.1",

Unit testing react redux thunk dispatches with jest and react testing library for "v: 16.13.1",

javascript

reactjs

redux

redux-thunk

react-testing-library