add test and update webpack config
[new] add test config [new] add breadcrumb test [change] update package.json [new] util.js copied from element [unresolved] see test/unit/index.js @todo
This commit is contained in:
parent
c9c5e751ae
commit
9b6ff1ce28
10 changed files with 222 additions and 4 deletions
18
test/unit/index.js
Normal file
18
test/unit/index.js
Normal file
|
@ -0,0 +1,18 @@
|
|||
import Vue from 'vue';
|
||||
Vue.config.productionTip = false;
|
||||
|
||||
// Polyfill fn.bind() for PhantomJS
|
||||
/* eslint-disable no-extend-native */
|
||||
Function.prototype.bind = require('function-bind');
|
||||
|
||||
// require all test files (files that ends with .spec.js)
|
||||
const testsContext = require.context('./specs', true, /\.spec$/);
|
||||
testsContext.keys().forEach(testsContext);
|
||||
|
||||
// require all src files except main.js for coverage.
|
||||
// you can also change this to match only the subset of files that
|
||||
// you want coverage for.
|
||||
// const srcContext = require.context('../../src', true, /^\.\/(?!main(\.js)?$)/);
|
||||
// @todo
|
||||
const srcContext = require.context('../../src/components/breadcrumb', true, /^\.\/(?!styles.*?(\.less)?$)/);
|
||||
srcContext.keys().forEach(srcContext);
|
33
test/unit/karma.conf.js
Normal file
33
test/unit/karma.conf.js
Normal file
|
@ -0,0 +1,33 @@
|
|||
// This is a karma config file. For more details see
|
||||
// http://karma-runner.github.io/0.13/config/configuration-file.html
|
||||
// we are also using it with karma-webpack
|
||||
// https://github.com/webpack/karma-webpack
|
||||
|
||||
var webpackConfig = require('../../build/webpack.test.config.js');
|
||||
|
||||
module.exports = function (config) {
|
||||
config.set({
|
||||
// to run in additional browsers:
|
||||
// 1. install corresponding karma launcher
|
||||
// http://karma-runner.github.io/0.13/config/browsers.html
|
||||
// 2. add it to the `browsers` array below.
|
||||
browsers: ['PhantomJS'],
|
||||
frameworks: ['mocha', 'sinon-chai'],
|
||||
reporters: ['spec', 'coverage'],
|
||||
files: ['./index.js'],
|
||||
preprocessors: {
|
||||
'./index.js': ['webpack', 'sourcemap']
|
||||
},
|
||||
webpack: webpackConfig,
|
||||
webpackMiddleware: {
|
||||
noInfo: true,
|
||||
},
|
||||
coverageReporter: {
|
||||
dir: './coverage',
|
||||
reporters: [
|
||||
{ type: 'lcov', subdir: '.' },
|
||||
{ type: 'text-summary' },
|
||||
]
|
||||
},
|
||||
});
|
||||
};
|
24
test/unit/specs/breadcrumb.spec.js
Normal file
24
test/unit/specs/breadcrumb.spec.js
Normal file
|
@ -0,0 +1,24 @@
|
|||
import { createVue, destroyVM } from '../util';
|
||||
|
||||
describe('Breadcrumb.vue', () => {
|
||||
let vm;
|
||||
afterEach(() => {
|
||||
destroyVM(vm);
|
||||
});
|
||||
it('create', done => {
|
||||
vm = createVue(`
|
||||
<Breadcrumb separator="<b class='demo-breadcrumb-separator'>=></b>">
|
||||
<Breadcrumb-item href="/">Home4</Breadcrumb-item>
|
||||
<Breadcrumb-item href="/components/breadcrumb">Components</Breadcrumb-item>
|
||||
<Breadcrumb-item>Breadcrumb</Breadcrumb-item>
|
||||
</Breadcrumb>
|
||||
`);
|
||||
expect(vm.$el.querySelectorAll('.ivu-breadcrumb-item-link').length).to.equal(3);
|
||||
|
||||
vm.$nextTick(_ => {
|
||||
// console.log(vm.$el.querySelector('.ivu-breadcrumb-item-separator').innerHTML);
|
||||
expect(vm.$el.querySelector('.ivu-breadcrumb-item-separator').innerHTML).to.equal('<b class="demo-breadcrumb-separator">=></b>');
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
85
test/unit/util.js
Normal file
85
test/unit/util.js
Normal file
|
@ -0,0 +1,85 @@
|
|||
import Vue from 'vue';
|
||||
import iView from '../../src/index';
|
||||
|
||||
Vue.use(iView);
|
||||
|
||||
let id = 0;
|
||||
|
||||
const createElm = function() {
|
||||
const elm = document.createElement('div');
|
||||
|
||||
elm.id = 'app' + ++id;
|
||||
document.body.appendChild(elm);
|
||||
|
||||
return elm;
|
||||
};
|
||||
|
||||
/**
|
||||
* 回收 vm
|
||||
* @param {Object} vm
|
||||
*/
|
||||
exports.destroyVM = function(vm) {
|
||||
vm.$el &&
|
||||
vm.$el.parentNode &&
|
||||
vm.$el.parentNode.removeChild(vm.$el);
|
||||
};
|
||||
|
||||
/**
|
||||
* 创建一个 Vue 的实例对象
|
||||
* @param {Object|String} Compo 组件配置,可直接传 template
|
||||
* @param {Boolean=false} mounted 是否添加到 DOM 上
|
||||
* @return {Object} vm
|
||||
*/
|
||||
exports.createVue = function(Compo, mounted = false) {
|
||||
const elm = createElm();
|
||||
|
||||
if (Object.prototype.toString.call(Compo) === '[object String]') {
|
||||
Compo = { template: Compo };
|
||||
}
|
||||
return new Vue(Compo).$mount(mounted === false ? null : elm);
|
||||
};
|
||||
|
||||
/**
|
||||
* 创建一个测试组件实例
|
||||
* @link http://vuejs.org/guide/unit-testing.html#Writing-Testable-Components
|
||||
* @param {Object} Compo - 组件对象
|
||||
* @param {Object} propsData - props 数据
|
||||
* @param {Boolean=false} mounted - 是否添加到 DOM 上
|
||||
* @return {Object} vm
|
||||
*/
|
||||
exports.createTest = function(Compo, propsData = {}, mounted = false) {
|
||||
if (propsData === true || propsData === false) {
|
||||
mounted = propsData;
|
||||
propsData = {};
|
||||
}
|
||||
const elm = createElm();
|
||||
const Ctor = Vue.extend(Compo);
|
||||
return new Ctor({ propsData }).$mount(mounted === false ? null : elm);
|
||||
};
|
||||
|
||||
/**
|
||||
* 触发一个事件
|
||||
* mouseenter, mouseleave, mouseover, keyup, change, click 等
|
||||
* @param {Element} elm
|
||||
* @param {String} name
|
||||
* @param {*} opts
|
||||
*/
|
||||
exports.triggerEvent = function(elm, name, ...opts) {
|
||||
let eventName;
|
||||
|
||||
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);
|
||||
elm.dispatchEvent
|
||||
? elm.dispatchEvent(evt)
|
||||
: elm.fireEvent('on' + name, evt);
|
||||
|
||||
return elm;
|
||||
};
|
Loading…
Add table
Add a link
Reference in a new issue