Question

美好的一天！目前我在做一些测试时有点卡住了，异步测试功能可能有点问题..所以也许你可以帮助我以正确的方式清除我的想法......基本上我创建了这个功能我需要测试一下：

export const signIn = (): ThunkAction<
  void,
  RootState,
  null,
  FluxStandardAction
> => {
  return async (dispatch, getState) => {
    const { username, password } = getState().Authentication;

    dispatch(signInRequest() as FluxStandardAction<string, any>);

    try {
      const response = await axios({
        method: 'POST',
        url: `${API}/users/login`,
        data: { username, password },
      });
      dispatch(
        signInSuccess(response.data.token) as FluxStandardAction<string, any>,
      );
    } catch (err) {
      dispatch(signInFailure(err) as FluxStandardAction<string, any>);
    }
  };
};

如果您可以在 redux 中设置参数“用户名”和“密码”来自我的状态，则该请求可以完美运行。现在测试：

jest.mock('axios');

import axios from 'axios';
import configureStore from 'redux-mock-store';
import thunk from 'redux-thunk';
import { API } from '../../../src/Config';
import * as actions from '../../../src/redux/actions/authentication/authentication';

const middleware = [thunk];
const mockStore = configureStore(middleware);
const store = mockStore({});
//const mockedAxios = axios as jest.Mocked<typeof axios>;

describe('Authentication async action', () => {
  describe("'onLogin' actions", () => {
    beforeEach(() => {
      store.clearActions();
    });
    it('creates LOGIN_SIGN_IN_SUCCESS on successful authentication', async () => {
      const token = 'token';
      //axios.post.mockReset();
      //(axios.post as jest.Mock).mockReset();
      (axios.post as any).mockReset();
      (axios.post as any).mockReturnValue(
        Promise.resolve({
          data: {
            token,
          },
        }),
      );
      const expectedActions = [
        {
          type: actions.LOGIN_SIGN_IN_REQUEST,
        },
        {
          type: actions.LOGIN_SIGN_IN_SUCCESS,
          payload: token,
        },
      ];
      const store = mockStore({
        Authentication: {
          username: 'username',
          password: 'password',
        },
      });
      await store.dispatch(actions.signIn() as any);
      expect(store.getActions()).toEqual(expectedActions);
      expect(axios.post).toHaveBeenCalledWith(`${API}/users/login`, {
        username: 'username',
        password: 'password',
      });
    });
  });
});

当我运行测试时，我收到了这个错误：

 FAIL  test/redux/Authentication/Authentication.action.async.test.ts
  Authentication async action
    'onLogin' actions
      ✕ creates LOGIN_SIGN_IN_SUCCESS on successful authentication (9 ms)

  ● Authentication async action › 'onLogin' actions › creates LOGIN_SIGN_IN_SUCCESS on successful authentication

    expect(received).toEqual(expected) // deep equality

    - Expected  - 2
    + Received  + 3

      Array [
        Object {
          "type": "LOGIN_SIGN_IN_REQUEST",
        },
        Object {
    -     "payload": "token",
    -     "type": "LOGIN_SIGN_IN_SUCCESS",
    +     "error": true,
    +     "payload": [TypeError: Cannot read property 'data' of undefined],
    +     "type": "LOGIN_SIGN_IN_FAILURE",
        },
      ]

      44 |       });
      45 |       await store.dispatch(actions.signIn() as any);
    > 46 |       expect(store.getActions()).toEqual(expectedActions);
         |                                  ^
      47 |       expect(axios.post).toHaveBeenCalledWith(`${API}/users/login`, {
      48 |         username: 'username',
      49 |         password: 'password',

      at Object.<anonymous> (test/redux/Authentication/Authentication.action.async.test.ts:46:34)

Test Suites: 1 failed, 1 total
Tests:       1 failed, 1 total
Snapshots:   0 total
Time:        2.393 s, estimated 4 s
Ran all test suites matching /Authentication.action.async.test.ts/i.
error Command failed with exit code 1.

我是第一次做测试..也许有人知道怎么做..但至少对我来说有点复杂..我希望有人能帮助我:)

以开玩笑的方式成功运行此测试的正确方法是什么？

0 个答案: