2016-07-07 156 views
2

有没有例子如何编写测试用例在vue点击事件不起作用。vue karma,如何编写单元测试

在App.vue模板

<template> 
<div class="main"> 
<textarea v-model="input" id="input" rows="3" placeholder="Please entry colors, eg: '#000','#fff' or ['#000', '#fff']"></textarea> 
<button type="button" class="btn btn-primary parse" @click="parse">Go!</button> 
<ul> 
    <li v-for="color in colors"> 
     <span v-bind:style="{ background: color}"></span> 
     {{color}} 
    <li> 
</ul> 

因缘测试

describe('App.vue',() => { 
it('should render correct color',() => { 
const vm = new Vue({ 
    template: "<div><app></app></div>", 
    components: { 
    App 
    } 
}).$mount() 
console.log(vm.$el) 
vm.input = '#333, #444' 
vm.$el.querySelector('.btn').click() 
expect(vm.$el.querySelector('ul li:eq(0) span').style.background).toBe('#333') 
}) 
}) 

而且我已经输出了vm.$el,它显示一个如下,缺少v-model@click
enter image description here

回答

0

它会给你什么错误吗?你是否使用PhantomJS作为浏览器? 我不认为在PhantomJS上支持点击 请看这里PhantomJS; click an element

+0

没有错误,只是期望失败。我也想知道如何触发点击... – Awakening

+0

请参阅我的答案中的'see here',了解如何触发点击 – gurghet