PhantomJS中的Vue2单元测试，如何发送按键或触发事件？

Question

我在我的组件中有一个简单的搜索框，我想单元测试在搜索框中键入文本时的行为。

模板

<input type="text" placeholder="Search..." id="filterBox" v-on:input="updateFilter"> 

单元测试

import Vue from 'vue'; 
import Grid from 'src/components/Grid'; 

function create (Component, propsData) { 
    const Ctor = Vue.extend(Component); 
    return new Ctor({ propsData }).$mount(); 
} 

describe('Grid.vue',() => { 
    it('should debounce search',() => { 
    const vm = create(Grid, { 
     data: [], 
     columns: [], 
     initialSortKey: 'a' 
    }); 
    var box = vm.$el.querySelector('#filterBox'); 
    //TODO figure out how to send keys 
    }); 
}); 

我使用Vue2和PhantomJS单元测试。如何将密钥发送到输入框或触发值更改事件？

Answer 1

一个解决方案是使用jQuery。

var e = $.Event('keydown'); 
e.which = 56; // whatever keycode you need here 
$('#filterBox').trigger(e); 

所以现在你需要重复这样做。但这是你如何触发事件。