如何测试其中带有api调用的玩笑的vuex动作?

时间:2019-03-19 04:53:12

标签: javascript vue.js vuejs2 jestjs vuex

  

ASYNC ACTION VUEX:这是异步操作,将从   组件,它由一个函数fetchGaragesData组成,   用于从服务器获取数据的api调用。

[ACTION_TYPES.FETCH_CASHLESS_GARAGES]: async (
        { dispatch, commit, state, rootState },
        payload
    ) => {
        commit(MUTATION_TYPES.SET_MISC_KEYS, {
            fetchingCashlessGaragesInitiated: true,
        })
        let { insurerSlug, makeId, rtoCode } = payload
        const url = ApiUrls.getCashlessGarages + `${insurerSlug}/${makeId}`
        const response = await fetchGaragesData(url, rtoCode)
        dispatch(ACTION_TYPES.MODIFY_RTO_WISE_GARAGES_DATA, response)
    },
  

fetchGaragesData的实现:此函数在内部调用   axios获取:

export const fetchGaragesData = (url: string, rtoCode: string) => {
    return get(url, {
        rto_code: rtoCode,
        all_states_data: true,
    })
}

如何测试动作ACTION_TYPES.FETCH_CASHLESS_GARAGES ???

1 个答案:

答案 0 :(得分:1)

您可能会收到API模拟响应。因此,在您的规范文件中,您需要为该特定的API调用添加模拟响应。

将文件包含在具有实际后端API调用的规范文件中。 例如:

import someName from 'path of file'

jest.mock('someName', () => ({
 fetchGaragesData: jest.fn((url, rtoCode) =>
  success({ body: 
    Here comes your response body
 }})
)

url和rtoCode应该是您的API调用文件中使用的变量的名称。