Skip to content

docs: Fix typos/style inconsistencies in using-with-vuex.md #1126

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Feb 2, 2019
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 10 additions & 11 deletions docs/guides/using-with-vuex.md
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,6 @@ describe('Actions.vue', () => {
actionInput: jest.fn()
}
store = new Vuex.Store({
state: {},
actions
})
})
Expand Down Expand Up @@ -126,7 +125,7 @@ Great, so now we can mock actions, let’s look at mocking getters.
</script>
```

This is a fairly simple component. It renders the result of the getters `clicks` and `inputValue`. Again, we don’t really care about what those getters returns – just that the result of them is being rendered correctly.
This is a fairly simple component. It renders the result of the getters `clicks` and `inputValue`. Again, we don’t really care about what those getters return – just that their result is being rendered correctly.

Let’s see the test:

Expand Down Expand Up @@ -154,13 +153,13 @@ describe('Getters.vue', () => {
})
})

it('Renders "state.inputValue" in first p tag', () => {
it('Renders "store.getters.inputValue" in first p tag', () => {
const wrapper = shallowMount(Getters, { store, localVue })
const p = wrapper.find('p')
expect(p.text()).toBe(getters.inputValue())
})

it('Renders "state.clicks" in second p tag', () => {
it('Renders "store.getters.clicks" in second p tag', () => {
const wrapper = shallowMount(Getters, { store, localVue })
const p = wrapper.findAll('p').at(1)
expect(p.text()).toBe(getters.clicks().toString())
Expand Down Expand Up @@ -245,7 +244,7 @@ describe('MyComponent.vue', () => {
expect(actions.moduleActionClick).toHaveBeenCalled()
})

it('renders "state.inputValue" in first p tag', () => {
it('renders "state.clicks" in first p tag', () => {
const wrapper = shallowMount(MyComponent, { store, localVue })
const p = wrapper.find('p')
expect(p.text()).toBe(state.clicks.toString())
Expand Down Expand Up @@ -290,7 +289,7 @@ First, let's test the `increment` mutations:

import mutations from './mutations'

test('increment increments state.count by 1', () => {
test('"increment" increments "state.count" by 1', () => {
const state = {
count: 0
}
Expand All @@ -306,14 +305,14 @@ Now let's test the `evenOrOdd` getter. We can test it by creating a mock `state`

import getters from './getters'

test('evenOrOdd returns even if state.count is even', () => {
test('"evenOrOdd" returns even if "state.count" is even', () => {
const state = {
count: 2
}
expect(getters.evenOrOdd(state)).toBe('even')
})

test('evenOrOdd returns odd if state.count is odd', () => {
test('"evenOrOdd" returns odd if "state.count" is odd', () => {
const state = {
count: 1
}
Expand All @@ -325,7 +324,7 @@ test('evenOrOdd returns odd if state.count is odd', () => {

Another approach to testing a Vuex store is to create a running store using the store config.

The benefit of testing creating a running store instance is we don't have to mock any Vuex functions.
The benefit of creating a running store instance is we don't have to mock any Vuex functions.

The downside is that when a test breaks, it can be difficult to find where the problem is.

Expand Down Expand Up @@ -354,7 +353,7 @@ import Vuex from 'vuex'
import storeConfig from './store-config'
import { cloneDeep } from 'lodash'

test('increments count value when increment is commited', () => {
test('increments "count" value when "increment" is commited', () => {
const localVue = createLocalVue()
localVue.use(Vuex)
const store = new Vuex.Store(cloneDeep(storeConfig))
Expand All @@ -363,7 +362,7 @@ test('increments count value when increment is commited', () => {
expect(store.state.count).toBe(1)
})

test('updates evenOrOdd getter when increment is commited', () => {
test('updates "evenOrOdd" getter when "increment" is commited', () => {
const localVue = createLocalVue()
localVue.use(Vuex)
const store = new Vuex.Store(cloneDeep(storeConfig))
Expand Down