unit test

.eslintrc.js

@@ -24,7 +24,12 @@ module.exports = {
     'no-extra-boolean-cast': 0,
     'no-new': 0
   },
+  "env": {
+    "mocha": true
+  },
   "globals": {
+    "expect": true,
+    "sinon": true,
     "zanui": true,
     "location": true,
     "Swiper": true,

package.json

@@ -20,7 +20,8 @@
     "builddocs": "webpack --progress --hide-modules --config  build/webpack.config.js && set NODE_ENV=production webpack --progress --hide-modules --config  build/webpack.config.js",
     "clean": "rimraf lib && rimraf packages/*/lib",
     "lint": "eslint src/**/*.js packages/**/*.{js,vue} --quiet",
-    "test": "karma start test/unit/karma.conf.js; npm run coverage",
+    "test": "karma start test/unit/karma.conf.js --single-run; npm run coverage",
+    "test:watch": "karma start test/unit/karma.conf.js",
     "coverage": "find test/unit/coverage/lcov-report -name 'index.html' | sed -n 1,1p  | xargs -I {} open {}  "
   },
   "repository": {

test/unit/creater.js

@@ -5,17 +5,19 @@ let id = 0;
 class Creater {
   constructor(Compo, propsData) {
     let Ctor = Vue.extend(Compo);
-    this.vueInstance = new Ctor({ propsData });
+    this.vue = new Ctor({ propsData });
+    this.el = null;
   }
 
   mount() {
     const elem = exports.createElm();
-    this.vueInstance.$mount(elem);
+    this.vue.$mount(elem);
+    this.el = this.vue.$el;
   }
 
   triggerEvent(name, ...opts) {
     let eventName;
-    let elem = this.vueInstance.$el;
+    let elem = this.el;
 
     if (/^mouse|click/.test(name)) {
       eventName = 'MouseEvents';
@@ -35,9 +37,9 @@ class Creater {
   }
 
   destroy() {
-    this.vueInstance.$el &&
+    this.el &&
-    this.vueInstance.$el.parentNode &&
+    this.el.parentNode &&
-    this.vueInstance.$el.parentNode.removeChild(this.$el);
+    this.el.parentNode.removeChild(this.el);
   }
 }
 

test/unit/get-webpack-conf.js

@@ -1,6 +1,8 @@
 const path = require('path');
 const to2 = require('2webpack2');
+// const webpack = require('webpack');
 const ProgressBarPlugin = require('progress-bar-webpack-plugin');
+const getPostcssPlugin = require('../../build/utils/postcss_pipe');
 
 let webpackConfig = {
   output: {
@@ -12,6 +14,7 @@ let webpackConfig = {
   plugins: [
     new ProgressBarPlugin()
   ],
+  postcss: getPostcssPlugin,
   resolve: {
     extensions: [
       '',
@@ -23,7 +26,6 @@ let webpackConfig = {
       src: path.resolve(process.cwd(), 'src'),
       packages: path.resolve(process.cwd(), 'packages'),
       examples: path.resolve(process.cwd(), 'examples'),
-      'element-ui': path.resolve(process.cwd()),
       vue$: 'vue/dist/vue.common.js'
     }
   },

test/unit/specs/switch.spec.js

@@ -0,0 +1,83 @@
+import Switch from 'packages/switch';
+import { createVue } from '../creater';
+
+describe('Switch', () => {
+  let vm;
+  afterEach(() => {
+    vm && vm.destroy();
+  });
+
+  it('create', () => {
+    vm = createVue(Switch, {
+      checked: true
+    });
+    vm.mount();
+
+    expect(vm.el.classList.contains('zan-switch')).to.true;
+    expect(vm.el.classList.contains('is-on')).to.true;
+  });
+
+  it('create off switch', () => {
+    vm = createVue(Switch, {
+      checked: false
+    });
+    vm.mount();
+
+    expect(vm.el.classList.contains('zan-switch')).to.true;
+  });
+
+  it('switch click default', done => {
+    vm = createVue({
+      data() {
+        return {
+          checked: false
+        };
+      },
+      components: {
+        'zan-switch': Switch
+      },
+      template: `
+        <zan-switch :checked="checked"></zan-switch>
+      `
+    });
+    vm.mount();
+    expect(vm.el.classList.contains('zan-switch')).to.true;
+    expect(vm.el.classList.contains('is-off')).to.true;
+    vm.el.click();
+
+    setTimeout(() => {
+      expect(vm.el.classList.contains('is-off')).to.true;
+      done();
+    });
+  });
+
+  it('switch click', done => {
+    vm = createVue({
+      data() {
+        return {
+          checked: false
+        };
+      },
+      components: {
+        'zan-switch': Switch
+      },
+      template: `
+        <zan-switch :checked="checked" :onChange="handleClick"></zan-switch>
+      `,
+      methods: {
+        handleClick(e) {
+          this.checked = !this.checked;
+        }
+      }
+    });
+    vm.mount();
+    expect(vm.el.classList.contains('zan-switch')).to.true;
+    expect(vm.el.classList.contains('is-off')).to.true;
+    vm.el.click();
+
+    setTimeout(() => {
+      expect(vm.el.classList.contains('is-on')).to.true;
+      done();
+    });
+  });
+});