vuex-smart-module
ReadMeが読みやすい、感じがする
Unit testing getters, mutations and actions
Mocking modules to test components
Mocking nested modules and dependencies
specファイルの例として
In the spec file, mock the mutations option in the counter module. The below is a Jest example but the essential idea holds true for many test frameworks:
createStoreで、moduleのstoreを引数にして実行してstore, そのstoreと localVueで、shallowMountする。
code: spec.js
import * as Vuex from 'vuex'
import { shallowMount, createLocalVue } from '@vue/test-utils'
import { createStore } from 'vuex-smart-module'
// component which we want to test
import Counter from '@/components/Counter.vue'
// counter module which we want to mock
import counter, { CounterMutations } from '@/store/modules/counter'
const localVue = createLocalVue()
localVue.use(Vuex)
// make sure that you clean mocked object after each test case
const originalMutations = counter.options.mutations
afterEach(() => {
counter.options.mutations = originalMutations
})
it('calls increment mutation', () => {
// create spy
const spy = jest.fn()
// create mock mutation
class MockMutations extends CounterMutations {
// override increment method for mock
increment() {
spy()
}
}
// inject mock
counter.options.mutations = MockMutations
// create mock store
const store = createStore(counter)
// emulate click event
shallowMount(Counter, { store, localVue }).trigger('click')
// check the mock function was called
expect(spy).toHaveBeenCalled()
})