Vuex: Doc section on testing mutations would benefit from an example of using constants for mutator names

Created on 16 Nov 2016  路  4Comments  路  Source: vuejs/vuex

The doc section on unit testing mutations does a good job of explaining how to test mutations when they are defined directly as object properties, but it doesn't show how to test them when you use constants to define mutation types, like

// store/mutation-types.js
export const RECEIVE_TITLES = 'RECEIVE_TITLES'

// store/index.js

import * as mt from './mutation-types'

// ...

const mutations = {
  [mt.RECEIVE_TITLES]: function (state, { titles }) {
    state.titles = titles
  }
}

The tests in the vuex repository all create their own store just for testing and then "commit" rather than just calling the mutator. I don't see any mutator tests in example projects like Hacker News or shopping-cart.

Most helpful comment

Why not write like this:

import * as mt from './mutation-types'
import { mutations } from './store'

mutations[mt.RECEIVE_TITLES](state, payload)

All 4 comments

Why is this necessary? I think you can just replace string literal with constant.

The current docs have you call the mutator directly as a function (the store, or a mock for it, is not part of the approach). If you followed the docs, but substituted the constant for the function name you would get something like this:

mt.RECEIVE_TITLES(state, { titles:["one","two"] })

or this

'receiveTitles'(state,  payload)

or do you mean that should be able to get callable function reference like so?

// store/index.js

export const mutations = {
  [mt.RECEIVE_TITLES]: function (state, { titles }) {
    state.titles = titles
  }
}
// mutations.spec.js

import { mutations } from './store'
const { receiveTitles  } = mutations

// ...

receiveTitles(state,payload)

Why not write like this:

import * as mt from './mutation-types'
import { mutations } from './store'

mutations[mt.RECEIVE_TITLES](state, payload)

I'll try it, thanks

Was this page helpful?
0 / 5 - 0 ratings