Question

我是redux的新手，我想拔出头发来尝试使用redux和moxios进行基本测试。

API只是axios，设置了一些自定义标头。

我的post方法出错： TypeError：无法读取未定义的属性“ then”

我的方法：

const login = ({username, password}) => (dispatch) => {
  dispatch(actions.loginRequested());
  return API.post(`curavi/v2/authentication`, {username, password})
    .then(response => dispatch(actions.loginSuccess(response.data.payload)))
    .catch((error) => errorHandler(dispatch, error.response));
};

我的测试用例：

describe('login', () => {

  beforeEach(function () {
    // import and pass your custom axios instance to this method
    moxios.install(API)
  });

  afterEach(function () {
    // import and pass your custom axios instance to this method
    moxios.uninstall(API)
  });

  test('calls loginSuccess when the response is successful', () => {
    const store = mockStore();

    const mockData = {
      data: { payload: 'yay' }
    };

    moxios.wait(() => {
      const request = API.requests.mostRecent();
      request.respondWith({
        status: 200,
        response: mockData
      });
    });

    const expectededActions = [
      {type: types.LOGIN_REQUESTED},
      {type: types.LOGIN_SUCCESS, payload: 'yay'}
    ];

    actions.loginRequested.mockReturnValue({type: types.LOGIN_REQUESTED});
    actions.loginSuccess.mockReturnValue({type: types.LOGIN_SUCCESS, payload: 'yay'});
    actions.loginFail.mockReturnValue({type: types.LOGIN_FAIL, message: 'boo'});

    return store.dispatch(operations.login({username: 'theuser', password: 'thepassword'}))
      .then(() => {
        expect(store.getActions()).toEqual(expectededActions);

        expect(API.post).toHaveBeenCalledWith('curavi/v2/authentication',
          {username: 'theuser', password: 'thepassword'});
      });
  })
});

Answer 1

确定要按照您的建议在TypeError中获得一个login吗？这没有道理；如果API不是axios实例，则会出现该错误，在这种情况下，API.post()可能返回undefined。另一方面，您的测试由于以下两个原因而无法正常工作：

您需要将API.requests.mostRecent()替换为moxios.requests.mostRecent()。

您在moxios等待中拥有的功能将在0.5秒钟内不执行，请参阅here。如果在此之前要到达测试中的return语句，则测试将简单地返回一个promise。您可以改为执行以下操作：

test('...', async () => {

    // ...

    const result = await store.dispatch(
        operations.login({
            username: 'theuser',
            password: 'thepassword',
        })
    );

    expect(store.getActions()).toEqual(expectededActions);
    expect(API.post).toHaveBeenCalledWith(/* ... */);
});

您还应该确保正确设置商店：

import configureStore from 'redux-mock-store';
import thunk from 'redux-thunk';

const middlewares = [thunk];
const mockStore = configureStore(middlewares);

// use your store inside your tests
const store = mockStore();

使用Moxios测试Redux异步方法

1 个答案: