Javascript 使用jest进行Vue单元测试vuex存储操作
我使用的是Vue版本2.6.11,Vuex版本3.4.0。我在vuex存储(timeTravel)中有一个函数,它将数组元素从给定索引移动到另一个给定索引。我有一个带有按钮的组件,可以触发这个功能。我不熟悉单元测试,这让我很困惑 ActionList.vue组件Javascript 使用jest进行Vue单元测试vuex存储操作,javascript,unit-testing,vue.js,jestjs,vuex,Javascript,Unit Testing,Vue.js,Jestjs,Vuex,我使用的是Vue版本2.6.11,Vuex版本3.4.0。我在vuex存储(timeTravel)中有一个函数,它将数组元素从给定索引移动到另一个给定索引。我有一个带有按钮的组件,可以触发这个功能。我不熟悉单元测试,这让我很困惑 ActionList.vue组件 // other codes <v-btn color="primary" dark @click="timeTravel({from:action.from_index,to:action.to_
// other codes
<v-btn color="primary" dark @click="timeTravel({from:action.from_index,to:action.to_index,action_list_index:index})">
<v-icon left dark>
mdi-clock-outline
</v-icon>
Submit
</v-btn>
<script>
import { mapGetters, mapActions } from "vuex";
export default {
name: "ActionsList",
computed: mapGetters(["commitedActionsList"]),
methods: {
...mapActions(["timeTravel"]),
},
};
</script>
所以我想用jest为这个时间旅行函数编写一个单元测试。我找到了一些教程,但让我感到困惑。到目前为止,我已经想到了这个
import Vuetify from 'vuetify';
import Vuex from 'vuex'
import { createLocalVue ,shallowMount } from '@vue/test-utils'
import ActionsList from '@/components/ActionsList.vue';
let localVue = createLocalVue();
describe('App',()=>{
let store
let actions
let state
let getters
beforeEach(()=>{
localVue.use(Vuex)
localVue.use(Vuetify)
state = {posts:[]}
getters = {
postsList: (state) => state.posts,
}
actions = {
timeTravel: jest.fn()
}
store = new Vuex.Store({
state,
getters,
actions
})
})
it('dispatches timeTravel', ()=>{
const wrapper = shallowMount({
localVue,
store
})
wrapper.find('v-btn').trigger('click')
expect()
})
})
我想测试时间旅行函数是否将元素从给定索引移动到另一个给定索引。因此,如果有人能为我指出正确的方向,帮助我编写这个单元测试,那就太好了
import Vuetify from 'vuetify';
import Vuex from 'vuex'
import { createLocalVue ,shallowMount } from '@vue/test-utils'
import ActionsList from '@/components/ActionsList.vue';
let localVue = createLocalVue();
describe('App',()=>{
let store
let actions
let state
let getters
beforeEach(()=>{
localVue.use(Vuex)
localVue.use(Vuetify)
state = {posts:[]}
getters = {
postsList: (state) => state.posts,
}
actions = {
timeTravel: jest.fn()
}
store = new Vuex.Store({
state,
getters,
actions
})
})
it('dispatches timeTravel', ()=>{
const wrapper = shallowMount({
localVue,
store
})
wrapper.find('v-btn').trigger('click')
expect()
})
})