Vor der Verwendung von vuex Modulen waren meine Mutationstests OK:Wie Mutationen zu testen, wenn vuex Module
import mutations from '@/vuex/mutations.js'
import vueAuthInstance from '@/services/auth.js'
import { IS_AUTHENTICATED, CURRENT_USER_ID } from '@/vuex/mutation_types.js'
describe('mutations.js',() => {
var state
beforeEach(() => {
state = {
isAuthenticated: vueAuthInstance.isAuthenticated(),
currentUserId: ''
}
})
describe('IS_AUTHENTICATED',() => {
it('should set authentication status',() => {
state.isAuthenticated = false
mutations[IS_AUTHENTICATED](state, {isAuthenticated: true})
expect(state.isAuthenticated).to.eql(true)
})
})
...
})
Jetzt habe ich meine vuex Ordner Refactoring, mein Zustand und Mutationen innerhalb jeder vuex/Module sind /../ index.js Datei
src
|_ vuex
| L_ modules
| L_ login
| |_ index.js
| |_ actions.js
| |_ getters.js
| |_ mutation_types.js
|_ App.vue
|_ main.js
vuex/modules/login/index.js
import Vue from 'vue'
import Vuex from 'vuex'
import actions from './actions'
import getters from './getters'
import * as types from './mutation_types'
import vueAuthInstance from '@/services/auth.js'
Vue.use(Vuex)
const state = {
isAuthenticated: vueAuthInstance.isAuthenticated(),
currentUserId: ''
}
const mutations = {
[types.IS_AUTHENTICATED] (state, payload) {
state.isAuthenticated = payload.isAuthenticated
},
...
}
export default {
state,
mutations,
actions,
getters
}
Withe ein vuex/store.js
import Vue from 'vue'
import Vuex from 'vuex'
import login from '@/vuex/modules/login'
// import other modules
Vue.use(Vuex)
export default new Vuex.Store({
modules: {
login,
... (other modules)
}
})
diese neue Struktur in Rechnung zu tragen, schrieb ich das Gerät zu testen, wie folgend:
test/unit/specs/vuex/modules/login/index. spec.js
import { mutations } from '@/vuex/modules/login/index.js'
import vueAuthInstance from '@/services/auth.js'
import types from '@/vuex/modules/login/mutation_types.js'
describe('mutations.js',() => {
var state
beforeEach(() => {
state = {
isAuthenticated: vueAuthInstance.isAuthenticated(),
currentUserId: ''
}
})
describe('IS_AUTHENTICATED',() => {
it('should set authentication status',() => {
state.isAuthenticated = false
mutations[types.IS_AUTHENTICATED](state, {isAuthenticated: true})
expect(state.isAuthenticated).to.eql(true)
})
})
})
Und ich erhalte eine Fehlermeldung, auf der Mutation:
✗ should set authentication status
TypeError: Cannot read property 'IS_AUTHENTICATED' of undefined
Ich habe versucht, die Einfuhr {Mutationen} Anweisung und Import direkt die store.js zu ändern, in der die Module definiert sind, und store._mutations verwenden,
LOG: 'MUTATIONS: ', Object{IS_AUTHENTICATED: [function wrappedMutationHandler(payload) { ... }], ...}
store._mutations.IS_AUTHENTICATED0 verwenden, scheint zu funktionieren (Ich weiß nicht warum ein Array? ..), aber etwas ist mit dieser Funktion falsch und Staat, Nutzlast args, da der Test nicht
import store from '@/vuex/store'
import vueAuthInstance from '@/services/auth.js'
describe('mutations.js',() => {
var state
beforeEach(() => {
state = {
isAuthenticated: vueAuthInstance.isAuthenticated(),
currentUserId: ''
}
})
describe('IS_AUTHENTICATED',() => {
it('should set authentication status',() => {
state.isAuthenticated = false
console.log('MUTATIONS: ', store._mutations.IS_AUTHENTICATED())
store._mutations.IS_AUTHENTICATED[0](state, {isAuthenticated: true})
expect(state.isAuthenticated).to.eql(true)
})
})
...
})
1) should set authentication status
mutations.js IS_AUTHENTICATED
AssertionError: expected false to deeply equal true
ich die übergebenen args-Datei auf die Mutation in dem index.js geprüft hindurchgeht
const mutations = {
[types.IS_AUTHENTICATED] (state, payload) {
console.log('MUTATION state: ', state)
console.log('MUTATION payload: ', payload)
state.isAuthenticated = payload.isAuthenticated
},
[types.CURRENT_USER_ID] (state, payload) {
state.currentUserId = payload.currentUserId
}
}
Und. Ich habe nicht die übergebenen Werte arg sehen, scheint es, dass der Staat args der einzige übergebenen Wert von meinem Test:
LOG: 'MUTATION state: ', Object{isAuthenticated: false, currentUserId: ''}
LOG: 'MUTATION payload: ', Object{isAuthenticated: false, currentUserId: ''}
Was ist mit diesem Code falsch? Wie gehe ich vor, um die Mutationen in diesem Fall mit vuex-Modulen zu testen?
Dank für Feedback