React Redux异步动作创建者测试 [英] React redux async action creator test

问题描述

我是React Redux的新手.我正在尝试测试异步操作

I am new to the react redux. I am trying to test the async action

动作类似于>

export function fetchUserJd() {
  return (dispatch) => {
    let url = FETCH_JD_ROOT_URL + page + "&" + size;
    dispatch({
      type: REQUEST_INITIATED
    })
    get(url)
      .then((response) => {
        if (response.status === 200) {
          dispatch({
            type: REQUEST_SUCCESSED,
          });
          dispatch({
            type: FETCHING_JOBDESCRIPTION_SUCCESS,
            data: response.payload,
          }
          )
        }
        else {
          dispatch({
            type: REQUEST_SUCCESSED
          })
          toastr.error("Error while fetching Job Description, Please check again");
          if (response.status === "") {
            toastr.error('Our server is down. Please check again');
          }
          dispatch({
            type: FETCHING_JOBDESCRIPTION_FAILED,
            data: response.status,
          });
          if (response.status === 401) {
            toastr.error('Please Login Again');
            localStorage.clear();
            history.push('/');
          }
        }
      })
  }

现在，我正在尝试像

describe('Header component actions', () => {

    beforeEach(() => moxios.install());
     afterEach(() => moxios.uninstall());

    it('creates Fetch Jopb description when login action is successful', async (done) => {
        let url = FETCH_JD_ROOT_URL + page + "&" + size;
    moxios.stubRequest(url, {
      status: 201,
      response: mockData.jobDescriptionResponse
    });
    const expectedActions = [{ type: "FETCHING_JOBDESCRIPTION_SUCCESS"}];
    const store = mockStore({});
    await store.dispatch(fetchUserJd())
      .then(() => {
        expect(store.getActions()).toEqual(expectedActions);
      });
    done();
  });
});

所以在这里我得到一个错误，即

so here I am getting one error here that is ,

超时-未在由指定的超时内调用异步回调 jasmine.DEFAULT_TIMEOUT_INTERVAL.

Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.

因此，我没有收到此错误，有人可以帮助我吗? 我编写测试用例的方式是对的吗?

So, I am not getting this error, Can any one help me with this ? And the way I am writing the test case is right ?

要请求我也使用令牌，

headers: {
                "Authorization": localStorage.getItem("access_token") !== null ? `Bearer ` + localStorage.getItem("access_token") : null,
                "Content-Type": "application/json"
            }

我的通话服务就像，

export const get = (url) =>
    axios.get(
        url,
        {
            headers: {
                "Authorization": localStorage.getItem("access_token") !== null ? `Bearer ` + localStorage.getItem("access_token") : null,
                "Content-Type": "application/json"
            }
        }
    ).then(data => {
        if (data.status === HttpStatus.OK) {
            return {
                status: data.status,
                payload: data.data
            };
        }
    }).catch(err => {
        return {
            status: err.response.data,
            payload: null
        };
    });

那么，是因为我没有传递令牌吗?

So, is it because of I am not passing the tokens ?

推荐答案

您忘了从动作创建者返回Promise:您必须返回get调用，它应该可以工作:

You forgot to return a Promise from your action creator : you have to return the get call and it should work :

export function fetchUserJd() {
  return (dispatch) => {
    let url = FETCH_JD_ROOT_URL + page + "&" + size;
    dispatch({
      type: REQUEST_INITIATED
    })
    return get(url) // you missed the return statement here
      .then((response) => {
        if (response.status === 200) {
          dispatch({
            type: REQUEST_SUCCESSED,
          });
          dispatch({
            type: FETCHING_JOBDESCRIPTION_SUCCESS,
            data: response.payload,
          }
          )
        }
        else {
          dispatch({
            type: REQUEST_SUCCESSED
          })
          toastr.error("Error while fetching Job Description, Please check again");
          if (response.status === "") {
            toastr.error('Our server is down. Please check again');
          }
          dispatch({
            type: FETCHING_JOBDESCRIPTION_FAILED,
            data: response.status,
          });
          if (response.status === 401) {
            toastr.error('Please Login Again');
            localStorage.clear();
            history.push('/');
          }
        }
      })
  }

这篇关于React Redux异步动作创建者测试的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！