vue
<template>
<div class="hello">
// 这种方式不行
<el-button type="primary" @click="add()" id="add">新增</el-button>
// 这种方式可以通过测试
<div id="add" @click="add()"></div>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
data() {
return {
count: 0
}
},
methods: {
add() {
this.count++
console.log(this.count);
}
}
}
</script>
test
import { shallowMount, createLocalVue } from '@vue/test-utils'
import HelloWorld from '../../src/views/HelloWorld.vue'
import ElementUI from 'element-ui';
const localVue = createLocalVue();
localVue.use(ElementUI);
describe('HelloWorld.vue', () => {
it('测试count组件能否正常显示并增加', () => {
const wrapper = shallowMount(HelloWorld, {localVue})
expect(wrapper.vm.count).toBe(0)
wrapper.find('#add').trigger('click')
expect(wrapper.vm.count).toBe(1)
})
})
用element ui 的就不能通过测试,没有触发btn
SOF找到了,改为
mount
就可以了