Question

How do you test mutations in VueJS?

Answer 1

Since mutations are just functions that completely rely on their arguments it will be easier to test. You need to keep mutations inside your store.js file and should also export the mutations as a named export apart from default export.

Let's take an example of increment mutations,

// mutations.js
export const mutations = {
  increment: state => state.counter++
}

And test them using mocha and chai as below,

// mutations.spec.js
import { expect } from 'chai'
import { mutations } from './store'

// destructure assign `mutations`
const { increment } = mutations

describe('mutations', () => {
  it('INCREMENT', () => {
    // mock state
    const state = { counter: 10 }
    // apply mutation
    increment(state)
    // assert result
    expect(state.counter).to.equal(11)
  })
})