I am trying to test some view actions which are promises I have successfully tested that the promises resolve, I am now trying to test the promise rejects, the code in my components looks like this,
mounted() {
this.GET_WORKFLOW_TYPES()
.then(() => {
this.GET_WORKFLOW_EVENTS_BY_TYPE({
workflow_type: this.selectedWorkflow,
})
.then(() => {
this.loading = false;
})
.catch((error) => {
console.log("2 " + error);
this.loading = false;
this.error = error
});
})
.catch((error) => {
console.log("1 " + error);
this.loading = false;
this.error = error
});
},
My test looks like this, basically I am trying to test that the code drops into the catch
test('It should show an error if the mounted vuex action failed', async() => {
actions = {
GET_WORKFLOW_TYPES: jest.fn(() => { Promise.reject(new Error("Problem encountered 1")) }),
GET_WORKFLOW_EVENTS_BY_TYPE: jest.fn(() => { Promise.reject(new Error("Problem encountered 2")) }),
};
store = new Vuex.Store({
modules: {
audit: {
actions,
mutations,
state
}
}
});
wrapper = shallowMount(AdminAudit, { store, localVue });
await wrapper.vm.$nextTick()
expect(actions.GET_WORKFLOW_TYPES).rejects.toBe(true);
await wrapper.vm.$nextTick();
expect(wrapper.vm.loading).toBe(false);
});
So I am test that rejects is true and that it then resets some of the component data (loading:false).
However I get this error,
expect(received).rejects.toEqual()
Matcher error: received value must be a promise
Received has type: function
Received has value: [Function mockConstructor]
77 | wrapper = shallowMount(AdminAudit, { store, localVue });
78 | await wrapper.vm.$nextTick()
> 79 | expect(actions.GET_WORKFLOW_TYPES).rejects.toEqual(new Error("Problem encountered 1"));
| ^
80 | await wrapper.vm.$nextTick();
81 | expect(wrapper.vm.loading).toBe(false);
82 | });
How would I go about testing a vuex action the returns a promise, I assume I am going about it the wrong way?