vue-test-utils-vuex-example
vue-test-utils-vuex-example copied to clipboard
(n/t) Could you add an example which is testing the return of an Async Action?
Could you add an example which is testing the return of an Async Action?
I'm actually looking at writing a library right now to make this easier, but you can do something like this:
test('promise based action', (done) => {
const wrapper = mount(Component)
setTimeout(() => {
expect(wrapper.hasClass('updated').toBe(true)
done()
})
})
I was looking at http://facebook.github.io/jast/docs/en/tutorial-async.html . I was wondering how I can combine that with Vuex.
Essentially Imagine you have an action such as:
export const fetchItems = ({ commit, dispatch, state }) => {
commit(types.PRE_HTTP_REQUEST);
api.fetchItems(state.apiEntryPoint, state.nextPage).then((data) => {
dispatch('receiveItems', data);
}).catch(() => {
commit(types.FETCHED_ADS_FAIL);
});
};
using Axios like:
const fetchItems = (url, page = 1) => (
axios(url, { params: { page } })
.then(response => response.data)
.catch((err) => {
throw err;
})
);
and you wanna see if the content returned is what you're expecting and then that the Component dependent on that content (Vuex) looks as it should
You'd have to mock the axios call. I just wrote a test that uses a library called flush-promises and async Jest tests — https://github.com/eddyerburgh/chapter-6/blob/master/src/store/tests/store-config.spec.js#L34
@eddyerburgh I meant having an example page that basically does this: https://vuex.vuejs.org/en/testing.html but with Jest instead
Ok, do you mean there should be on on vue-test-utils? If so, can you make an issue there so that I can track it and any contributors can be involved
Sorry I just looked around and I see in chapter-6 a pretty good example : https://github.com/eddyerburgh/chapter-6/blob/master/src/store/tests/actions.spec.js Yeah I was wondering if a small example on how to test the store (not a component that depends on the store but the store itself like in chapter-6) can be part of the main documentation over in https://vue-test-utils.vuejs.org/en/guides/using-with-vuex.html will do! ✔️
Thanks 🙂