diff --git a/docs/guides/using-with-vuex.md b/docs/guides/using-with-vuex.md index 54d65f764..45a50c343 100644 --- a/docs/guides/using-with-vuex.md +++ b/docs/guides/using-with-vuex.md @@ -1,7 +1,9 @@ -## Using with Vuex +# Using with Vuex In this guide, we'll see how to test Vuex in components with Vue Test Utils, and how to approach testing a Vuex store. +## Testing Vuex in components + ### Mocking Actions Let’s look at some code. @@ -214,14 +216,14 @@ And the test: ``` js import { shallowMount, createLocalVue } from '@vue/test-utils' import Vuex from 'vuex' -import Modules from '../../../src/components/Modules' -import module from '../../../src/store/module' +import MyComponent from '../../../src/components/MyComponent' +import mymodule from '../../../src/store/mymodule' const localVue = createLocalVue() localVue.use(Vuex) -describe('Modules.vue', () => { +describe('MyComponent.vue', () => { let actions let state let store @@ -238,23 +240,27 @@ describe('Modules.vue', () => { } store = new Vuex.Store({ - state, - actions, - getters: module.getters + modules: { + mymodule: { + state, + actions, + getters: module.getters + } + } }) }) it('calls store action "moduleActionClick" when button is clicked', () => { - const wrapper = shallowMount(Modules, { store, localVue }) + const wrapper = shallowMount(MyComponent, { store, localVue }) const button = wrapper.find('button') button.trigger('click') expect(actions.moduleActionClick).toHaveBeenCalled() }) it('Renders "state.inputValue" in first p tag', () => { - const wrapper = shallowMount(Modules, { store, localVue }) + const wrapper = shallowMount(MyComponent, { store, localVue }) const p = wrapper.find('p') - expect(p.text()).toBe(state.module.clicks.toString()) + expect(p.text()).toBe(state.clicks.toString()) }) }) ``` @@ -385,4 +391,4 @@ Notice that we use `cloneDeep` to clone the store config before creating a store - [Example project for testing the components](https://github.com/eddyerburgh/vue-test-utils-vuex-example) - [Example project for testing the store](https://github.com/eddyerburgh/testing-vuex-store-example) - [`localVue`](../api/options.md#localvue) -- [`createLocalVue`](../api/createLocalVue.md) +- [`createLocalVue`](../api/createLocalVue.md) \ No newline at end of file