From 1ddc46e3958087bffcdd199d6637f1912e4535fa Mon Sep 17 00:00:00 2001 From: jiangruowei Date: Fri, 17 Mar 2017 18:07:13 +0800 Subject: [PATCH] feat: add tests --- test/unit/creater.js | 57 ------------------------ test/unit/specs/actionsheet.spec.js | 13 +++--- test/unit/specs/card.spec.js | 17 ++++---- test/unit/specs/cell.spec.js | 17 ++++---- test/unit/specs/checkbox.spec.js | 13 +++--- test/unit/specs/field.spec.js | 13 +++--- test/unit/specs/loading.spec.js | 67 +++++++++++++++++++++++++++++ 7 files changed, 105 insertions(+), 92 deletions(-) delete mode 100644 test/unit/creater.js create mode 100644 test/unit/specs/loading.spec.js diff --git a/test/unit/creater.js b/test/unit/creater.js deleted file mode 100644 index e35013380..000000000 --- a/test/unit/creater.js +++ /dev/null @@ -1,57 +0,0 @@ -import Vue from 'vue'; - -let id = 0; - -class Creater { - constructor(Compo, propsData) { - let Ctor = Vue.extend(Compo); - this.vue = new Ctor({ propsData }); - this.el = null; - } - - mount() { - const elem = exports.createElm(); - this.vue.$mount(elem); - this.el = this.vue.$el; - } - - triggerEvent(name, ...opts) { - let eventName; - let elem = this.el; - - if (/^mouse|click/.test(name)) { - eventName = 'MouseEvents'; - } else if (/^key/.test(name)) { - eventName = 'KeyboardEvent'; - } else { - eventName = 'HTMLEvents'; - } - const evt = document.createEvent(eventName); - - evt.initEvent(name, ...opts); - elem.dispatchEvent - ? elem.dispatchEvent(evt) - : elem.fireEvent('on' + name, evt); - - return elem; - } - - destroy() { - this.el && - this.el.parentNode && - this.el.parentNode.removeChild(this.el); - } -} - -exports.createElm = function() { - const elm = document.createElement('div'); - - elm.id = 'app' + ++id; - document.body.appendChild(elm); - - return elm; -}; - -exports.createVue = function(Compo, propsData = {}) { - return new Creater(Compo, propsData); -}; diff --git a/test/unit/specs/actionsheet.spec.js b/test/unit/specs/actionsheet.spec.js index 0df388561..dcf387fb8 100644 --- a/test/unit/specs/actionsheet.spec.js +++ b/test/unit/specs/actionsheet.spec.js @@ -1,16 +1,17 @@ -import { createVue } from '../creater'; import ActionSheet from 'packages/actionsheet'; +import { mount } from 'avoriaz'; describe('ActionSheet', () => { - let vm; + let wrapper; afterEach(() => { - vm && vm.destroy(); + wrapper && wrapper.destroy(); }); it('create', () => { - vm = createVue(ActionSheet); - vm.mount(); + wrapper = mount(ActionSheet, { + propsData: {} + }); - expect(vm.el.classList.contains('zan-actionsheet')).to.true; + expect(wrapper.hasClass('zan-actionsheet')).to.be.true; }); }); diff --git a/test/unit/specs/card.spec.js b/test/unit/specs/card.spec.js index 3768f4e62..8249dde09 100644 --- a/test/unit/specs/card.spec.js +++ b/test/unit/specs/card.spec.js @@ -1,20 +1,19 @@ -import { createVue } from '../creater'; import Card from 'packages/card'; +import { mount } from 'avoriaz'; describe('Card', () => { - let vm; + let wrapper; afterEach(() => { - vm && vm.destroy(); + wrapper && wrapper.destroy(); }); it('create', () => { - vm = createVue(Card, { - title: 'card', - desc: 'card', - thumb: 'https://img.yzcdn.cn/upload_files/2017/02/17/FnDwvwHmU-OiqsbjAO5X7wh1KWrR.jpg!100x100.jpg' + wrapper = mount(Card, { + propsData: { + thumb: 'thumb' + } }); - vm.mount(); - expect(vm.el.classList.contains('zan-card')).to.true; + expect(wrapper.hasClass('zan-card')).to.be.true; }); }); diff --git a/test/unit/specs/cell.spec.js b/test/unit/specs/cell.spec.js index e8e420517..5699c3910 100644 --- a/test/unit/specs/cell.spec.js +++ b/test/unit/specs/cell.spec.js @@ -1,16 +1,17 @@ -import { createVue } from '../creater'; import CellGroup from 'packages/cell-group'; +import { mount } from 'avoriaz'; -describe('Cell', () => { - let vm; +describe('CellGroup', () => { + let wrapper; afterEach(() => { - vm && vm.destroy(); + wrapper && wrapper.destroy(); }); - it('cell group create', () => { - vm = createVue(CellGroup); - vm.mount(); + it('create', () => { + wrapper = mount(CellGroup, { + propsData: {} + }); - expect(vm.el.classList.contains('zan-cell-group')).to.true; + expect(wrapper.hasClass('zan-cell-group')).to.be.true; }); }); diff --git a/test/unit/specs/checkbox.spec.js b/test/unit/specs/checkbox.spec.js index 10c3d14e1..09ec064f2 100644 --- a/test/unit/specs/checkbox.spec.js +++ b/test/unit/specs/checkbox.spec.js @@ -1,16 +1,17 @@ -import { createVue } from '../creater'; import Checkbox from 'packages/checkbox'; +import { mount } from 'avoriaz'; describe('Checkbox', () => { - let vm; + let wrapper; afterEach(() => { - vm && vm.destroy(); + wrapper && wrapper.destroy(); }); it('create', () => { - vm = createVue(Checkbox); - vm.mount(); + wrapper = mount(Checkbox, { + propsData: {} + }); - expect(vm.el.classList.contains('zan-checkbox')).to.true; + expect(wrapper.hasClass('zan-checkbox')).to.be.true; }); }); diff --git a/test/unit/specs/field.spec.js b/test/unit/specs/field.spec.js index a3a59f879..b3ad69cca 100644 --- a/test/unit/specs/field.spec.js +++ b/test/unit/specs/field.spec.js @@ -1,16 +1,17 @@ -import { createVue } from '../creater'; import Field from 'packages/field'; +import { mount } from 'avoriaz'; describe('Field', () => { - let vm; + let wrapper; afterEach(() => { - vm && vm.destroy(); + wrapper && wrapper.destroy(); }); it('create', () => { - vm = createVue(Field); - vm.mount(); + wrapper = mount(Field, { + propsData: {} + }); - expect(vm.el.classList.contains('zan-field')).to.true; + expect(wrapper.hasClass('zan-field')).to.be.true; }); }); diff --git a/test/unit/specs/loading.spec.js b/test/unit/specs/loading.spec.js new file mode 100644 index 000000000..dfd4bb407 --- /dev/null +++ b/test/unit/specs/loading.spec.js @@ -0,0 +1,67 @@ +import Loading from 'packages/loading'; +import { mount } from 'avoriaz'; + +describe('Loading', () => { + let wrapper; + afterEach(() => { + wrapper && wrapper.destroy(); + }); + + it('create default', () => { + wrapper = mount(Loading); + + expect(wrapper.hasClass('zan-loading')).to.be.true; + }); + + it('create gradient-circle black', () => { + wrapper = mount(Loading, { + propsData: { + type: 'gradient-circle', + color: 'black' + } + }); + const spinner = wrapper.find('.zan-loading__spinner')[0]; + + expect(spinner.hasClass('zan-loading__spinner--gradient-circle')).to.be.true; + expect(spinner.hasClass('zan-loading__spinner--black')).to.be.true; + }); + + it('create gradient-circle white', () => { + wrapper = mount(Loading, { + propsData: { + type: 'gradient-circle', + color: 'white' + } + }); + const spinner = wrapper.find('.zan-loading__spinner')[0]; + + expect(spinner.hasClass('zan-loading__spinner--gradient-circle')).to.be.true; + expect(spinner.hasClass('zan-loading__spinner--white')).to.be.true; + }); + + it('create circle black', () => { + wrapper = mount(Loading, { + propsData: { + type: 'circle', + color: 'black' + } + }); + const spinner = wrapper.find('.zan-loading__spinner')[0]; + + expect(spinner.hasClass('zan-loading__spinner--circle')).to.be.true; + expect(spinner.hasClass('zan-loading__spinner--black')).to.be.true; + }); + + it('create circle white', () => { + wrapper = mount(Loading, { + propsData: { + type: 'circle', + color: 'white' + } + }); + const spinner = wrapper.find('.zan-loading__spinner')[0]; + + expect(spinner.hasClass('zan-loading__spinner--circle')).to.be.true; + expect(spinner.hasClass('zan-loading__spinner--white')).to.be.true; + }); +});