在PhantomJS中进行Vue2单元测试,如何发送按键或触发事件?

时间:2017-02-15 11:35:31

标签: javascript unit-testing phantomjs vuejs2

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

模板

<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进行单元测试。如何将键发送到输入框或触发值更改事件?

1 个答案:

答案 0 :(得分:1)

一种解决方案是使用jQuery。

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

所以现在你需要反复这样做。但这就是你触发事件的方式。