Slider: improve test (#554)

packages/slider/src/main.vue

@@ -4,7 +4,7 @@
       v-model="inputValue"
       v-if="showInput"
       class="el-slider__input"
-      @keyup.native="onInputChange()"
+      @keyup.native="onInputChange"
       ref="input"
       :step="step"
       :min="min"

test/unit/specs/slider.spec.js

@@ -1,6 +1,5 @@
-import { createTest, createVue } from '../util';
+import { createTest, createVue, triggerEvent } from '../util';
 import Slider from 'packages/slider';
-import Vue from 'vue';
 
 describe('Slider', () => {
   it('create', () => {
@@ -26,10 +25,10 @@ describe('Slider', () => {
     }, true);
     setTimeout(() => {
       vm.value = 40;
-      Vue.nextTick(() => {
+      vm.$nextTick(() => {
         expect(vm.value).to.equal(50);
         vm.value = 120;
-        Vue.nextTick(() => {
+        vm.$nextTick(() => {
           expect(vm.value).to.equal(100);
           done();
         });
@@ -38,12 +37,30 @@ describe('Slider', () => {
   });
 
   it('show tooltip', () => {
-    const vm = createTest(Slider);
+    const vm = createVue({
+      template: `
+        <div>
+          <el-slider v-model="value">
+          </el-slider>
+        </div>
+      `,
+
+      data() {
+        return {
+          value: 0
+        };
+      }
+    }, true);
+    const slider = vm.$children[0];
     const popup = vm.$el.querySelector('.el-slider__pop');
-    vm.onDragStart({ clientX: 0 });
+    slider.onDragStart({ clientX: 0 });
-    expect(getComputedStyle(popup).display).to.not.equal('none');
+    vm.$nextTick(() => {
-    vm.onDragEnd();
+      expect(popup.style.display).to.not.equal('none');
-    expect(popup.style.display).to.equal('none');
+      slider.onDragEnd();
+      setTimeout(() => {
+        expect(popup.style.display).to.equal('none');
+      }, 350);
+    });
   });
 
   it('drag', done => {
@@ -109,6 +126,7 @@ describe('Slider', () => {
       }
     }, true);
     setTimeout(() => {
+      triggerEvent(vm.$el.querySelector('.el-input-number'), 'keyup');
       const inputNumber = vm.$el.querySelector('.el-input-number').__vue__;
       inputNumber.currentValue = 40;
       setTimeout(() => {

test/unit/util.js

@@ -49,13 +49,16 @@ exports.createTest = function(Compo, propsData = {}, mounted = false) {
 
 /**
  * 触发一个事件
- * mouseenter, mouseleave, mouseover 等
+ * mouseenter, mouseleave, mouseover, keyup 等
  * @param  {Element} elm
  * @param  {EventName} name
  * @param  {options} opts
  */
 exports.triggerEvent = function(elm, name, opts) {
-  const evt = document.createEvent('MouseEvents');
+  const isMouseEvent = /^mouse/.test(name);
+  const isKeyEvent = /^key/.test(name);
+  if (!isMouseEvent && !isKeyEvent) return;
+  const evt = document.createEvent(isMouseEvent ? 'MouseEvents' : 'KeyboardEvent');
 
   evt.initEvent(name, ...opts);
   elm.dispatchEvent