如何测试在redux操作中引发的错误

Question

平均而言，我可以这样：

expect(() => foo()).toThrow();

但是当我尝试通过redux操作执行此操作时，我会得到

[UnhandledPromiseRejection警告和测试结果：预期函数将引发与错误匹配的错误：“未授权”，但未引发任何错误。

动作示例：

const someAction = id => async dispatch => {
  try {
    const { data } = await apiCall(id);
    dispatch({ type: ACTION_TYPE, payload: data });
  } catch (err) {
    throw new Error(err);
  }
};

测试示例：

test('should handle errors', () => {
    const errMsg = 'Unauthorized';
    apiSpy.mockImplementationOnce(() => Promise.reject(errMsg));
    expect(() => store.dispatch(someAction(id))).toThrow(errMsg);
});

我觉得我刚刚在这里错过了一些东西。

Answer 1

这里是解决方法：

actionCreator.ts：

import { apiCall } from './apiCall';

export const ACTION_TYPE = 'ACTION_TYPE';

export const someAction = id => async dispatch => {
  try {
    const { data } = await apiCall(id);
    dispatch({ type: ACTION_TYPE, payload: data });
  } catch (err) {
    throw new Error(err);
  }
};

apiCall.ts：

export const apiCall = async (id: string) => ({ data: id });

actionCreator.spec.ts：

import createMockStore from 'redux-mock-store';
import thunk, { ThunkDispatch } from 'redux-thunk';
import { someAction } from './actionCreator';
import { AnyAction } from 'redux';
import * as API from './apiCall';

const mws = [thunk];
const mockStore = createMockStore<{}, ThunkDispatch<{}, any, AnyAction>>(mws);

describe('someAction', () => {
  afterEach(() => {
    jest.restoreAllMocks();
  });
  test('should handle errors', async () => {
    const errMsg = 'Unauthorized';
    const apiSpy = jest.spyOn(API, 'apiCall').mockRejectedValueOnce(errMsg);
    const id = '1';
    const store = mockStore({});
    await expect(store.dispatch(someAction(id))).rejects.toThrow(errMsg);
    expect(apiSpy).toBeCalledWith(id);
  });

  test('should dispatch action correctly', () => {
    expect.assertions(2);
    const apiSpy = jest.spyOn(API, 'apiCall').mockResolvedValueOnce({ data: 'mocked data' });
    const id = '1';
    const store = mockStore({});
    return store.dispatch(someAction(id)).then(() => {
      expect(store.getActions()).toEqual([{ type: 'ACTION_TYPE', payload: 'mocked data' }]);
      expect(apiSpy).toBeCalledWith(id);
    });
  });
});

带有覆盖率报告的单元测试结果：

 PASS  src/stackoverflow/58396438/actionCreator.spec.ts (6.631s)
  someAction
    ✓ should handle errors (8ms)
    ✓ should dispatch action correctly (2ms)

------------------|----------|----------|----------|----------|-------------------|
File              |  % Stmts | % Branch |  % Funcs |  % Lines | Uncovered Line #s |
------------------|----------|----------|----------|----------|-------------------|
All files         |    84.62 |      100 |       60 |      100 |                   |
 actionCreator.ts |      100 |      100 |      100 |      100 |                   |
 apiCall.ts       |       50 |      100 |        0 |      100 |                   |
------------------|----------|----------|----------|----------|-------------------|
Test Suites: 1 passed, 1 total
Tests:       2 passed, 2 total
Snapshots:   0 total
Time:        7.747s

源代码：https://github.com/mrdulin/jest-codelab/tree/master/src/stackoverflow/58396438