[Improvement] Rebuild test system (#1051)
This commit is contained in:
neverland
@@ -1,6 +0,0 @@
|
||||
<template>
|
||||
<van-badge-group>
|
||||
<van-badge title="热销榜" info="8" />
|
||||
<van-badge title="手握寿司" info="199" />
|
||||
</van-badge-group>
|
||||
</template>
|
||||
@@ -1,22 +0,0 @@
|
||||
<template>
|
||||
<van-checkbox-group v-model="result" :max="max">
|
||||
<van-checkbox v-for="(item, index) in list" :key="index" :name="item" :disabled="index === 2">复选框{{ item }}</van-checkbox>
|
||||
</van-checkbox-group>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
list: [
|
||||
'a',
|
||||
'b',
|
||||
'c',
|
||||
'd'
|
||||
],
|
||||
result: ['a', 'b'],
|
||||
max: 0
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,21 +0,0 @@
|
||||
<template>
|
||||
<van-collapse v-model="active" :accordion="accordion">
|
||||
<van-collapse-item title="a" name="first">content</van-collapse-item>
|
||||
<van-collapse-item title="b">content</van-collapse-item>
|
||||
<van-collapse-item title="c">content</van-collapse-item>
|
||||
</van-collapse>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
accordion: Boolean
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
active: this.accordion ? '' : []
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,16 +0,0 @@
|
||||
<template>
|
||||
<van-field @click-icon="onIconClick" @blur="$emit('blur')">
|
||||
<div slot="icon">icon</div>
|
||||
</van-field>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
onIconClick: {
|
||||
type: Function,
|
||||
default: () => {}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,16 +0,0 @@
|
||||
<template>
|
||||
<van-goods-action>
|
||||
<van-goods-action-mini-btn icon="chat">
|
||||
客服
|
||||
</van-goods-action-mini-btn>
|
||||
<van-goods-action-mini-btn icon="cart" url="http://www.youzan.com">
|
||||
购物车
|
||||
</van-goods-action-mini-btn>
|
||||
<van-goods-action-big-btn>
|
||||
加入购物车
|
||||
</van-goods-action-big-btn>
|
||||
<van-goods-action-big-btn primary url="http://www.youzan.com">
|
||||
立即购买
|
||||
</van-goods-action-big-btn>
|
||||
</van-goods-action>
|
||||
</template>
|
||||
@@ -1,20 +0,0 @@
|
||||
<template>
|
||||
<van-tabs :active="active">
|
||||
<van-tab title="选项一">内容一</van-tab>
|
||||
<van-tab title="选项二">内容二</van-tab>
|
||||
<van-tab title="选项三">内容三</van-tab>
|
||||
<van-tab title="选项四">内容四</van-tab>
|
||||
<van-tab title="选项五">内容五</van-tab>
|
||||
<van-tab title="选项六">内容六</van-tab>
|
||||
<van-tab title="选项七">内容七</van-tab>
|
||||
<van-tab title="选项八">内容八</van-tab>
|
||||
</van-tabs>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
active: [String, Number]
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,16 +0,0 @@
|
||||
<template>
|
||||
<div class="notice-bar-container" style="width: 100px;">
|
||||
<van-notice-bar :speed="speed" :text="text" :mode="mode" :delay="delay" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
speed: Number,
|
||||
text: String,
|
||||
mode: String,
|
||||
delay: Number
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,13 +0,0 @@
|
||||
<template>
|
||||
<keep-alive>
|
||||
<van-number-keyboard v-if="showKeyboard" />
|
||||
</keep-alive>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
showKeyboard: Boolean
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,16 +0,0 @@
|
||||
<template>
|
||||
<van-radio-group v-model="radio">
|
||||
<van-radio name="1">单选框1</van-radio>
|
||||
<van-radio name="2">单选框2</van-radio>
|
||||
</van-radio-group>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
radio: '1'
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,13 +0,0 @@
|
||||
<template>
|
||||
<van-row gutter="10">
|
||||
<van-col span="8">
|
||||
<div class="gray">span: 8</div>
|
||||
</van-col>
|
||||
<van-col span="8">
|
||||
<div class="gray">span: 8</div>
|
||||
</van-col>
|
||||
<van-col span="8">
|
||||
<div class="gray">span: 8</div>
|
||||
</van-col>
|
||||
</van-row>
|
||||
</template>
|
||||
@@ -1,18 +0,0 @@
|
||||
<template>
|
||||
<van-steps :active="active">
|
||||
<van-step>买家下单</van-step>
|
||||
<van-step>商家接单</van-step>
|
||||
<van-step>买家提货</van-step>
|
||||
<van-step>交易完成</van-step>
|
||||
</van-steps>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
active: 1
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,32 +0,0 @@
|
||||
<template>
|
||||
<van-tabbar v-model="active" @change="onChange">
|
||||
<van-tabbar-item icon="shop">
|
||||
<span>自定义</span>
|
||||
<img slot="icon" :src="active === 0 ? icon.active : icon.normal" >
|
||||
</van-tabbar-item>
|
||||
<van-tabbar-item icon="chat">标签</van-tabbar-item>
|
||||
<van-tabbar-item icon="chat">标签</van-tabbar-item>
|
||||
<van-tabbar-item icon="records">标签</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
active: 0,
|
||||
changeRecord: 0,
|
||||
icon: {
|
||||
normal: 'https://img.yzcdn.cn/public_files/2017/10/13/c547715be149dd3faa817e4a948b40c4.png',
|
||||
active: 'https://img.yzcdn.cn/public_files/2017/10/13/793c77793db8641c4c325b7f25bf130d.png'
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
onChange(val) {
|
||||
this.changeRecord = val;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,38 +0,0 @@
|
||||
<template>
|
||||
<van-tabs
|
||||
:active="active"
|
||||
:duration="duration"
|
||||
:sticky="sticky"
|
||||
:swipeable="swipeable"
|
||||
@click="$emit('click')"
|
||||
@disabled="$emit('disabled')"
|
||||
>
|
||||
<van-tab :title="firstTabTitle" :disabled="firstTabDisabled">内容一</van-tab>
|
||||
<van-tab title="选项二">内容二</van-tab>
|
||||
<van-tab title="选项三" disabled>内容三</van-tab>
|
||||
<van-tab title="选项四">内容四</van-tab>
|
||||
</van-tabs>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
firstTabTitle: {
|
||||
type: String,
|
||||
default: '选项一'
|
||||
},
|
||||
firstTabDisabled: {
|
||||
type: Boolean
|
||||
},
|
||||
sticky: Boolean,
|
||||
swipeable: Boolean
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
active: 0,
|
||||
duration: 0.5
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,45 +0,0 @@
|
||||
<template>
|
||||
<div
|
||||
v-waterfall-lower="triggerWaterfallLower"
|
||||
waterfall-disabled="disabled"
|
||||
class="waterfall--hidden"
|
||||
>
|
||||
<div
|
||||
v-for="item in list"
|
||||
class="waterfall-item"
|
||||
>{{ item.id }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Waterfall from 'packages/waterfall';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
disabled: Boolean,
|
||||
list: Array,
|
||||
onWaterfallLower: {
|
||||
type: Function,
|
||||
default() {
|
||||
return function() {};
|
||||
}
|
||||
}
|
||||
},
|
||||
directives: {
|
||||
WaterfallLower: Waterfall('lower')
|
||||
},
|
||||
methods: {
|
||||
triggerWaterfallLower() {
|
||||
this.onWaterfallLower();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.waterfall--hidden {
|
||||
overflow: scroll;
|
||||
height: 100px;
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
@@ -1,47 +0,0 @@
|
||||
<template>
|
||||
<div
|
||||
v-waterfall-lower="triggerWaterfallLower"
|
||||
v-waterfall-upper="triggerWaterfallUpper"
|
||||
waterfall-disabled="disabled"
|
||||
>
|
||||
<div
|
||||
v-for="item in list"
|
||||
class="waterfall-item"
|
||||
>{{ item.id }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Waterfall from 'packages/waterfall';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
disabled: Boolean,
|
||||
list: Array,
|
||||
onWaterfallLower: {
|
||||
type: Function,
|
||||
default() {
|
||||
return function() {};
|
||||
}
|
||||
},
|
||||
onWaterfallUpper: {
|
||||
type: Function,
|
||||
default() {
|
||||
return function() {};
|
||||
}
|
||||
}
|
||||
},
|
||||
directives: {
|
||||
WaterfallLower: Waterfall('lower'),
|
||||
WaterfallUpper: Waterfall('upper')
|
||||
},
|
||||
methods: {
|
||||
triggerWaterfallLower() {
|
||||
this.onWaterfallLower();
|
||||
},
|
||||
triggerWaterfallUpper() {
|
||||
this.onWaterfallUpper();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,34 @@
|
||||
import { renderToString } from '@vue/server-test-utils';
|
||||
import '../docs/demos/common';
|
||||
import { Locale } from '../packages';
|
||||
import { camelize } from '../packages/utils';
|
||||
import Vue from 'vue';
|
||||
|
||||
const empty = {
|
||||
template: '<div><slot></slot></div>',
|
||||
inheritAttrs: false
|
||||
};
|
||||
Vue.component('demo-block', empty);
|
||||
Vue.component('demo-section', empty);
|
||||
|
||||
export default function(component) {
|
||||
const name = typeof component === 'string' ? component : component.name.replace('van-', '');
|
||||
|
||||
test(`renders ${name} correctly`, () => {
|
||||
const demo = require(`../docs/demos/views/${name}.vue`).default;
|
||||
const { i18n } = demo;
|
||||
demo.name = 'demo-' + name;
|
||||
|
||||
if (i18n) {
|
||||
const formattedI18n = {};
|
||||
const camelizedName = camelize(demo.name);
|
||||
Object.keys(i18n).forEach(key => {
|
||||
formattedI18n[key] = { [camelizedName]: i18n[key] };
|
||||
});
|
||||
Locale.add(formattedI18n);
|
||||
}
|
||||
|
||||
const wrapper = renderToString(demo);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
}
|
||||
@@ -1,72 +0,0 @@
|
||||
const path = require('path');
|
||||
const webpack = require('webpack');
|
||||
const ProgressBarPlugin = require('progress-bar-webpack-plugin');
|
||||
const { VueLoaderPlugin } = require('vue-loader');
|
||||
const webpackDevConfig = require('../build/webpack.dev');
|
||||
|
||||
function getWebpackConfig(testFileName) {
|
||||
return {
|
||||
mode: 'development',
|
||||
output: {
|
||||
path: path.resolve(process.cwd(), 'dist'),
|
||||
publicPath: '/dist/',
|
||||
filename: '[name].js',
|
||||
chunkFilename: '[id].js',
|
||||
libraryTarget: 'umd'
|
||||
},
|
||||
resolve: webpackDevConfig.resolve,
|
||||
plugins: [
|
||||
new VueLoaderPlugin(),
|
||||
new ProgressBarPlugin(),
|
||||
new webpack.DefinePlugin({
|
||||
'process.env': {
|
||||
TEST_FILE: `"${testFileName}"`
|
||||
}
|
||||
})
|
||||
],
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.js$/,
|
||||
exclude: /node_modules|test|mock|swipe|locale|waterfall/,
|
||||
use: [
|
||||
{
|
||||
loader: 'istanbul-instrumenter-loader',
|
||||
options: { esModules: true }
|
||||
},
|
||||
'babel-loader'
|
||||
]
|
||||
},
|
||||
{
|
||||
test: /\.js$/,
|
||||
exclude: /node_modules/,
|
||||
use: [
|
||||
'babel-loader'
|
||||
]
|
||||
},
|
||||
{
|
||||
test: /\.(css|postcss)$/,
|
||||
use: ['style-loader', 'css-loader', {
|
||||
loader: 'postcss-loader',
|
||||
options: { sourceMap: true }
|
||||
}]
|
||||
},
|
||||
{
|
||||
test: /\.vue$/,
|
||||
use: [
|
||||
{
|
||||
loader: 'vue-loader',
|
||||
options: {
|
||||
compilerOptions: {
|
||||
preserveWhitespace: false
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
module.exports = getWebpackConfig;
|
||||
@@ -1,20 +0,0 @@
|
||||
import Vue from 'vue';
|
||||
import Vant from 'packages';
|
||||
require('packages/vant-css/src/index.css');
|
||||
|
||||
Vue.use(Vant);
|
||||
|
||||
// hack for test touch event
|
||||
window.ontouchstart = {};
|
||||
|
||||
// 读取配置文件，判断运行单个测试文件还是所有测试文件
|
||||
const testsReq = require.context('./specs', true, /\.spec$/);
|
||||
if (process.env.TEST_FILE) {
|
||||
testsReq.keys().forEach((file) => {
|
||||
if (file.indexOf(process.env.TEST_FILE) !== -1) {
|
||||
testsReq(file);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
testsReq.keys().forEach(testsReq);
|
||||
}
|
||||
@@ -1,27 +0,0 @@
|
||||
const getWebpackConfig = require('./get-webpack-conf');
|
||||
|
||||
module.exports = function(config) {
|
||||
config.set({
|
||||
browsers: ['ChromeHeadless'],
|
||||
frameworks: ['mocha', 'sinon-chai'],
|
||||
reporters: ['spec', 'coverage'],
|
||||
files: ['./index.js'],
|
||||
preprocessors: {
|
||||
'./index.js': ['webpack']
|
||||
},
|
||||
webpack: getWebpackConfig(getTestFileName()),
|
||||
coverageReporter: {
|
||||
dir: './coverage',
|
||||
reporters: [
|
||||
{ type: 'lcov', subdir: '.' },
|
||||
{ type: 'text-summary' }
|
||||
]
|
||||
},
|
||||
singleRun: false
|
||||
});
|
||||
};
|
||||
|
||||
function getTestFileName() {
|
||||
const flagIndex = process.argv.indexOf('--file');
|
||||
return flagIndex !== -1 ? process.argv[flagIndex + 1] : '';
|
||||
}
|
||||
@@ -1,21 +0,0 @@
|
||||
/**
|
||||
* 运行单个测试文件
|
||||
*/
|
||||
|
||||
const fs = require('fs');
|
||||
const inquirer = require('inquirer');
|
||||
const path = require('path');
|
||||
const shell = require('shelljs');
|
||||
const files = fs.readdirSync(path.resolve(__dirname, './specs'));
|
||||
|
||||
inquirer.prompt([{
|
||||
type: 'list',
|
||||
name: 'select',
|
||||
message: '请选择要运行的测试文件：',
|
||||
choices: files
|
||||
}]).then(result => {
|
||||
const file = result.select.replace('.spec.js', '');
|
||||
shell.exec('karma start test/karma.conf.js --color alway --file ' + file);
|
||||
}).catch(error => {
|
||||
console.log(error);
|
||||
});
|
||||
@@ -1,147 +0,0 @@
|
||||
import ActionSheet from 'packages/actionsheet';
|
||||
import { mount } from 'avoriaz';
|
||||
import { DOMChecker } from '../utils';
|
||||
|
||||
describe('ActionSheet', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a actionsheet', () => {
|
||||
wrapper = mount(ActionSheet, {
|
||||
propsData: {}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-actionsheet')).to.be.true;
|
||||
expect(wrapper.instance().actions.length).to.equal(0);
|
||||
expect(wrapper.instance().overlay).to.be.true;
|
||||
expect(wrapper.instance().closeOnClickOverlay).to.be.true;
|
||||
});
|
||||
|
||||
it('create displayed actionsheet', () => {
|
||||
wrapper = mount(ActionSheet, {
|
||||
propsData: {
|
||||
value: true
|
||||
}
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
noStyle: {
|
||||
'.van-actionsheet': {
|
||||
display: 'none'
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('create title type actionsheet', () => {
|
||||
wrapper = mount(ActionSheet, {
|
||||
propsData: {
|
||||
title: 'test'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-actionsheet--withtitle')).to.be.true;
|
||||
expect(wrapper.contains('.van-actionsheet__header')).to.be.true;
|
||||
expect(wrapper.contains('.van-actionsheet__content')).to.be.true;
|
||||
});
|
||||
|
||||
it('create actions actionsheet', () => {
|
||||
wrapper = mount(ActionSheet, {
|
||||
propsData: {
|
||||
actions: [
|
||||
{
|
||||
name: '有赞E卡',
|
||||
subname: '（剩余260.50元）'
|
||||
},
|
||||
{
|
||||
name: '信用卡支付',
|
||||
loading: true
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
const actionItems = wrapper.find('.van-actionsheet__item');
|
||||
|
||||
expect(actionItems.length).to.equal(2);
|
||||
expect(actionItems[0].contains('.van-actionsheet__name')).to.be.true;
|
||||
expect(actionItems[0].contains('.van-actionsheet__subname')).to.be.true;
|
||||
expect(actionItems[1].contains('.van-actionsheet__loading')).to.be.true;
|
||||
});
|
||||
|
||||
it('handle actionsheet item click with callback', () => {
|
||||
let called = false;
|
||||
wrapper = mount(ActionSheet, {
|
||||
propsData: {
|
||||
actions: [
|
||||
{
|
||||
name: '有赞E卡',
|
||||
callback: () => {
|
||||
called = true;
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '微信'
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
const actionItem = wrapper.find('.van-actionsheet__item')[0];
|
||||
actionItem.trigger('click');
|
||||
expect(called).to.be.true;
|
||||
|
||||
const secondActionItem = wrapper.find('.van-actionsheet__item')[1];
|
||||
secondActionItem.trigger('click');
|
||||
});
|
||||
|
||||
it('create actionsheet with cancel button', () => {
|
||||
wrapper = mount(ActionSheet, {
|
||||
propsData: {
|
||||
cancelText: 'cancel'
|
||||
}
|
||||
});
|
||||
|
||||
const cancelButton = wrapper.find('.van-actionsheet__cancel')[0];
|
||||
expect(wrapper.contains('.van-actionsheet__cancel')).to.be.true;
|
||||
expect(cancelButton.text()).to.equal('cancel');
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
cancelButton.trigger('click');
|
||||
|
||||
expect(eventStub.calledWith('cancel'));
|
||||
});
|
||||
|
||||
it('toggle actionsheet value from v-model', (done) => {
|
||||
wrapper = mount(ActionSheet, {
|
||||
propsData: {
|
||||
value: false
|
||||
}
|
||||
});
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
DOMChecker(wrapper, {
|
||||
style: {
|
||||
'.van-actionsheet': {
|
||||
display: 'none'
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.value = true;
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
DOMChecker(wrapper, {
|
||||
noStyle: {
|
||||
'.van-actionsheet': {
|
||||
display: 'none'
|
||||
}
|
||||
}
|
||||
});
|
||||
expect(eventStub.calledWith('input'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1,423 +0,0 @@
|
||||
import { mount } from 'avoriaz';
|
||||
import AddressEdit from 'packages/address-edit';
|
||||
import AddressDetail from 'packages/address-edit/Detail';
|
||||
import areaList from '../../docs/demos/mock/area';
|
||||
|
||||
describe('AddressEdit', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a AddressEdit', () => {
|
||||
wrapper = mount(AddressEdit);
|
||||
expect(wrapper.hasClass('van-address-edit')).to.be.true;
|
||||
expect(wrapper.find('.van-field__control')[0].element.value).to.equal('');
|
||||
expect(wrapper.find('.van-field__control')[1].element.value).to.equal('');
|
||||
expect(wrapper.find('.van-field__control')[2].element.value).to.equal('');
|
||||
expect(
|
||||
wrapper.find('.van-address-edit__area .van-cell__value span')[0].text()
|
||||
).to.equal('选择省份');
|
||||
expect(
|
||||
wrapper.find('.van-address-edit__area .van-cell__value span')[1].text()
|
||||
).to.equal('选择城市');
|
||||
expect(
|
||||
wrapper.find('.van-address-edit__area .van-cell__value span')[2].text()
|
||||
).to.equal('选择地区');
|
||||
});
|
||||
|
||||
it('create a AddressEdit with props', () => {
|
||||
const addressInfo = {
|
||||
name: '测试',
|
||||
tel: '123123213',
|
||||
province: '浙江省',
|
||||
city: '杭州市',
|
||||
county: '西湖区',
|
||||
address_detail: '详细地址',
|
||||
postal_code: '10000',
|
||||
is_default: true
|
||||
};
|
||||
|
||||
wrapper = mount(AddressEdit, {
|
||||
propsData: {
|
||||
areaList,
|
||||
addressInfo: addressInfo,
|
||||
showPostal: true,
|
||||
showSetDefault: true,
|
||||
showSearchResult: true,
|
||||
searchResult: []
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.find('.van-field__control')[0].element.value).to.equal(
|
||||
addressInfo.name
|
||||
);
|
||||
expect(wrapper.find('.van-field__control')[1].element.value).to.equal(
|
||||
addressInfo.tel
|
||||
);
|
||||
expect(wrapper.find('.van-field__control')[2].element.value).to.equal(
|
||||
addressInfo.address_detail
|
||||
);
|
||||
expect(wrapper.find('.van-field__control')[3].element.value).to.equal(
|
||||
addressInfo.postal_code
|
||||
);
|
||||
expect(
|
||||
wrapper.find('.van-address-edit__area .van-cell__value span')[0].text()
|
||||
).to.equal(addressInfo.province);
|
||||
expect(
|
||||
wrapper.find('.van-address-edit__area .van-cell__value span')[1].text()
|
||||
).to.equal(addressInfo.city);
|
||||
expect(
|
||||
wrapper.find('.van-address-edit__area .van-cell__value span')[2].text()
|
||||
).to.equal(addressInfo.county);
|
||||
expect(wrapper.find('.van-switch-cell').length).to.equal(1);
|
||||
});
|
||||
|
||||
it('save AddressInfo', () => {
|
||||
const addressInfo = {
|
||||
name: '',
|
||||
tel: '123123213',
|
||||
province: '浙江省',
|
||||
city: '杭州市',
|
||||
county: '西湖区',
|
||||
address_detail: '详细地址',
|
||||
postal_code: '10000',
|
||||
is_default: true
|
||||
};
|
||||
|
||||
wrapper = mount(AddressEdit, {
|
||||
propsData: {
|
||||
areaList,
|
||||
addressInfo: addressInfo,
|
||||
showPostal: true,
|
||||
showSetDefault: true,
|
||||
showSearchResult: true,
|
||||
searchResult: []
|
||||
}
|
||||
});
|
||||
|
||||
const saveButton = wrapper.find('.van-button')[0];
|
||||
|
||||
// name empty
|
||||
wrapper.vm.data.name = '';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['name']).to.be.true;
|
||||
wrapper.find('.van-field__control')[0].trigger('focus');
|
||||
expect(wrapper.vm.errorInfo['name']).to.be.false;
|
||||
|
||||
// name too long
|
||||
wrapper.vm.data.name = '111111111111111111111111111';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['name']).to.be.true;
|
||||
wrapper.find('.van-field__control')[0].trigger('focus');
|
||||
expect(wrapper.vm.errorInfo['name']).to.be.false;
|
||||
|
||||
// tel empty
|
||||
wrapper.vm.data.name = '123';
|
||||
wrapper.vm.data.tel = '';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['tel']).to.be.true;
|
||||
wrapper.find('.van-field__control')[1].trigger('focus');
|
||||
expect(wrapper.vm.errorInfo['tel']).to.be.false;
|
||||
|
||||
// area_code empty
|
||||
wrapper.vm.data.tel = '13000000000';
|
||||
wrapper.vm.data.area_code = '';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['area_code']).to.be.true;
|
||||
|
||||
// area_code invalid
|
||||
wrapper.vm.data.tel = '13000000000';
|
||||
wrapper.vm.data.area_code = '-1';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['area_code']).to.be.true;
|
||||
|
||||
// address_detail empty
|
||||
wrapper.vm.data.area_code = '100000';
|
||||
wrapper.vm.data.address_detail = '';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['address_detail']).to.be.true;
|
||||
wrapper.find('.van-field__control')[2].trigger('focus');
|
||||
expect(wrapper.vm.errorInfo['address_detail']).to.be.false;
|
||||
|
||||
// address_detail too long
|
||||
let longAddress = '1';
|
||||
for (let i = 0; i < 300; i++) {
|
||||
longAddress += '1';
|
||||
}
|
||||
wrapper.vm.data.address_detail = longAddress;
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['address_detail']).to.be.true;
|
||||
wrapper.find('.van-field__control')[2].trigger('focus');
|
||||
expect(wrapper.vm.errorInfo['address_detail']).to.be.false;
|
||||
|
||||
// postal_code invalid
|
||||
wrapper.vm.data.address_detail = '123';
|
||||
wrapper.vm.data.postal_code = '123';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['postal_code']).to.be.true;
|
||||
wrapper.find('.van-field__control')[3].trigger('focus');
|
||||
expect(wrapper.vm.errorInfo['postal_code']).to.be.false;
|
||||
|
||||
// valid result
|
||||
wrapper.vm.data.postal_code = '123456';
|
||||
saveButton.trigger('click');
|
||||
|
||||
// not show postal_code
|
||||
wrapper.vm.data.postal_code = '156';
|
||||
wrapper.vm.showPostal = false;
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['postal_code']).to.be.false;
|
||||
});
|
||||
|
||||
it('show search result', done => {
|
||||
wrapper = mount(AddressEdit, {
|
||||
propsData: {
|
||||
addressInfo: {},
|
||||
showSearchResult: true,
|
||||
searchResult: [
|
||||
{
|
||||
name: '黄龙万科中心',
|
||||
address: '杭州市西湖区'
|
||||
},
|
||||
{
|
||||
name: '黄龙万科中心H座'
|
||||
},
|
||||
{
|
||||
address: '杭州市西湖区'
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.find('.van-field__control')[2].trigger('focus');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
const items = wrapper.find('.van-icon-location');
|
||||
expect(items.length).to.equal(3);
|
||||
|
||||
items[0].element.parentNode.click();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-field__control')[2].element.value).to.equal(
|
||||
'杭州市西湖区 黄龙万科中心'
|
||||
);
|
||||
|
||||
items[1].element.parentNode.click();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-field__control')[2].element.value).to.equal(
|
||||
'黄龙万科中心H座'
|
||||
);
|
||||
items[2].element.parentNode.click();
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(
|
||||
wrapper.find('.van-field__control')[2].element.value
|
||||
).to.equal('杭州市西湖区');
|
||||
|
||||
wrapper.find('.van-field__control')[2].trigger('blur');
|
||||
setTimeout(() => {
|
||||
done();
|
||||
}, 300);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('select area', () => {
|
||||
wrapper = mount(AddressEdit, {
|
||||
propsData: {
|
||||
areaList,
|
||||
addressInfo: {}
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.onAreaConfirm([]);
|
||||
wrapper.vm.onAreaConfirm([{ code: -1 }]);
|
||||
wrapper.vm.onAreaConfirm([{ code: 1 }, { code: -1 }]);
|
||||
wrapper.vm.onAreaConfirm([{ code: 1 }, { code: 1 }, { code: -1 }]);
|
||||
expect(wrapper.vm.data['area_code']).to.equal('');
|
||||
|
||||
wrapper.vm.onAreaConfirm([
|
||||
{ name: '浙江省' },
|
||||
{ name: '杭州市' },
|
||||
{ name: '西湖区', code: '123456' }
|
||||
]);
|
||||
expect(wrapper.vm.data['province']).to.equal('浙江省');
|
||||
expect(wrapper.vm.data['city']).to.equal('杭州市');
|
||||
expect(wrapper.vm.data['county']).to.equal('西湖区');
|
||||
expect(wrapper.vm.data['area_code']).to.equal('123456');
|
||||
});
|
||||
|
||||
it('delete address', done => {
|
||||
wrapper = mount(AddressEdit, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
areaList,
|
||||
isDeleting: true,
|
||||
addressInfo: {
|
||||
id: '123'
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const deleteButton = wrapper.find('.van-button')[1];
|
||||
deleteButton.trigger('click');
|
||||
wrapper.vm.onDelete();
|
||||
|
||||
setTimeout(() => {
|
||||
wrapper.vm.isDeleting = false;
|
||||
wrapper.vm.$nextTick(() => {
|
||||
deleteButton.trigger('click');
|
||||
setTimeout(() => {
|
||||
expect(document.querySelectorAll('.van-dialog').length).to.equal(1);
|
||||
|
||||
wrapper.vm.$on('delete', () => {
|
||||
done();
|
||||
});
|
||||
document.querySelector('.van-dialog__confirm').click();
|
||||
}, 300);
|
||||
});
|
||||
}, 300);
|
||||
});
|
||||
|
||||
it('on change detail', done => {
|
||||
wrapper = mount(AddressEdit);
|
||||
|
||||
wrapper.vm.$on('change-detail', val => {
|
||||
expect(val).to.equal('123');
|
||||
done();
|
||||
});
|
||||
|
||||
const field = wrapper.find('.van-field__control')[2];
|
||||
field.element.value = '123';
|
||||
field.trigger('input');
|
||||
});
|
||||
|
||||
it('clear address detail in ios', done => {
|
||||
wrapper = mount(AddressEdit, {
|
||||
propsData: {
|
||||
addressInfo: {
|
||||
address_detail: '123'
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.isAndroid = false;
|
||||
wrapper.find('.van-field__control')[2].trigger('focus');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
wrapper.find('.van-field__icon')[0].trigger('touchstart');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.data.address_detail).to.equal('');
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('finish edit address detail in android', done => {
|
||||
wrapper = mount(AddressDetail, {
|
||||
propsData: {
|
||||
value: '123'
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$on('input', val => {
|
||||
wrapper.vm.value = val;
|
||||
});
|
||||
|
||||
wrapper.setData({
|
||||
isAndroid: true
|
||||
});
|
||||
wrapper.find('.van-field__control')[0].trigger('focus');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
wrapper.find('.van-field__icon')[0].trigger('touchstart');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.value).to.equal('123');
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('watch address info', done => {
|
||||
const addressInfo = {
|
||||
name: '123'
|
||||
};
|
||||
|
||||
wrapper = mount(AddressEdit, {
|
||||
propsData: {
|
||||
addressInfo: {}
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.setProps({ addressInfo });
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.data.name).to.equal('123');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('set/get area code', done => {
|
||||
wrapper = mount(AddressEdit, {
|
||||
propsData: {
|
||||
areaList,
|
||||
addressInfo: {
|
||||
area_code: ''
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.vm.getArea()).to.eql([
|
||||
{ code: '-1', name: '选择省份' },
|
||||
{ code: '-1', name: '选择城市' },
|
||||
{ code: '-1', name: '选择地区' }
|
||||
]);
|
||||
|
||||
wrapper.vm.setAreaCode('110101');
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.data.area_code).to.eql('110101');
|
||||
expect(wrapper.vm.getArea()).to.eql([
|
||||
{ code: '110000', name: '北京市' },
|
||||
{ code: '110100', name: '北京市' },
|
||||
{ code: '110101', name: '东城区' }
|
||||
]);
|
||||
|
||||
wrapper.vm.$refs = [];
|
||||
wrapper.vm.setAreaCode('110102');
|
||||
expect(wrapper.vm.getArea()).to.eql([]);
|
||||
done();
|
||||
}, 50);
|
||||
});
|
||||
|
||||
it('watch area code', done => {
|
||||
wrapper = mount(AddressEdit, {
|
||||
propsData: {
|
||||
areaList: {},
|
||||
addressInfo: {
|
||||
area_code: '330304'
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.vm.data.city).to.equal('');
|
||||
wrapper.vm.areaList = areaList;
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.data.city).to.equal('温州市');
|
||||
|
||||
wrapper.vm.addressInfo = { area_code: '' };
|
||||
wrapper.vm.areaList = {};
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.data.city).to.equal('');
|
||||
wrapper.vm.areaList = areaList;
|
||||
wrapper.vm.addressInfo = { area_code: '330304' };
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.data.city).to.equal('温州市');
|
||||
done();
|
||||
}, 50);
|
||||
});
|
||||
}, 50);
|
||||
});
|
||||
});
|
||||
@@ -1,80 +0,0 @@
|
||||
import { mount } from 'avoriaz';
|
||||
import AddressList from 'packages/address-list';
|
||||
|
||||
const list = [
|
||||
{
|
||||
id: '1',
|
||||
name: '张三',
|
||||
tel: '13000000000',
|
||||
address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室'
|
||||
},
|
||||
{
|
||||
id: '2',
|
||||
name: '李四',
|
||||
tel: '1310000000',
|
||||
address: '浙江省杭州市拱墅区莫干山路 50 号'
|
||||
},
|
||||
{
|
||||
id: '3',
|
||||
name: '王五',
|
||||
tel: '1320000000',
|
||||
address: '浙江省杭州市滨江区江南大道 15 号'
|
||||
}
|
||||
];
|
||||
|
||||
describe('AddressList', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a AddressList', () => {
|
||||
wrapper = mount(AddressList);
|
||||
expect(wrapper.hasClass('van-address-list')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a AddressList with three items', () => {
|
||||
wrapper = mount(AddressList, {
|
||||
propsData: {
|
||||
value: '1',
|
||||
list
|
||||
}
|
||||
});
|
||||
expect(wrapper.find('.van-address-list__group .van-cell').length).to.equal(3);
|
||||
expect(wrapper.find('.van-icon-checked').length).to.equal(1);
|
||||
});
|
||||
|
||||
it('listen to add & edit event', (done) => {
|
||||
wrapper = mount(AddressList, {
|
||||
propsData: {
|
||||
list
|
||||
}
|
||||
});
|
||||
|
||||
const add = sinon.spy();
|
||||
wrapper.vm.$on('add', add);
|
||||
wrapper.find('.van-address-list__add')[0].trigger('click');
|
||||
expect(add.calledOnce).to.be.true;
|
||||
|
||||
wrapper.vm.$on('edit', (item, index) => {
|
||||
expect(index).to.equal(0);
|
||||
done();
|
||||
});
|
||||
wrapper.find('.van-address-list__edit')[0].trigger('click');
|
||||
});
|
||||
|
||||
it('listen to select event', (done) => {
|
||||
wrapper = mount(AddressList, {
|
||||
propsData: {
|
||||
value: '1',
|
||||
list
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$on('select', (item, index) => {
|
||||
expect(item.id).to.equal('3');
|
||||
done();
|
||||
});
|
||||
wrapper.find('.van-radio')[2].trigger('click');
|
||||
});
|
||||
});
|
||||
@@ -1,153 +0,0 @@
|
||||
import Area from 'packages/area';
|
||||
import { mount } from 'avoriaz';
|
||||
import areaList from '../../docs/demos/mock/area';
|
||||
|
||||
describe('Area', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create an area', () => {
|
||||
wrapper = mount(Area, {
|
||||
propsData: {
|
||||
areaList: areaList
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-area')).to.be.true;
|
||||
});
|
||||
|
||||
it('create an area with default value', done => {
|
||||
wrapper = mount(Area, {
|
||||
propsData: {
|
||||
areaList: areaList,
|
||||
value: '110101'
|
||||
}
|
||||
});
|
||||
|
||||
const confirmBtn = wrapper.find('.van-picker__confirm')[0];
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
|
||||
confirmBtn.trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('confirm'));
|
||||
expect(wrapper.vm.$refs.picker.getColumnValue(2).code).to.equal('110101');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('create an area and set value', done => {
|
||||
wrapper = mount(Area, {
|
||||
propsData: {
|
||||
areaList: areaList,
|
||||
value: '110101'
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.$refs.picker.getColumnValue(2).code).to.equal('110101');
|
||||
wrapper.setProps({
|
||||
value: '110102'
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.$refs.picker.getColumnValue(2).code).to.equal('110102');
|
||||
done();
|
||||
}, 50);
|
||||
}, 50);
|
||||
});
|
||||
|
||||
it('create an area with invalid areaList', () => {
|
||||
wrapper = mount(Area, {
|
||||
propsData: {
|
||||
areaList: null
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.vm.columns.length).to.equal(0);
|
||||
});
|
||||
|
||||
it('create an area with columnsNum equal 2', () => {
|
||||
wrapper = mount(Area, {
|
||||
propsData: {
|
||||
areaList: areaList,
|
||||
columnsNum: 2
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.vm.columns.length).to.equal(2);
|
||||
});
|
||||
|
||||
it('create an area with columnsNum equal 1', () => {
|
||||
wrapper = mount(Area, {
|
||||
propsData: {
|
||||
areaList: areaList,
|
||||
columnsNum: 1
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.vm.columns.length).to.equal(1);
|
||||
});
|
||||
|
||||
it('create an area and click cancel', done => {
|
||||
wrapper = mount(Area, {
|
||||
propsData: {
|
||||
areaList: areaList
|
||||
}
|
||||
});
|
||||
|
||||
const cancelBtn = wrapper.find('.van-picker__cancel')[0];
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
|
||||
cancelBtn.trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('cancel'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('onChange method', () => {
|
||||
wrapper = mount(Area, {
|
||||
propsData: {
|
||||
areaList: areaList
|
||||
}
|
||||
});
|
||||
|
||||
let list = [];
|
||||
const setColumnValues = (index, arr) => {
|
||||
list = [...list, ...arr];
|
||||
};
|
||||
const code = { code: '110101' };
|
||||
|
||||
wrapper.vm.onChange({ setColumnValues }, [code], 0);
|
||||
wrapper.vm.onChange({ setColumnValues }, [code, code], 1);
|
||||
|
||||
expect(list.length).to.equal(33);
|
||||
});
|
||||
|
||||
it('getValues method', done => {
|
||||
wrapper = mount(Area, {
|
||||
propsData: {
|
||||
value: '110101',
|
||||
areaList: areaList
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.getValues()).to.eql([
|
||||
{ code: '110000', name: '北京市' },
|
||||
{ code: '110100', name: '北京市' },
|
||||
{ code: '110101', name: '东城区' }
|
||||
]);
|
||||
|
||||
setTimeout(() => {
|
||||
wrapper.vm.$refs = [];
|
||||
expect(wrapper.vm.getValues()).to.eql([]);
|
||||
done();
|
||||
}, 50);
|
||||
}, 50);
|
||||
});
|
||||
});
|
||||
@@ -1,29 +0,0 @@
|
||||
import { mount } from 'avoriaz';
|
||||
import BadgeTestComponent from '../components/badge';
|
||||
|
||||
describe('BadgeGroup', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a badge-group', () => {
|
||||
wrapper = mount(BadgeTestComponent);
|
||||
|
||||
expect(wrapper.hasClass('van-badge-group')).to.be.true;
|
||||
|
||||
expect(wrapper.vNode.child.activeKey).to.equal(0);
|
||||
expect(wrapper.vNode.child.badges.length).to.equal(2);
|
||||
});
|
||||
|
||||
it('emit a click event when click badge', () => {
|
||||
wrapper = mount(BadgeTestComponent);
|
||||
|
||||
const badge = wrapper.find('.van-badge')[0];
|
||||
const eventStub = sinon.stub(badge.vNode.child, '$emit');
|
||||
badge.trigger('click');
|
||||
|
||||
expect(eventStub.calledWith('click')).to.be.true;
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,150 +0,0 @@
|
||||
import Button from 'packages/button';
|
||||
import VanLoading from 'packages/loading';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('Button', () => {
|
||||
let wrapper;
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a simple button', () => {
|
||||
wrapper = mount(Button);
|
||||
|
||||
expect(wrapper.hasClass('van-button')).to.be.true;
|
||||
expect(wrapper.hasClass('van-button--default')).to.be.true;
|
||||
expect(wrapper.hasClass('van-button--normal')).to.be.true;
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
wrapper.trigger('click');
|
||||
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('click')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a primary button', () => {
|
||||
wrapper = mount(Button, {
|
||||
propsData: {
|
||||
type: 'primary'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-button')).to.be.true;
|
||||
expect(wrapper.hasClass('van-button--primary')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a danger button', () => {
|
||||
wrapper = mount(Button, {
|
||||
propsData: {
|
||||
type: 'danger'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-button')).to.be.true;
|
||||
expect(wrapper.hasClass('van-button--danger')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a large button', () => {
|
||||
wrapper = mount(Button, {
|
||||
propsData: {
|
||||
size: 'large'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-button')).to.be.true;
|
||||
expect(wrapper.hasClass('van-button--large')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a small button', () => {
|
||||
wrapper = mount(Button, {
|
||||
propsData: {
|
||||
size: 'small'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-button')).to.be.true;
|
||||
expect(wrapper.hasClass('van-button--small')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a mini button', () => {
|
||||
wrapper = mount(Button, {
|
||||
propsData: {
|
||||
size: 'mini'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-button')).to.be.true;
|
||||
expect(wrapper.hasClass('van-button--mini')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a block button', () => {
|
||||
wrapper = mount(Button, {
|
||||
propsData: {
|
||||
block: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-button')).to.be.true;
|
||||
expect(wrapper.hasClass('van-button--block')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a bottom action button', () => {
|
||||
wrapper = mount(Button, {
|
||||
propsData: {
|
||||
bottomAction: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-button')).to.be.true;
|
||||
expect(wrapper.hasClass('van-button--bottom-action')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a disabled button', () => {
|
||||
wrapper = mount(Button, {
|
||||
propsData: {
|
||||
disabled: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-button')).to.be.true;
|
||||
expect(wrapper.hasClass('van-button--disabled')).to.be.true;
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
wrapper.trigger('click');
|
||||
|
||||
expect(eventStub.called).to.be.false;
|
||||
});
|
||||
|
||||
it('create a loading button', () => {
|
||||
wrapper = mount(Button, {
|
||||
propsData: {
|
||||
loading: true
|
||||
}
|
||||
});
|
||||
const loading = wrapper.find(VanLoading)[0];
|
||||
|
||||
expect(wrapper.hasClass('van-button')).to.be.true;
|
||||
expect(loading.isVueComponent).to.be.true;
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
wrapper.trigger('click');
|
||||
|
||||
expect(eventStub.called).to.be.false;
|
||||
});
|
||||
|
||||
it('create a primary loading button', () => {
|
||||
wrapper = mount(Button, {
|
||||
propsData: {
|
||||
type: 'primary',
|
||||
loading: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-button')).to.be.true;
|
||||
expect(wrapper.hasClass('van-button--primary')).to.be.true;
|
||||
|
||||
const loading = wrapper.find(VanLoading)[0];
|
||||
expect(loading.isVueComponent).to.be.true;
|
||||
});
|
||||
});
|
||||
@@ -1,19 +0,0 @@
|
||||
import Card from 'packages/card';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('Card', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create', () => {
|
||||
wrapper = mount(Card, {
|
||||
propsData: {
|
||||
thumb: 'thumb'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-card')).to.be.true;
|
||||
});
|
||||
});
|
||||
@@ -1,144 +0,0 @@
|
||||
import CellSwipe from 'packages/cell-swipe';
|
||||
import { mount } from 'avoriaz';
|
||||
import { triggerTouch, dragHelper } from '../utils';
|
||||
|
||||
const defaultProps = {
|
||||
propsData: {
|
||||
leftWidth: 100,
|
||||
rightWidth: 100
|
||||
}
|
||||
};
|
||||
|
||||
describe('CellSwipe', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('render left or right part when has width', () => {
|
||||
wrapper = mount(CellSwipe, defaultProps);
|
||||
expect(wrapper.find('.van-cell-swipe__left').length).to.equal(1);
|
||||
expect(wrapper.find('.van-cell-swipe__right').length).to.equal(1);
|
||||
});
|
||||
|
||||
it('not render left or right part when width is 0', () => {
|
||||
wrapper = mount(CellSwipe);
|
||||
expect(wrapper.find('.van-cell-swipe__left').length).to.equal(0);
|
||||
expect(wrapper.find('.van-cell-swipe__right').length).to.equal(0);
|
||||
});
|
||||
|
||||
it('drag and show left part', done => {
|
||||
wrapper = mount(CellSwipe, defaultProps);
|
||||
|
||||
triggerTouch(wrapper, 'touchstart', 0, 0);
|
||||
expect(wrapper.vm.startX).to.equal(0);
|
||||
expect(wrapper.vm.startY).to.equal(0);
|
||||
|
||||
triggerTouch(wrapper, 'touchmove', 50, 0);
|
||||
expect(wrapper.vm.offset).to.equal(50);
|
||||
|
||||
triggerTouch(wrapper, 'touchend', 50, 0);
|
||||
expect(wrapper.vm.offset).to.equal(100);
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.opened).to.be.true;
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('drag and show right part', done => {
|
||||
wrapper = mount(CellSwipe, defaultProps);
|
||||
|
||||
triggerTouch(wrapper, 'touchstart', 0, 0);
|
||||
triggerTouch(wrapper, 'touchmove', -50, 0);
|
||||
triggerTouch(wrapper, 'touchend', -50, 0);
|
||||
expect(wrapper.vm.offset).to.equal(-100);
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.opened).to.be.true;
|
||||
wrapper.trigger('click');
|
||||
expect(wrapper.vm.offset).to.equal(0);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('drag and show left part', () => {
|
||||
wrapper = mount(CellSwipe, defaultProps);
|
||||
dragHelper(wrapper, 50);
|
||||
expect(wrapper.vm.offset).to.equal(100);
|
||||
});
|
||||
|
||||
it('drag and show right part', () => {
|
||||
wrapper = mount(CellSwipe, defaultProps);
|
||||
|
||||
dragHelper(wrapper, -50);
|
||||
expect(wrapper.vm.offset).to.equal(-100);
|
||||
});
|
||||
|
||||
it('drag distance out of ranges', done => {
|
||||
wrapper = mount(CellSwipe, defaultProps);
|
||||
|
||||
triggerTouch(wrapper, 'touchstart', 0, 0);
|
||||
triggerTouch(wrapper, 'touchmove', 1000, 0);
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.offset).to.equal(0);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('drag and hide left part', (done) => {
|
||||
wrapper = mount(CellSwipe, defaultProps);
|
||||
|
||||
dragHelper(wrapper, 50);
|
||||
expect(wrapper.vm.offset).to.equal(100);
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.opened).to.be.true;
|
||||
|
||||
dragHelper(wrapper, -50);
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.offset).to.equal(0);
|
||||
expect(wrapper.vm.opened).to.be.false;
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('drag vertical', () => {
|
||||
wrapper = mount(CellSwipe, defaultProps);
|
||||
|
||||
dragHelper(wrapper, 0, 100);
|
||||
expect(wrapper.vm.offset).to.equal(0);
|
||||
});
|
||||
|
||||
it('on close prop', () => {
|
||||
let clickPosition;
|
||||
let instance;
|
||||
const onClose = (position, ins) => {
|
||||
clickPosition = position;
|
||||
instance = ins;
|
||||
};
|
||||
|
||||
wrapper = mount(CellSwipe, {
|
||||
propsData: {
|
||||
...defaultProps.propsData,
|
||||
onClose
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.trigger('click');
|
||||
wrapper.vm.onClick();
|
||||
expect(clickPosition).to.equal(undefined);
|
||||
|
||||
wrapper.vm.offset = 100;
|
||||
wrapper.trigger('click');
|
||||
expect(clickPosition).to.equal('cell');
|
||||
|
||||
wrapper.find('.van-cell-swipe__left')[0].trigger('click');
|
||||
expect(clickPosition).to.equal('left');
|
||||
|
||||
wrapper.find('.van-cell-swipe__right')[0].trigger('click');
|
||||
expect(clickPosition).to.equal('right');
|
||||
|
||||
instance.close();
|
||||
expect(wrapper.vm.offset).to.equal(0);
|
||||
});
|
||||
});
|
||||
@@ -1,94 +0,0 @@
|
||||
import CellGroup from 'packages/cell-group';
|
||||
import Cell from 'packages/cell';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('CellGroup', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a cell-group', () => {
|
||||
wrapper = mount(CellGroup, {
|
||||
propsData: {}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-cell-group')).to.be.true;
|
||||
});
|
||||
});
|
||||
|
||||
describe('Cell', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create', () => {
|
||||
wrapper = mount(Cell);
|
||||
|
||||
expect(wrapper.hasClass('van-cell')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a required cell', () => {
|
||||
wrapper = mount(Cell, {
|
||||
propsData: {
|
||||
required: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-cell')).to.be.true;
|
||||
expect(wrapper.hasClass('van-cell--required')).to.be.true;
|
||||
});
|
||||
|
||||
it('emit a click event', () => {
|
||||
wrapper = mount(Cell);
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
wrapper.trigger('click');
|
||||
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('click')).to.be.true;
|
||||
});
|
||||
|
||||
it('cell with url', () => {
|
||||
wrapper = mount(Cell, {
|
||||
propsData: {
|
||||
url: '#test',
|
||||
replace: false
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.trigger('click');
|
||||
|
||||
expect(window.location.hash).to.equal('#test');
|
||||
window.location.hash = '';
|
||||
|
||||
const length = window.history.length;
|
||||
wrapper.vm.replace = true;
|
||||
wrapper.trigger('click');
|
||||
expect(window.location.hash).to.equal('#test');
|
||||
expect(window.history.length).to.equal(length);
|
||||
window.location.hash = '';
|
||||
});
|
||||
|
||||
it('cell with to', done => {
|
||||
wrapper = mount(Cell, {
|
||||
propsData: {
|
||||
to: '/test',
|
||||
replace: false
|
||||
}
|
||||
});
|
||||
wrapper.vm.$router = {
|
||||
push(path) {
|
||||
wrapper.vm.replace = true;
|
||||
wrapper.trigger('click');
|
||||
},
|
||||
replace(path) {
|
||||
expect(path).to.equal('/test');
|
||||
done();
|
||||
}
|
||||
};
|
||||
|
||||
wrapper.trigger('click');
|
||||
});
|
||||
});
|
||||
@@ -1,214 +0,0 @@
|
||||
import { mount } from 'avoriaz';
|
||||
import Checkbox from 'packages/checkbox';
|
||||
import CheckboxTestComponent from '../components/checkbox';
|
||||
|
||||
describe('CheckboxGroup', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a checkbox-group', () => {
|
||||
wrapper = mount(CheckboxTestComponent);
|
||||
|
||||
expect(wrapper.hasClass('van-checkbox-group')).to.be.true;
|
||||
|
||||
expect(wrapper.vNode.child.value.length).to.equal(2);
|
||||
expect(wrapper.vNode.child.disabled).to.be.false;
|
||||
});
|
||||
|
||||
it('emit a change event', (done) => {
|
||||
wrapper = mount(CheckboxTestComponent);
|
||||
|
||||
expect(wrapper.vNode.child.value.length).to.equal(2);
|
||||
const eventStub = sinon.stub(wrapper.vNode.child, '$emit');
|
||||
|
||||
wrapper.setData({
|
||||
'result': ['a']
|
||||
});
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vNode.child.value.length).to.equal(1);
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('change'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('click on checked checkbox', (done) => {
|
||||
wrapper = mount(CheckboxTestComponent);
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vNode.child, '$emit');
|
||||
|
||||
const firstCheckboxLabel = wrapper.find('.van-checkbox')[0].find('.van-checkbox__label')[0];
|
||||
firstCheckboxLabel.trigger('click');
|
||||
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('input'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('click on unchecked checkbox', (done) => {
|
||||
wrapper = mount(CheckboxTestComponent);
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vNode.child, '$emit');
|
||||
|
||||
const lastCheckboxLabel = wrapper.find('.van-checkbox')[3].find('.van-checkbox__label')[0];
|
||||
lastCheckboxLabel.trigger('click');
|
||||
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('input'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('click on unchecked item and checked options num beyond max', (done) => {
|
||||
wrapper = mount(CheckboxTestComponent);
|
||||
|
||||
wrapper.setData({
|
||||
'max': 2
|
||||
});
|
||||
|
||||
const lastCheckboxLabel = wrapper.find('.van-checkbox')[3].find('.van-checkbox__label')[0];
|
||||
lastCheckboxLabel.trigger('click');
|
||||
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.result.indexOf('d')).to.equal(-1);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('click on disabled item', (done) => {
|
||||
wrapper = mount(CheckboxTestComponent);
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vNode.child, '$emit');
|
||||
|
||||
const disabledLabel = wrapper.find('.van-checkbox')[2].find('.van-checkbox__label')[0];
|
||||
disabledLabel.trigger('click');
|
||||
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledOnce).to.be.false;
|
||||
expect(wrapper.vm.result.indexOf('c')).to.equal(-1);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('Checkbox', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a checkbox', () => {
|
||||
wrapper = mount(Checkbox, {
|
||||
propsData: {
|
||||
value: true,
|
||||
disabled: false
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-checkbox')).to.be.true;
|
||||
expect(wrapper.vm.currentValue).to.be.true;
|
||||
expect(wrapper.vm.isDisabled).to.be.false;
|
||||
expect(wrapper.vm.isChecked).to.be.true;
|
||||
});
|
||||
|
||||
it('create a checkbox with name', () => {
|
||||
wrapper = mount(Checkbox, {
|
||||
propsData: {
|
||||
name: 'a',
|
||||
disabled: false
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-checkbox')).to.be.true;
|
||||
expect(!!wrapper.vm.isChecked).to.be.false;
|
||||
});
|
||||
|
||||
it('create a not boolean value checkbox', (done) => {
|
||||
wrapper = mount(Checkbox, {
|
||||
propsData: {
|
||||
value: 'test',
|
||||
name: 'test'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-checkbox')).to.be.true;
|
||||
expect(wrapper.vm.currentValue).to.equal('test');
|
||||
expect(wrapper.vm.isDisabled).to.be.false;
|
||||
expect(wrapper.vm.isChecked).to.be.true;
|
||||
|
||||
wrapper.vm.value = null;
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.currentValue).to.equal(null);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('click on a checkbox', (done) => {
|
||||
wrapper = mount(Checkbox, {
|
||||
propsData: {
|
||||
value: false,
|
||||
disabled: false
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-checkbox')).to.be.true;
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
|
||||
const checkboxLabel = wrapper.find('.van-checkbox__icon')[0];
|
||||
checkboxLabel.trigger('click');
|
||||
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('input'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('click on a disabled checkbox', () => {
|
||||
wrapper = mount(Checkbox, {
|
||||
propsData: {
|
||||
value: false,
|
||||
disabled: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-checkbox')).to.be.true;
|
||||
expect(wrapper.find('.van-checkbox--disabled').length).to.equal(1);
|
||||
expect(wrapper.vm.currentValue).to.be.false;
|
||||
expect(wrapper.vm.isDisabled).to.be.true;
|
||||
|
||||
const checkboxLabel = wrapper.find('.van-checkbox__icon')[0];
|
||||
checkboxLabel.trigger('click');
|
||||
|
||||
expect(wrapper.vm.currentValue).to.be.false;
|
||||
});
|
||||
|
||||
it('click on a disabled checkbox label', () => {
|
||||
wrapper = mount(Checkbox, {
|
||||
propsData: {
|
||||
value: false,
|
||||
labelDisabled: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-checkbox')).to.be.true;
|
||||
expect(wrapper.vm.currentValue).to.be.false;
|
||||
|
||||
const checkboxLabel = wrapper.find('.van-checkbox__icon')[0];
|
||||
checkboxLabel.trigger('click');
|
||||
|
||||
expect(wrapper.vm.currentValue).to.be.false;
|
||||
});
|
||||
});
|
||||
@@ -1,65 +0,0 @@
|
||||
import { mount } from 'avoriaz';
|
||||
import Circle from 'packages/circle';
|
||||
|
||||
describe('Circle', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a circle', () => {
|
||||
wrapper = mount(Circle, {
|
||||
propsData: {
|
||||
text: 'test'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-circle')).to.be.true;
|
||||
expect(wrapper.find('.van-circle__text')[0].text()).to.equal('test');
|
||||
});
|
||||
|
||||
it('circle rate', done => {
|
||||
let currentRate = 0;
|
||||
wrapper = mount(Circle, {
|
||||
propsData: {
|
||||
rate: 0,
|
||||
value: 0,
|
||||
clockwise: false
|
||||
}
|
||||
});
|
||||
wrapper.vm.$on('input', rate => {
|
||||
currentRate = rate;
|
||||
});
|
||||
wrapper.vm.rate = 50;
|
||||
|
||||
setTimeout(() => {
|
||||
expect(currentRate).to.equal(50);
|
||||
done();
|
||||
}, 100);
|
||||
});
|
||||
|
||||
it('circle animation', done => {
|
||||
let currentRate = 0;
|
||||
wrapper = mount(Circle, {
|
||||
propsData: {
|
||||
rate: 0,
|
||||
value: 0,
|
||||
speed: 500,
|
||||
clockwise: false
|
||||
}
|
||||
});
|
||||
wrapper.vm.$on('input', rate => {
|
||||
currentRate = rate;
|
||||
});
|
||||
wrapper.vm.rate = 50;
|
||||
|
||||
setTimeout(() => {
|
||||
expect(currentRate === 50).to.be.false;
|
||||
setTimeout(() => {
|
||||
expect(currentRate === 50).to.be.true;
|
||||
done();
|
||||
}, 200);
|
||||
}, 50);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,47 +0,0 @@
|
||||
import { mount } from 'avoriaz';
|
||||
import Collapse from '../components/collapse';
|
||||
|
||||
describe('Circle', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('basic mode', () => {
|
||||
wrapper = mount(Collapse);
|
||||
|
||||
const firstTitle = wrapper.find('.van-collapse-item__title')[0];
|
||||
firstTitle.trigger('click');
|
||||
expect(wrapper.vm.active).to.eql(['first']);
|
||||
|
||||
const secondTitle = wrapper.find('.van-collapse-item__title')[1];
|
||||
secondTitle.trigger('click');
|
||||
expect(wrapper.vm.active).to.eql(['first', 1]);
|
||||
|
||||
firstTitle.trigger('click');
|
||||
expect(wrapper.vm.active).to.eql([1]);
|
||||
});
|
||||
|
||||
it('accordion', () => {
|
||||
wrapper = mount(Collapse, {
|
||||
propsData: {
|
||||
accordion: true
|
||||
}
|
||||
});
|
||||
|
||||
const firstTitle = wrapper.find('.van-collapse-item__title')[0];
|
||||
firstTitle.trigger('click');
|
||||
expect(wrapper.vm.active).to.eql('first');
|
||||
|
||||
const secondTitle = wrapper.find('.van-collapse-item__title')[1];
|
||||
secondTitle.trigger('click');
|
||||
expect(wrapper.vm.active).to.eql(1);
|
||||
|
||||
firstTitle.trigger('click');
|
||||
expect(wrapper.vm.active).to.eql('first');
|
||||
|
||||
firstTitle.trigger('click');
|
||||
expect(wrapper.vm.active).to.eql('');
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,267 +0,0 @@
|
||||
import ContactCard from 'packages/contact-card';
|
||||
import ContactList from 'packages/contact-list';
|
||||
import ContactEdit from 'packages/contact-edit';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('ContactCard', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a ContactCard', () => {
|
||||
wrapper = mount(ContactCard);
|
||||
expect(wrapper.hasClass('van-contact-card')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a add ContactCard', done => {
|
||||
wrapper = mount(ContactCard, {
|
||||
propsData: {
|
||||
type: 'add'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-contact-card')).to.be.true;
|
||||
expect(wrapper.find('.van-contact-card__text')[0].text()).to.equal('添加订单联系人信息');
|
||||
|
||||
wrapper.vm.addText = '测试文案';
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-contact-card__text')[0].text()).to.equal('测试文案');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('create a edit ContactCard', () => {
|
||||
wrapper = mount(ContactCard, {
|
||||
propsData: {
|
||||
type: 'edit',
|
||||
tel: '13000000000',
|
||||
name: '测试姓名'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-contact-card')).to.be.true;
|
||||
expect(wrapper.find('.van-contact-card__text div')[0].text()).to.equal('联系人：测试姓名');
|
||||
expect(wrapper.find('.van-contact-card__text div')[1].text()).to.equal('联系电话：13000000000');
|
||||
|
||||
const spy = sinon.spy();
|
||||
wrapper.vm.$on('click', spy);
|
||||
wrapper.trigger('click');
|
||||
expect(spy.calledOnce).to.be.true;
|
||||
|
||||
wrapper.vm.editable = false;
|
||||
const spy2 = sinon.spy();
|
||||
wrapper.vm.$on('click', spy2);
|
||||
wrapper.trigger('click');
|
||||
expect(spy2.calledOnce).to.be.false;
|
||||
});
|
||||
});
|
||||
|
||||
describe('ContactList', () => {
|
||||
const list = [
|
||||
{
|
||||
id: '1',
|
||||
name: '张三',
|
||||
tel: '13000000000'
|
||||
},
|
||||
{
|
||||
id: '2',
|
||||
name: '李四',
|
||||
tel: '1310000000'
|
||||
},
|
||||
{
|
||||
id: '3',
|
||||
name: '王五',
|
||||
tel: '1320000000'
|
||||
}
|
||||
];
|
||||
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a ContactList', () => {
|
||||
wrapper = mount(ContactList);
|
||||
expect(wrapper.hasClass('van-contact-list')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a ContactList with three items', () => {
|
||||
wrapper = mount(ContactList, {
|
||||
propsData: {
|
||||
value: '1',
|
||||
list
|
||||
}
|
||||
});
|
||||
expect(wrapper.find('.van-cell').length).to.equal(4);
|
||||
expect(wrapper.find('.van-icon-checked').length).to.equal(1);
|
||||
});
|
||||
|
||||
it('listen to add & edit event', (done) => {
|
||||
wrapper = mount(ContactList, {
|
||||
propsData: {
|
||||
list
|
||||
}
|
||||
});
|
||||
|
||||
const add = sinon.spy();
|
||||
wrapper.vm.$on('add', add);
|
||||
wrapper.find('.van-contact-list__add')[0].trigger('click');
|
||||
expect(add.calledOnce).to.be.true;
|
||||
|
||||
wrapper.vm.$on('edit', (item, index) => {
|
||||
expect(index).to.equal(0);
|
||||
done();
|
||||
});
|
||||
wrapper.find('.van-contact-list__edit')[0].trigger('click');
|
||||
});
|
||||
|
||||
it('listen to select event', (done) => {
|
||||
wrapper = mount(ContactList, {
|
||||
propsData: {
|
||||
value: '1',
|
||||
list
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$on('select', (item, index) => {
|
||||
expect(item.id).to.equal('3');
|
||||
done();
|
||||
});
|
||||
wrapper.find('.van-radio')[2].trigger('click');
|
||||
});
|
||||
});
|
||||
|
||||
describe('ContactEdit', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a ContactEdit', () => {
|
||||
wrapper = mount(ContactEdit);
|
||||
expect(wrapper.hasClass('van-contact-edit')).to.be.true;
|
||||
expect(wrapper.find('.van-field__control')[0].element.value).to.equal('');
|
||||
expect(wrapper.find('.van-field__control')[1].element.value).to.equal('');
|
||||
});
|
||||
|
||||
it('create a ContactEdit with props', () => {
|
||||
const contactInfo = {
|
||||
name: '测试',
|
||||
tel: '123123213'
|
||||
};
|
||||
|
||||
wrapper = mount(ContactEdit, {
|
||||
propsData: {
|
||||
contactInfo
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.find('.van-field__control')[0].element.value).to.equal(contactInfo.name);
|
||||
expect(wrapper.find('.van-field__control')[1].element.value).to.equal(contactInfo.tel);
|
||||
});
|
||||
|
||||
it('save contactInfo', () => {
|
||||
const contactInfo = {
|
||||
name: '',
|
||||
tel: '123123213'
|
||||
};
|
||||
|
||||
wrapper = mount(ContactEdit, {
|
||||
propsData: {
|
||||
contactInfo
|
||||
}
|
||||
});
|
||||
|
||||
const saveSpy = sinon.spy();
|
||||
wrapper.vm.$on('save', saveSpy);
|
||||
|
||||
const saveButton = wrapper.find('.van-button')[0];
|
||||
|
||||
// name empty
|
||||
wrapper.vm.data.name = '';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['name']).to.be.true;
|
||||
wrapper.find('.van-field__control')[0].trigger('focus');
|
||||
expect(wrapper.vm.errorInfo['name']).to.be.false;
|
||||
|
||||
// name too long
|
||||
wrapper.vm.data.name = '111111111111111111111111111';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['name']).to.be.true;
|
||||
wrapper.find('.van-field__control')[0].trigger('focus');
|
||||
expect(wrapper.vm.errorInfo['name']).to.be.false;
|
||||
|
||||
// tel empty
|
||||
wrapper.vm.data.name = '123';
|
||||
wrapper.vm.data.tel = '';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['tel']).to.be.true;
|
||||
wrapper.find('.van-field__control')[1].trigger('focus');
|
||||
expect(wrapper.vm.errorInfo['tel']).to.be.false;
|
||||
|
||||
// tel invalid
|
||||
wrapper.vm.data.tel = 'abc';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['tel']).to.be.true;
|
||||
wrapper.find('.van-field__control')[1].trigger('focus');
|
||||
expect(wrapper.vm.errorInfo['tel']).to.be.false;
|
||||
|
||||
// saving
|
||||
wrapper.vm.data.tel = '13000000000';
|
||||
saveButton.trigger('click');
|
||||
wrapper.vm.isSaving = true;
|
||||
saveButton.trigger('click');
|
||||
expect(saveSpy.calledOnce).to.be.true;
|
||||
});
|
||||
|
||||
it('delete', done => {
|
||||
wrapper = mount(ContactEdit, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
isDeleting: true,
|
||||
isEdit: true,
|
||||
contactInfo: {
|
||||
id: '123'
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const deleteButton = wrapper.find('.van-button')[1];
|
||||
deleteButton.trigger('click');
|
||||
wrapper.vm.onDelete();
|
||||
|
||||
setTimeout(() => {
|
||||
wrapper.vm.isDeleting = false;
|
||||
wrapper.vm.$nextTick(() => {
|
||||
deleteButton.trigger('click');
|
||||
setTimeout(() => {
|
||||
expect(document.querySelectorAll('.van-dialog').length).to.equal(1);
|
||||
|
||||
wrapper.vm.$on('delete', () => {
|
||||
done();
|
||||
});
|
||||
document.querySelector('.van-dialog__confirm').click();
|
||||
}, 300);
|
||||
});
|
||||
}, 300);
|
||||
});
|
||||
|
||||
it('watch contactInfo', done => {
|
||||
const contactInfo = {
|
||||
name: '123'
|
||||
};
|
||||
|
||||
wrapper = mount(ContactEdit, {
|
||||
propsData: {
|
||||
contactInfo: {}
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.setProps({ contactInfo });
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.data.name).to.equal('123');
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1,324 +0,0 @@
|
||||
import CouponCell from 'packages/coupon-cell';
|
||||
import CouponList from 'packages/coupon-list';
|
||||
import { mount } from 'avoriaz';
|
||||
import { DOMChecker } from '../utils';
|
||||
|
||||
const coupon = {
|
||||
id: 1,
|
||||
available: 1,
|
||||
discount: 0,
|
||||
denominations: 150,
|
||||
origin_condition: 0,
|
||||
reason: '',
|
||||
value: 150,
|
||||
condition: '下单立减 1.50 元',
|
||||
name: '新手专用优惠券',
|
||||
start_at: 1489104000,
|
||||
end_at: 1514592000
|
||||
};
|
||||
|
||||
const discountCoupon = {
|
||||
...coupon,
|
||||
id: 2,
|
||||
discount: 88,
|
||||
denominations: 0,
|
||||
origin_condition: 50,
|
||||
value: 12,
|
||||
condition: '下单即享 8.8 折'
|
||||
};
|
||||
|
||||
const emptyCoupon = {
|
||||
id: 3,
|
||||
denominations: 0,
|
||||
discount: 0
|
||||
};
|
||||
|
||||
const disabledCoupon = {
|
||||
...coupon,
|
||||
id: 4,
|
||||
available: 0,
|
||||
reason: '未满足使用门槛'
|
||||
};
|
||||
|
||||
const disabledDiscountCoupon = {
|
||||
...discountCoupon,
|
||||
id: 5,
|
||||
available: 0,
|
||||
reason: '未满足使用门槛'
|
||||
};
|
||||
|
||||
describe('CouponCell', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('no coupon', () => {
|
||||
wrapper = mount(CouponCell, {});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
text: {
|
||||
'.van-cell__value': '使用优惠'
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('has two coupon', () => {
|
||||
wrapper = mount(CouponCell, {
|
||||
propsData: {
|
||||
coupons: [coupon, discountCoupon]
|
||||
}
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
text: {
|
||||
'.van-cell__value': '您有 2 个可用优惠'
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('select first coupon', () => {
|
||||
wrapper = mount(CouponCell, {
|
||||
propsData: {
|
||||
chosenCoupon: 0,
|
||||
coupons: [coupon, discountCoupon]
|
||||
}
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
text: {
|
||||
'.van-cell__value span': '省￥1.50'
|
||||
},
|
||||
count: {
|
||||
'.van-cell__right-icon': 1
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('not editable', () => {
|
||||
wrapper = mount(CouponCell, {
|
||||
propsData: {
|
||||
chosenCoupon: 0,
|
||||
coupons: [coupon, discountCoupon],
|
||||
editable: false
|
||||
}
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
text: {
|
||||
'.van-cell__value span': '省￥1.50'
|
||||
},
|
||||
count: {
|
||||
'.van-cell__right-icon': 0
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('CouponList', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('no coupon', () => {
|
||||
wrapper = mount(CouponList, {
|
||||
propsData: {
|
||||
chosenCoupon: -1
|
||||
}
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
count: {
|
||||
'.van-coupon-item': 0,
|
||||
'.van-coupon-item--disabled': 0,
|
||||
'.van-coupon-list__list h3': 0
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('has two coupon', () => {
|
||||
wrapper = mount(CouponList, {
|
||||
propsData: {
|
||||
chosenCoupon: -1,
|
||||
coupons: [coupon, discountCoupon],
|
||||
disabledCoupons: [disabledCoupon, disabledDiscountCoupon]
|
||||
}
|
||||
});
|
||||
DOMChecker(wrapper, {
|
||||
count: {
|
||||
'.van-coupon-item': 4,
|
||||
'.van-coupon-item--disabled': 2,
|
||||
'.van-coupon-list__list h3': 1
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('switch to first coupon', (done) => {
|
||||
wrapper = mount(CouponList, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
chosenCoupon: -1,
|
||||
coupons: [coupon, discountCoupon],
|
||||
disabledCoupons: [disabledCoupon, disabledDiscountCoupon]
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$on('change', (index) => {
|
||||
wrapper.vm.chosenCoupon = index;
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
wrapper.find('.van-coupon-item')[0].trigger('click');
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.chosenCoupon).to.equal(0);
|
||||
done();
|
||||
}, 300);
|
||||
}, 300);
|
||||
});
|
||||
|
||||
it('cancel select coupon', (done) => {
|
||||
wrapper = mount(CouponList, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
chosenCoupon: 0,
|
||||
displayedCouponIndex: 0,
|
||||
coupons: [coupon, discountCoupon],
|
||||
disabledCoupons: [disabledCoupon, disabledDiscountCoupon]
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$on('change', (index) => {
|
||||
wrapper.vm.chosenCoupon = index;
|
||||
wrapper.vm.displayedCouponIndex = index;
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
wrapper.find('.van-coupon-list__close')[0].trigger('click');
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.chosenCoupon).to.equal(-1);
|
||||
done();
|
||||
}, 500);
|
||||
}, 500);
|
||||
});
|
||||
|
||||
it('denominations format', () => {
|
||||
wrapper = mount(CouponList, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
coupons: [coupon, {
|
||||
...coupon,
|
||||
id: 10,
|
||||
denominations: 10
|
||||
}, {
|
||||
...coupon,
|
||||
id: 11,
|
||||
denominations: 100
|
||||
}, {
|
||||
...coupon,
|
||||
id: 12,
|
||||
denominations: 135
|
||||
}, {
|
||||
...coupon,
|
||||
id: 13,
|
||||
denominations: 0
|
||||
}]
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.find('.van-coupon-item__gradient h2')[0].text()).to.equal('¥ 1.5');
|
||||
expect(wrapper.find('.van-coupon-item__gradient h2')[1].text()).to.equal('¥ 0.1');
|
||||
expect(wrapper.find('.van-coupon-item__gradient h2')[2].text()).to.equal('¥ 1');
|
||||
expect(wrapper.find('.van-coupon-item__gradient h2')[3].text()).to.equal('¥ 1.35');
|
||||
expect(wrapper.find('.van-coupon-item__gradient h2')[4].text()).to.equal('');
|
||||
});
|
||||
|
||||
it('discount format', () => {
|
||||
wrapper = mount(CouponList, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
coupons: [discountCoupon, {
|
||||
...discountCoupon,
|
||||
id: 10,
|
||||
discount: 10
|
||||
}, {
|
||||
...discountCoupon,
|
||||
id: 11,
|
||||
discount: 0
|
||||
}]
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.find('.van-coupon-item__gradient h2')[0].text()).to.equal('8.8折');
|
||||
expect(wrapper.find('.van-coupon-item__gradient h2')[1].text()).to.equal('1折');
|
||||
expect(wrapper.find('.van-coupon-item__gradient h2')[2].text()).to.equal('');
|
||||
});
|
||||
|
||||
it('add coupon', (done) => {
|
||||
wrapper = mount(CouponList, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
chosenCoupon: 0,
|
||||
coupons: [coupon, discountCoupon, emptyCoupon],
|
||||
disabledCoupons: [disabledCoupon, disabledDiscountCoupon]
|
||||
}
|
||||
});
|
||||
|
||||
const code = '123123';
|
||||
|
||||
wrapper.vm.$on('exchange', (code) => {
|
||||
expect(code).to.equal(code);
|
||||
wrapper.vm.coupons.push({
|
||||
...coupon,
|
||||
id: 15
|
||||
});
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
DOMChecker(wrapper, {
|
||||
count: {
|
||||
'.van-button--disabled': 1
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.find('.van-field__control')[0].element.value = code;
|
||||
wrapper.find('.van-field__control')[0].trigger('input');
|
||||
|
||||
setTimeout(() => {
|
||||
wrapper.find('.van-coupon-list__exchange')[0].trigger('click');
|
||||
DOMChecker(wrapper, {
|
||||
count: {
|
||||
'.van-button--disabled': 0
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.find('.van-coupon-list')[0].hasStyle('display', 'none')).to.equal(false);
|
||||
DOMChecker(wrapper, {
|
||||
count: {
|
||||
'.van-button--disabled': 1,
|
||||
'.van-coupon-item': 6,
|
||||
'.van-coupon-item--disabled': 2
|
||||
}
|
||||
});
|
||||
done();
|
||||
}, 300);
|
||||
}, 300);
|
||||
}, 300);
|
||||
});
|
||||
|
||||
it('displayedCouponIndex out of range', (done) => {
|
||||
wrapper = mount(CouponList, {
|
||||
propsData: {
|
||||
displayedCouponIndex: -100,
|
||||
coupons: [coupon, discountCoupon, emptyCoupon]
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.chosenCoupon).to.equal(-1);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1,165 +0,0 @@
|
||||
import DatetimePicker from 'packages/datetime-picker';
|
||||
import { mount } from 'avoriaz';
|
||||
import { dragHelper } from '../utils';
|
||||
|
||||
const testTime = '10:00';
|
||||
const testDate = new Date('2017/03/10 10:00');
|
||||
const minDate = new Date('2000/01/01 00:00');
|
||||
const maxDate = new Date('3000/01/01 00:00');
|
||||
|
||||
describe('DatetimePicker', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a time picker', () => {
|
||||
wrapper = mount(DatetimePicker, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
type: 'time',
|
||||
value: testTime
|
||||
}
|
||||
});
|
||||
expect(wrapper.vm.innerValue).to.equal(testTime);
|
||||
});
|
||||
|
||||
it('create a date picker', () => {
|
||||
wrapper = mount(DatetimePicker, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
type: 'date',
|
||||
value: testDate
|
||||
}
|
||||
});
|
||||
expect(wrapper.vm.innerValue.getTime()).to.equal(testDate.getTime());
|
||||
});
|
||||
|
||||
it('create a year-month', () => {
|
||||
wrapper = mount(DatetimePicker, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
type: 'year-month',
|
||||
value: testDate
|
||||
}
|
||||
});
|
||||
expect(wrapper.vm.innerValue.getTime()).to.equal(testDate.getTime());
|
||||
});
|
||||
|
||||
it('create a datetime picker', () => {
|
||||
wrapper = mount(DatetimePicker, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
type: 'datetime',
|
||||
value: testDate
|
||||
}
|
||||
});
|
||||
expect(wrapper.vm.innerValue.getTime()).to.equal(testDate.getTime());
|
||||
});
|
||||
|
||||
it('drag time picker', (done) => {
|
||||
wrapper = mount(DatetimePicker, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
type: 'time',
|
||||
value: '12:00'
|
||||
}
|
||||
});
|
||||
|
||||
const [hour, minute] = wrapper.find('.van-picker-column ul');
|
||||
dragHelper(hour, 0, -50);
|
||||
dragHelper(minute, 0, -50);
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.innerValue).to.equal('1:01');
|
||||
done();
|
||||
}, 50);
|
||||
});
|
||||
|
||||
it('drag date picker', (done) => {
|
||||
wrapper = mount(DatetimePicker, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
type: 'date',
|
||||
value: testDate,
|
||||
minDate,
|
||||
maxDate
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
const [year, month, day] = wrapper.find('.van-picker-column ul');
|
||||
dragHelper(year, 0, -50);
|
||||
dragHelper(month, 0, -50);
|
||||
dragHelper(day, 0, -50);
|
||||
setTimeout(() => {
|
||||
const newYear = wrapper.vm.innerValue.getFullYear();
|
||||
const newMonth = wrapper.vm.innerValue.getMonth() + 1;
|
||||
const newDay = wrapper.vm.innerValue.getDate();
|
||||
expect(newYear).to.equal(2018);
|
||||
expect(newMonth).to.equal(4);
|
||||
expect(newDay).to.equal(11);
|
||||
done();
|
||||
}, 10);
|
||||
}, 10);
|
||||
});
|
||||
|
||||
it('drag year-month picker', (done) => {
|
||||
wrapper = mount(DatetimePicker, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
type: 'year-month',
|
||||
value: testDate,
|
||||
minDate,
|
||||
maxDate
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
const [year, month] = wrapper.find('.van-picker-column ul');
|
||||
dragHelper(year, 0, -50);
|
||||
dragHelper(month, 0, -50);
|
||||
setTimeout(() => {
|
||||
const newYear = wrapper.vm.innerValue.getFullYear();
|
||||
const newMonth = wrapper.vm.innerValue.getMonth() + 1;
|
||||
expect(newYear).to.equal(2018);
|
||||
expect(newMonth).to.equal(4);
|
||||
done();
|
||||
}, 10);
|
||||
}, 10);
|
||||
});
|
||||
|
||||
it('drag datetime picker', (done) => {
|
||||
wrapper = mount(DatetimePicker, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
type: 'datetime',
|
||||
value: testDate,
|
||||
minDate,
|
||||
maxDate
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
const [year, month, day, hour, minute] = wrapper.find('.van-picker-column ul');
|
||||
dragHelper(year, 0, -50);
|
||||
dragHelper(month, 0, -50);
|
||||
dragHelper(day, 0, -50);
|
||||
dragHelper(hour, 0, -50);
|
||||
dragHelper(minute, 0, -50);
|
||||
setTimeout(() => {
|
||||
const newYear = wrapper.vm.innerValue.getFullYear();
|
||||
const newMonth = wrapper.vm.innerValue.getMonth() + 1;
|
||||
const newDay = wrapper.vm.innerValue.getDate();
|
||||
const newHour = wrapper.vm.innerValue.getHours();
|
||||
const newMinute = wrapper.vm.innerValue.getMinutes();
|
||||
expect(newYear).to.equal(2018);
|
||||
expect(newMonth).to.equal(4);
|
||||
expect(newDay).to.equal(11);
|
||||
expect(newHour).to.equal(11);
|
||||
expect(newMinute).to.equal(1);
|
||||
done();
|
||||
}, 10);
|
||||
}, 10);
|
||||
});
|
||||
});
|
||||
@@ -1,96 +0,0 @@
|
||||
import deepAssign from 'packages/utils/deep-assign';
|
||||
|
||||
describe('DeepAssign', () => {
|
||||
it('basic assign', () => {
|
||||
const a = { foo: 0 };
|
||||
const b = { foo: 0, bar: 1 };
|
||||
const output = { foo: 0, bar: 1 };
|
||||
expect(deepAssign(a, b)).to.eql(output);
|
||||
expect(deepAssign(a, null)).to.eql(a);
|
||||
expect(deepAssign(a, undefined)).to.eql(a);
|
||||
});
|
||||
|
||||
it('same object', () => {
|
||||
const a = { foo: 0 };
|
||||
expect(deepAssign(a, a)).to.eql(a);
|
||||
});
|
||||
|
||||
it('only assign own keys', () => {
|
||||
const Test = function() {};
|
||||
Test.prototype.a = 'many';
|
||||
const test = new Test();
|
||||
test.bar = 1;
|
||||
expect(deepAssign({ foo: 1 }, test, { foo: 1, bar: 1 })).to.eql({
|
||||
foo: 1,
|
||||
bar: 1
|
||||
});
|
||||
});
|
||||
|
||||
it('do not assign undefined values', () => {
|
||||
expect(deepAssign({}, { foo: undefined })).to.eql({});
|
||||
});
|
||||
|
||||
it('do not assign null values', () => {
|
||||
expect(deepAssign({}, { foo: null })).to.eql({});
|
||||
});
|
||||
|
||||
it('assign proprety, if proprety is null in the prototype chain', () => {
|
||||
const Unicorn = function() {};
|
||||
Unicorn.prototype.rainbows = null;
|
||||
const unicorn = new Unicorn();
|
||||
expect(deepAssign(unicorn, { rainbows: 'many' }).rainbows).to.eql('many');
|
||||
});
|
||||
|
||||
it('assign proprety, if proprety is undefined in the prototype chain', () => {
|
||||
const Unicorn = function() {};
|
||||
Unicorn.prototype.rainbows = undefined;
|
||||
const unicorn = new Unicorn();
|
||||
expect(deepAssign(unicorn, { rainbows: 'many' }).rainbows).to.eql('many');
|
||||
});
|
||||
|
||||
it('do not merge with a target proprety in the prototype chain', () => {
|
||||
const amountOfRainbows = { amount: 'many' };
|
||||
const Unicorn = function() {};
|
||||
Unicorn.prototype.rainbows = amountOfRainbows;
|
||||
const unicorn = deepAssign(new Unicorn(), { rainbows: 'none' });
|
||||
expect(unicorn.rainbows).to.eql('none');
|
||||
expect(unicorn.rainbows.amount).to.eql(undefined);
|
||||
expect(Unicorn.prototype.rainbows).to.eql(amountOfRainbows);
|
||||
});
|
||||
|
||||
it('deep assign', () => {
|
||||
const a = {
|
||||
foo: {
|
||||
foo: {
|
||||
foo: true
|
||||
},
|
||||
bar: {
|
||||
bar: false
|
||||
}
|
||||
}
|
||||
};
|
||||
const b = {
|
||||
foo: {
|
||||
foo: {
|
||||
foo: false,
|
||||
bar: true
|
||||
},
|
||||
bar: null
|
||||
},
|
||||
bar: true
|
||||
};
|
||||
const output = {
|
||||
foo: {
|
||||
foo: {
|
||||
foo: false,
|
||||
bar: true
|
||||
},
|
||||
bar: {
|
||||
bar: false
|
||||
}
|
||||
},
|
||||
bar: true
|
||||
};
|
||||
expect(deepAssign(a, b)).to.eql(output);
|
||||
});
|
||||
});
|
||||
@@ -1,87 +0,0 @@
|
||||
import Vue from 'vue';
|
||||
import Dialog from 'packages/dialog';
|
||||
|
||||
describe('Dialog', () => {
|
||||
afterEach(() => {
|
||||
Dialog.close();
|
||||
});
|
||||
|
||||
it('create a alert dialog', (done) => {
|
||||
Dialog.close();
|
||||
Dialog.alert({
|
||||
title: 'title',
|
||||
message: 'message'
|
||||
}).then((action) => {
|
||||
expect(action).to.equal('confirm');
|
||||
done();
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
expect(document.querySelector('.van-dialog')).to.exist;
|
||||
expect(document.querySelector('.van-dialog__cancel').style.display).to.equal('none');
|
||||
document.querySelector('.van-dialog__confirm').click();
|
||||
}, 300);
|
||||
});
|
||||
|
||||
it('create a confirm dialog', (done) => {
|
||||
Dialog.confirm({
|
||||
title: 'title',
|
||||
message: 'message'
|
||||
}).catch((action) => {
|
||||
expect(action).to.equal('cancel');
|
||||
done();
|
||||
});
|
||||
|
||||
expect(document.querySelector('.van-dialog')).to.exist;
|
||||
|
||||
setTimeout(() => {
|
||||
document.querySelector('.van-dialog__cancel').click();
|
||||
}, 300);
|
||||
});
|
||||
|
||||
it('create a confirm dialog with callback', (done) => {
|
||||
Dialog.confirm({
|
||||
callback: (action) => {
|
||||
expect(action).to.equal('cancel');
|
||||
done();
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
document.querySelector('.van-dialog__cancel').click();
|
||||
}, 300);
|
||||
});
|
||||
|
||||
it('set default options', () => {
|
||||
Dialog.setDefaultOptions({
|
||||
title: 'default title'
|
||||
});
|
||||
expect(Dialog.currentOptions.title).to.equal('default title');
|
||||
Dialog.resetDefaultOptions();
|
||||
expect(Dialog.currentOptions.title).to.equal('');
|
||||
});
|
||||
|
||||
it('register component', () => {
|
||||
Vue.use(Dialog);
|
||||
expect(!!Vue.component('van-dialog')).to.be.true;
|
||||
});
|
||||
|
||||
it('before close', (done) => {
|
||||
Dialog.confirm({
|
||||
beforeClose(action, dialogDone) {
|
||||
setTimeout(() => {
|
||||
dialogDone();
|
||||
setTimeout(() => {
|
||||
expect(document.querySelector('.van-dialog').style.display).to.equal('none');
|
||||
done();
|
||||
}, 300);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
document.querySelector('.van-dialog__confirm').click();
|
||||
expect(document.querySelector('.van-dialog').style.display).to.equal('');
|
||||
}, 300);
|
||||
});
|
||||
});
|
||||
@@ -1,199 +0,0 @@
|
||||
import Field from 'packages/field';
|
||||
import FieldWithIcon from '../components/field';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('Field', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a text field', () => {
|
||||
wrapper = mount(Field, {
|
||||
propsData: {
|
||||
type: 'text',
|
||||
autosize: false
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-field')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a text field with initialize value', (done) => {
|
||||
wrapper = mount(Field, {
|
||||
propsData: {
|
||||
value: 'test'
|
||||
}
|
||||
});
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
|
||||
wrapper.vm.value = 'test2';
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledWith('input'));
|
||||
expect(wrapper.find('.van-field__control')[0].element.value).to.equal('test2');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('focus on input', (done) => {
|
||||
wrapper = mount(Field, {
|
||||
propsData: {
|
||||
value: ''
|
||||
}
|
||||
});
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
const input = wrapper.find('.van-field__control')[0];
|
||||
input.trigger('focus');
|
||||
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledWith('focus'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('create a textarea field', (done) => {
|
||||
wrapper = mount(Field, {
|
||||
propsData: {
|
||||
type: 'textarea',
|
||||
autosize: true
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.hasClass('van-field')).to.be.true;
|
||||
done();
|
||||
}, 50);
|
||||
});
|
||||
|
||||
it('create a autosize textarea field', (done) => {
|
||||
wrapper = mount(Field, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
type: 'textarea',
|
||||
autosize: {}
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$on('input', val => {
|
||||
wrapper.vm.value = val;
|
||||
});
|
||||
|
||||
const textarea = wrapper.find('.van-field__control')[0];
|
||||
const textareaElement = textarea.element;
|
||||
const textAreaDiff = (parseInt(textareaElement.style.paddingBottom, 10) +
|
||||
parseInt(textareaElement.style.paddingTop, 10)) || 0;
|
||||
|
||||
const longText = 'testtesttesttesttesttesttest';
|
||||
textareaElement.value = longText;
|
||||
textarea.trigger('input');
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.find('.van-field__control')[0].element.value).to.equal(longText);
|
||||
expect(textareaElement.style.height).to.equal((textareaElement.scrollHeight - textAreaDiff) + 'px');
|
||||
done();
|
||||
}, 50);
|
||||
});
|
||||
|
||||
it('autosize object', (done) => {
|
||||
wrapper = mount(Field, {
|
||||
propsData: {
|
||||
type: 'textarea',
|
||||
autosize: {
|
||||
maxHeight: 100,
|
||||
minHeight: 50
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$on('input', val => {
|
||||
wrapper.vm.value = val;
|
||||
});
|
||||
|
||||
const textarea = wrapper.find('.van-field__control')[0];
|
||||
const textareaElement = textarea.element;
|
||||
|
||||
const longText = 'testtesttesttesttesttesttest';
|
||||
textareaElement.value = longText;
|
||||
textarea.trigger('input');
|
||||
|
||||
wrapper.update();
|
||||
setTimeout(() => {
|
||||
expect(wrapper.find('.van-field__control')[0].element.value).to.equal(longText);
|
||||
expect(textareaElement.style.height).to.equal(('50px'));
|
||||
done();
|
||||
}, 50);
|
||||
});
|
||||
|
||||
it('show icon when has value and icon props', () => {
|
||||
wrapper = mount(Field, {
|
||||
propsData: {
|
||||
icon: 'name',
|
||||
value: '123'
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.find('.van-field__icon')[0].trigger('touchstart');
|
||||
expect(wrapper.find('.van-field__icon').length).to.equal(1);
|
||||
});
|
||||
|
||||
it('keypress event', () => {
|
||||
wrapper = mount(Field, {
|
||||
propsData: {
|
||||
value: '',
|
||||
type: 'number'
|
||||
}
|
||||
});
|
||||
|
||||
const spy1 = sinon.spy();
|
||||
wrapper.vm.onKeypress({ keyCode: 0, preventDefault: spy1 });
|
||||
expect(spy1.calledOnce).to.be.true;
|
||||
|
||||
const spy2 = sinon.spy();
|
||||
wrapper.vm.onKeypress({ keyCode: 50, preventDefault: spy2 });
|
||||
expect(spy2.calledOnce).to.be.false;
|
||||
|
||||
const spy3 = sinon.spy();
|
||||
wrapper.vm.value = '0.1';
|
||||
wrapper.vm.onKeypress({ keyCode: 46, preventDefault: spy3 });
|
||||
expect(spy3.calledOnce).to.be.true;
|
||||
|
||||
wrapper.vm.type = 'text';
|
||||
const spy4 = sinon.spy();
|
||||
wrapper.vm.onKeypress({ keyCode: 0, preventDefault: spy4 });
|
||||
expect(spy4.calledOnce).to.be.false;
|
||||
});
|
||||
|
||||
it('create a field with icon slot', () => {
|
||||
const fn = sinon.spy();
|
||||
|
||||
wrapper = mount(FieldWithIcon, {
|
||||
propsData: {
|
||||
onIconClick: fn
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.find('.van-field__icon')[0].trigger('touchstart');
|
||||
expect(fn.calledOnce).to.be.true;
|
||||
});
|
||||
|
||||
it('blur event', (done) => {
|
||||
const blur = sinon.spy();
|
||||
const focus = sinon.spy();
|
||||
const clickIcon = sinon.spy();
|
||||
|
||||
wrapper = mount(FieldWithIcon, {});
|
||||
wrapper.vm.$on('blur', blur);
|
||||
wrapper.vm.$on('focus', focus);
|
||||
|
||||
wrapper.find('.van-field__icon')[0].trigger('click');
|
||||
wrapper.find('.van-field__control')[0].trigger('focus');
|
||||
wrapper.find('.van-field__control')[0].trigger('blur');
|
||||
|
||||
expect(blur.calledOnce).to.be.true;
|
||||
expect(clickIcon.calledOnce).to.be.false;
|
||||
done();
|
||||
});
|
||||
});
|
||||
@@ -1,47 +0,0 @@
|
||||
import GoodsAction from '../components/goods-action';
|
||||
import GoodsActionBigBtn from 'packages/goods-action-big-btn';
|
||||
import GoodsActionMiniBtn from 'packages/goods-action-mini-btn';
|
||||
import { mount } from 'avoriaz';
|
||||
import { DOMChecker } from '../utils';
|
||||
|
||||
describe('GoodsAction', () => {
|
||||
let wrapper;
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a GoodsAction', () => {
|
||||
wrapper = mount(GoodsAction, {});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
count: {
|
||||
'.van-goods-action-mini-btn': 2,
|
||||
'.van-goods-action-big-btn': 2,
|
||||
'.van-icon-chat': 1
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('click GoodsActionBigBtn', () => {
|
||||
wrapper = mount(GoodsActionBigBtn, {});
|
||||
|
||||
const submitSpyFunc = sinon.spy();
|
||||
wrapper.vm.$on('click', submitSpyFunc);
|
||||
wrapper.trigger('click');
|
||||
expect(submitSpyFunc.calledOnce).to.be.true;
|
||||
});
|
||||
|
||||
it('click GoodsActionMiniBtn', () => {
|
||||
wrapper = mount(GoodsActionMiniBtn, {
|
||||
propsData: {
|
||||
icon: 'card'
|
||||
}
|
||||
});
|
||||
|
||||
const submitSpyFunc = sinon.spy();
|
||||
wrapper.vm.$on('click', submitSpyFunc);
|
||||
wrapper.trigger('click');
|
||||
expect(submitSpyFunc.calledOnce).to.be.true;
|
||||
});
|
||||
});
|
||||
@@ -1,21 +0,0 @@
|
||||
import Icon from 'packages/icon';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('Icon', () => {
|
||||
let wrapper;
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a icon', () => {
|
||||
wrapper = mount(Icon, {
|
||||
propsData: {
|
||||
name: 'arrow'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-icon')).to.be.true;
|
||||
expect(wrapper.hasClass('van-icon-arrow')).to.be.true;
|
||||
});
|
||||
});
|
||||
@@ -1,62 +0,0 @@
|
||||
import Vue from 'vue';
|
||||
import { mount } from 'avoriaz';
|
||||
import { triggerTouch } from '../utils';
|
||||
import ImagePreview from 'packages/image-preview';
|
||||
import ImagePreviewVue from 'packages/image-preview/image-preview';
|
||||
|
||||
const images = [
|
||||
'https://img.yzcdn.cn/upload_files/2017/03/15/FkubrzN7AgGwLlTeb1E89-T_ZjBg.png',
|
||||
'https://img.yzcdn.cn/upload_files/2017/03/14/FmTPs0SeyQaAOSK1rRe1sL8RcwSY.jpeg',
|
||||
'https://img.yzcdn.cn/upload_files/2017/03/15/FvexrWlG_WxtCE9Omo5l27n_mAG_.jpeg'
|
||||
];
|
||||
|
||||
describe('ImagePreview', () => {
|
||||
let wrapper;
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('call ImagePreview Function', (done) => {
|
||||
ImagePreview(images);
|
||||
Vue.nextTick(() => {
|
||||
expect(document.querySelectorAll('.van-image-preview img').length).to.equal(3);
|
||||
ImagePreview(images.slice(0, 2));
|
||||
|
||||
Vue.nextTick(() => {
|
||||
expect(document.querySelectorAll('.van-image-preview img').length).to.equal(2);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('create a ImagePreview Component', (done) => {
|
||||
wrapper = mount(ImagePreviewVue);
|
||||
wrapper.vm.images = images;
|
||||
wrapper.vm.value = true;
|
||||
wrapper.vm.$on('input', val => {
|
||||
wrapper.vm.value = val;
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-image-preview')).to.be.true;
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('img').length).to.equal(3);
|
||||
triggerTouch(wrapper, 'touchstart', 0, 0);
|
||||
triggerTouch(wrapper, 'touchmove', 100, 100);
|
||||
triggerTouch(wrapper, 'touchend', 0, 0);
|
||||
expect(wrapper.vm.value).to.be.true;
|
||||
|
||||
// triggerTouch(wrapper, 'touchstart', 0, 0);
|
||||
// triggerTouch(wrapper, 'touchmove', 0, 0);
|
||||
// triggerTouch(wrapper, 'touchend', 0, 0);
|
||||
// expect(wrapper.vm.value).to.be.false;
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('register component', () => {
|
||||
Vue.use(ImagePreview);
|
||||
expect(!!Vue.component('van-image-preview')).to.be.true;
|
||||
});
|
||||
});
|
||||
@@ -1,41 +0,0 @@
|
||||
import { mount } from 'avoriaz';
|
||||
import Col from 'packages/col';
|
||||
import Row from 'packages/row';
|
||||
import RowTestComponent from '../components/row';
|
||||
|
||||
describe('Layout', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a simple row', () => {
|
||||
wrapper = mount(Row);
|
||||
|
||||
expect(wrapper.hasClass('van-row')).to.be.true;
|
||||
expect(wrapper.vm.style).to.be.empty;
|
||||
});
|
||||
|
||||
it('create a simple column', () => {
|
||||
wrapper = mount(Col, {
|
||||
propsData: {
|
||||
span: 8,
|
||||
offset: 8
|
||||
}
|
||||
});
|
||||
expect(wrapper.hasClass('van-col')).to.be.true;
|
||||
expect(wrapper.hasClass('van-col-8')).to.be.true;
|
||||
expect(wrapper.hasClass('van-col-offset-8')).to.be.true;
|
||||
expect(wrapper.vm.gutter).to.equal(0);
|
||||
});
|
||||
|
||||
it('create a gutter row', () => {
|
||||
wrapper = mount(RowTestComponent);
|
||||
const row = wrapper.find(Row)[0];
|
||||
const column = wrapper.find(Col)[0];
|
||||
expect(row.hasStyle('margin-left', '-5px')).to.be.true;
|
||||
expect(row.hasStyle('margin-right', '-5px')).to.be.true;
|
||||
expect(column.hasStyle('padding-left', '5px')).to.be.true;
|
||||
expect(column.hasStyle('padding-right', '5px')).to.be.true;
|
||||
});
|
||||
});
|
||||
@@ -1,68 +0,0 @@
|
||||
import List from 'packages/list';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('List', () => {
|
||||
let wrapper;
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('load event', done => {
|
||||
wrapper = mount(List);
|
||||
|
||||
const spy = sinon.spy();
|
||||
wrapper.vm.$on('load', spy);
|
||||
wrapper.vm.$on('input', val => {
|
||||
wrapper.vm.loading = val;
|
||||
});
|
||||
|
||||
expect(spy.calledOnce).to.be.false;
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(spy.calledOnce).to.be.true;
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('finished', done => {
|
||||
wrapper = mount(List, {
|
||||
propsData: {
|
||||
finished: true
|
||||
}
|
||||
});
|
||||
|
||||
const spy = sinon.spy();
|
||||
wrapper.vm.$on('load', spy);
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(spy.calledOnce).to.be.false;
|
||||
|
||||
wrapper.vm.finished = false;
|
||||
|
||||
setTimeout(() => {
|
||||
expect(spy.calledOnce).to.be.true;
|
||||
done();
|
||||
}, 50);
|
||||
});
|
||||
});
|
||||
|
||||
it('immediate check false', done => {
|
||||
wrapper = mount(List, {
|
||||
propsData: {
|
||||
immediateCheck: false
|
||||
}
|
||||
});
|
||||
|
||||
const spy = sinon.spy();
|
||||
wrapper.vm.$on('load', spy);
|
||||
wrapper.vm.$on('input', val => {
|
||||
wrapper.vm.loading = val;
|
||||
});
|
||||
|
||||
expect(spy.calledOnce).to.be.false;
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(spy.calledOnce).to.be.false;
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1,73 +0,0 @@
|
||||
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('van-loading')).to.be.true;
|
||||
});
|
||||
|
||||
it('create gradient-circle black', () => {
|
||||
wrapper = mount(Loading, {
|
||||
propsData: {
|
||||
type: 'gradient-circle',
|
||||
color: 'black'
|
||||
}
|
||||
});
|
||||
const spinner = wrapper.find('.van-loading__spinner')[0];
|
||||
|
||||
expect(spinner.hasClass('van-loading__spinner--gradient-circle')).to.be.true;
|
||||
});
|
||||
|
||||
it('create gradient-circle white', () => {
|
||||
wrapper = mount(Loading, {
|
||||
propsData: {
|
||||
type: 'gradient-circle',
|
||||
color: 'white'
|
||||
}
|
||||
});
|
||||
const spinner = wrapper.find('.van-loading__spinner')[0];
|
||||
|
||||
expect(spinner.hasClass('van-loading__spinner--gradient-circle')).to.be.true;
|
||||
});
|
||||
|
||||
it('create circle black', () => {
|
||||
wrapper = mount(Loading, {
|
||||
propsData: {
|
||||
type: 'circle',
|
||||
color: 'black'
|
||||
}
|
||||
});
|
||||
const spinner = wrapper.find('.van-loading__spinner')[0];
|
||||
|
||||
expect(spinner.hasClass('van-loading__spinner--circle')).to.be.true;
|
||||
});
|
||||
|
||||
it('create circle white', () => {
|
||||
wrapper = mount(Loading, {
|
||||
propsData: {
|
||||
type: 'circle',
|
||||
color: 'white'
|
||||
}
|
||||
});
|
||||
const spinner = wrapper.find('.van-loading__spinner')[0];
|
||||
|
||||
expect(spinner.hasClass('van-loading__spinner--circle')).to.be.true;
|
||||
});
|
||||
|
||||
it('loading size', () => {
|
||||
wrapper = mount(Loading, {
|
||||
propsData: {
|
||||
size: '100px'
|
||||
}
|
||||
});
|
||||
expect(wrapper.vm.$el.style.width).to.equal('100px');
|
||||
expect(wrapper.vm.$el.style.height).to.equal('100px');
|
||||
});
|
||||
});
|
||||
@@ -1,43 +0,0 @@
|
||||
import NavBar from 'packages/nav-bar';
|
||||
import { mount } from 'avoriaz';
|
||||
import { DOMChecker } from '../utils';
|
||||
|
||||
describe('NavBar', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a NavBar', () => {
|
||||
wrapper = mount(NavBar, {
|
||||
propsData: {
|
||||
title: '标题',
|
||||
leftText: '返回',
|
||||
rightText: '按钮',
|
||||
leftArrow: true
|
||||
}
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
text: {
|
||||
'.van-nav-bar__title': '标题',
|
||||
'.van-nav-bar__left .van-nav-bar__text': '返回',
|
||||
'.van-nav-bar__right .van-nav-bar__text': '按钮'
|
||||
},
|
||||
count: {
|
||||
'.van-nav-bar__arrow': 1
|
||||
}
|
||||
});
|
||||
expect(wrapper.hasClass('van-nav-bar')).to.be.true;
|
||||
});
|
||||
|
||||
it('NavBar fixed', () => {
|
||||
wrapper = mount(NavBar, {
|
||||
propsData: {
|
||||
fixed: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-nav-bar')).to.be.true;
|
||||
});
|
||||
});
|
||||
@@ -1,61 +0,0 @@
|
||||
import NoticeBar from '../components/notice-bar';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('NoticeBar', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a notice-bar', () => {
|
||||
wrapper = mount(NoticeBar, {
|
||||
propsData: {},
|
||||
attachToDocument: true
|
||||
});
|
||||
|
||||
expect(wrapper.find('.van-notice-bar').length).to.equal(1);
|
||||
});
|
||||
|
||||
it('mode closeable', () => {
|
||||
wrapper = mount(NoticeBar, {
|
||||
propsData: {
|
||||
mode: 'closeable'
|
||||
},
|
||||
attachToDocument: true
|
||||
});
|
||||
|
||||
const icon = wrapper.find('.van-icon-close');
|
||||
expect(icon.length).to.equal(1);
|
||||
|
||||
icon[0].trigger('click');
|
||||
expect(wrapper.hasStyle('display', 'none'));
|
||||
});
|
||||
|
||||
it('mode link', () => {
|
||||
wrapper = mount(NoticeBar, {
|
||||
propsData: {
|
||||
mode: 'link'
|
||||
},
|
||||
attachToDocument: true
|
||||
});
|
||||
|
||||
expect(wrapper.find('.van-icon-arrow').length).to.equal(1);
|
||||
});
|
||||
|
||||
it('notice-bar transitionend', (done) => {
|
||||
wrapper = mount(NoticeBar, {
|
||||
propsData: {
|
||||
text: '足协杯战线连续第2年上演广州德比战',
|
||||
speed: 1000,
|
||||
delay: 0
|
||||
},
|
||||
attachToDocument: true
|
||||
});
|
||||
|
||||
const content = wrapper.find('.van-notice-bar__content')[0];
|
||||
setTimeout(() => {
|
||||
expect(content.hasStyle('transition-delay', '0s')).to.be.true;
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
});
|
||||
@@ -1,169 +0,0 @@
|
||||
import NumberKeyboard from 'packages/number-keyboard';
|
||||
import NumberKeyboardKeepAlive from '../components/number-keyboard';
|
||||
import { mount } from 'avoriaz';
|
||||
import { triggerTouch } from '../utils';
|
||||
|
||||
function mockKeyDown(wrapper, keyIndex) {
|
||||
const key = wrapper.element.querySelectorAll('.van-key')[keyIndex];
|
||||
const touchStart = document.createEvent('CustomEvent');
|
||||
touchStart.initCustomEvent('touchstart', true, true, {});
|
||||
key.dispatchEvent(touchStart);
|
||||
}
|
||||
|
||||
function mockKeyUp(wrapper, keyIndex) {
|
||||
const key = wrapper.element.querySelectorAll('.van-key')[keyIndex];
|
||||
const touchEnd = document.createEvent('CustomEvent');
|
||||
touchEnd.initCustomEvent('touchend', true, true, {});
|
||||
key.dispatchEvent(touchEnd);
|
||||
}
|
||||
|
||||
describe('NumberKeyboard', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a NumberKeyboard', () => {
|
||||
wrapper = mount(NumberKeyboard, {});
|
||||
expect(wrapper.hasClass('van-number-keyboard')).to.be.true;
|
||||
});
|
||||
|
||||
it('click a keyboard key', (done) => {
|
||||
wrapper = mount(NumberKeyboard, {
|
||||
propsData: {
|
||||
theme: 'custom',
|
||||
closeButtonText: 'close'
|
||||
}
|
||||
});
|
||||
|
||||
// just for coverage
|
||||
wrapper.vm.handler(true);
|
||||
|
||||
wrapper.vm.$on('input', value => {
|
||||
mockKeyUp(wrapper, 0);
|
||||
expect(value).to.equal(1);
|
||||
done();
|
||||
});
|
||||
|
||||
mockKeyDown(wrapper, 12); // close
|
||||
mockKeyDown(wrapper, 10); // empty
|
||||
mockKeyDown(wrapper, 0); // 1
|
||||
});
|
||||
|
||||
it('click delete key', (done) => {
|
||||
wrapper = mount(NumberKeyboard, {});
|
||||
|
||||
const deleteSpy = sinon.spy();
|
||||
wrapper.vm.$on('delete', deleteSpy);
|
||||
|
||||
mockKeyDown(wrapper, 11);
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(deleteSpy.calledOnce).to.be.true;
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('blur keyboard', (done) => {
|
||||
wrapper = mount(NumberKeyboard, {
|
||||
attachToDocument: true
|
||||
});
|
||||
|
||||
const blur = sinon.spy();
|
||||
wrapper.vm.$on('blur', blur);
|
||||
|
||||
triggerTouch(document.body, 'touchstart');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(blur.calledOnce).to.be.true;
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('listen to show event when has transtion', (done) => {
|
||||
wrapper = mount(NumberKeyboard, {
|
||||
attachToDocument: true
|
||||
});
|
||||
|
||||
const show = sinon.spy();
|
||||
wrapper.vm.$on('show', show);
|
||||
wrapper.vm.show = true;
|
||||
wrapper.trigger('animationend');
|
||||
|
||||
setTimeout(() => {
|
||||
expect(show.calledOnce).to.be.true;
|
||||
done();
|
||||
}, 100);
|
||||
});
|
||||
|
||||
it('listen to show event when no transtion', (done) => {
|
||||
wrapper = mount(NumberKeyboard, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
transition: false
|
||||
}
|
||||
});
|
||||
|
||||
const show = sinon.spy();
|
||||
wrapper.vm.$on('show', show);
|
||||
wrapper.vm.show = true;
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(show.calledOnce).to.be.true;
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('listen to hide event when has transtion', (done) => {
|
||||
wrapper = mount(NumberKeyboard, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
show: true
|
||||
}
|
||||
});
|
||||
|
||||
const hide = sinon.spy();
|
||||
wrapper.vm.$on('hide', hide);
|
||||
wrapper.vm.show = false;
|
||||
wrapper.trigger('animationend');
|
||||
|
||||
setTimeout(() => {
|
||||
expect(hide.calledOnce).to.be.true;
|
||||
done();
|
||||
}, 100);
|
||||
});
|
||||
|
||||
it('listen to hide event when no transtion', (done) => {
|
||||
wrapper = mount(NumberKeyboard, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
show: true,
|
||||
transition: false
|
||||
}
|
||||
});
|
||||
|
||||
const hide = sinon.spy();
|
||||
wrapper.vm.$on('hide', hide);
|
||||
wrapper.vm.show = false;
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(hide.calledOnce).to.be.true;
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('keey-alive live cycle', (done) => {
|
||||
wrapper = mount(NumberKeyboardKeepAlive, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
showKeyboard: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.find('.van-number-keyboard').length).to.equal(1);
|
||||
|
||||
wrapper.vm.showKeyboard = false;
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-number-keyboard').length).to.equal(0);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1,134 +0,0 @@
|
||||
import Vue from 'vue';
|
||||
import { mount } from 'avoriaz';
|
||||
import Pagination from 'packages/pagination';
|
||||
|
||||
describe('Pagination', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a multi Pagination', done => {
|
||||
wrapper = mount(Pagination, {
|
||||
propsData: {
|
||||
mode: 'multi',
|
||||
totalItems: 120,
|
||||
itemsPerPage: 10,
|
||||
showPageSize: 5,
|
||||
value: 2
|
||||
}
|
||||
});
|
||||
expect(wrapper.hasClass('van-pagination')).to.be.true;
|
||||
expect(wrapper.find('.van-pagination__item').length).to.equal(7);
|
||||
expect(
|
||||
wrapper.find('.van-pagination__item')[0].hasClass('van-pagination__prev')
|
||||
).to.be.true;
|
||||
expect(wrapper.vm.value).to.equal(2);
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
wrapper.find('.van-pagination__next')[0].trigger('click');
|
||||
Vue.nextTick(() => {
|
||||
expect(eventStub.calledWith('input'));
|
||||
expect(eventStub.calledWith('change'));
|
||||
expect(wrapper.vm.value).to.equal(2);
|
||||
|
||||
wrapper.vm.value = 12;
|
||||
wrapper.update();
|
||||
Vue.nextTick(() => {
|
||||
expect(
|
||||
wrapper
|
||||
.find('.van-pagination__next')[0]
|
||||
.hasClass('van-pagination__item--disabled')
|
||||
).to.be.true;
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('create a multi forceEllipses Pagination', done => {
|
||||
wrapper = mount(Pagination, {
|
||||
propsData: {
|
||||
mode: 'multi',
|
||||
totalItems: 120,
|
||||
itemsPerPage: 10,
|
||||
showPageSize: 5,
|
||||
forceEllipses: true,
|
||||
value: 1
|
||||
}
|
||||
});
|
||||
|
||||
const ellipsesLink = wrapper.find('.van-pagination__page')[5];
|
||||
expect(ellipsesLink.text().trim()).to.equal('...');
|
||||
|
||||
wrapper.vm.value = 7;
|
||||
wrapper.update();
|
||||
Vue.nextTick(() => {
|
||||
const ellipsesLink = wrapper.find('.van-pagination__page')[0];
|
||||
expect(ellipsesLink.text().trim()).to.equal('...');
|
||||
|
||||
wrapper.vm.value = 12;
|
||||
Vue.nextTick(() => {
|
||||
const pages = wrapper.find('.van-pagination__page');
|
||||
const ellipsesLink = pages[pages.length - 1];
|
||||
expect(ellipsesLink.text().trim()).to.equal('12');
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('create a simple Pagination', () => {
|
||||
wrapper = mount(Pagination, {
|
||||
propsData: {
|
||||
mode: 'simple',
|
||||
totalItems: 120,
|
||||
itemsPerPage: 10,
|
||||
value: 1
|
||||
}
|
||||
});
|
||||
expect(wrapper.hasClass('van-pagination')).to.be.true;
|
||||
expect(wrapper.find('.van-pagination__item').length).to.equal(2);
|
||||
expect(
|
||||
wrapper.find('.van-pagination__item')[0].hasClass('van-pagination__prev')
|
||||
).to.be.true;
|
||||
});
|
||||
|
||||
it('create a empty Pagination', done => {
|
||||
wrapper = mount(Pagination, {
|
||||
propsData: {
|
||||
mode: 'multi',
|
||||
totalItems: 120,
|
||||
itemsPerPage: 10,
|
||||
showPageSize: 5,
|
||||
nextText: '下一页',
|
||||
previousText: '上一页',
|
||||
value: 2
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.find('.van-pagination__prev')[0].text().trim()).to.equal('上一页');
|
||||
expect(wrapper.find('.van-pagination__next')[0].text().trim()).to.equal('下一页');
|
||||
|
||||
wrapper.vm.value = { currentPage: 18 };
|
||||
wrapper.update();
|
||||
Vue.nextTick(() => {
|
||||
expect(wrapper.find('.van-pagination__page').length).to.equal(0);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('create a multi forceEllipses Pagination && max show page size', () => {
|
||||
wrapper = mount(Pagination, {
|
||||
propsData: {
|
||||
mode: 'multi',
|
||||
totalItems: 120,
|
||||
itemsPerPage: 10,
|
||||
showPageSize: 12,
|
||||
forceEllipses: true,
|
||||
value: 1
|
||||
}
|
||||
});
|
||||
|
||||
const ellipsesLink = wrapper.find('.van-pagination__page')[11];
|
||||
expect(ellipsesLink.text().trim()).to.equal('12');
|
||||
});
|
||||
});
|
||||
@@ -1,56 +0,0 @@
|
||||
import PasswordInput from 'packages/password-input';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('PasswordInput', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a PasswordInput', () => {
|
||||
wrapper = mount(PasswordInput, {});
|
||||
expect(wrapper.find('.van-password-input').length).to.equal(1);
|
||||
});
|
||||
|
||||
it('create a PasswordInput with value && info', (done) => {
|
||||
wrapper = mount(PasswordInput, {
|
||||
propsData: {
|
||||
value: '000',
|
||||
info: '测试info'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.find('.van-password-input i')[2].hasStyle('visibility', 'visible')).to.be.true;
|
||||
expect(wrapper.find('.van-password-input i')[3].hasStyle('visibility', 'visible')).to.be.false;
|
||||
expect(wrapper.find('.van-password-input__info')[0].text()).to.equal('测试info');
|
||||
|
||||
wrapper.vm.value = '0000';
|
||||
wrapper.vm.errorInfo = '测试errorInfo';
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-password-input i')[3].hasStyle('visibility', 'visible')).to.be.true;
|
||||
expect(wrapper.find('.van-password-input__info').length).to.equal(0);
|
||||
expect(wrapper.find('.van-password-input__error-info')[0].text()).to.equal('测试errorInfo');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('listen to focus event', () => {
|
||||
wrapper = mount(PasswordInput, {});
|
||||
|
||||
const focus = sinon.spy();
|
||||
wrapper.vm.$on('focus', focus);
|
||||
wrapper.find('.van-password-input__security')[0].trigger('touchstart');
|
||||
|
||||
expect(focus.calledOnce).to.be.true;
|
||||
});
|
||||
|
||||
it('change password length', () => {
|
||||
wrapper = mount(PasswordInput, {
|
||||
propsData: {
|
||||
length: 2
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.find('.van-password-input i').length).to.equal(2);
|
||||
});
|
||||
});
|
||||
@@ -1,283 +0,0 @@
|
||||
import Picker from 'packages/picker';
|
||||
import PickerColumn from 'packages/picker/PickerColumn';
|
||||
import { mount } from 'avoriaz';
|
||||
import { dragHelper } from '../utils';
|
||||
|
||||
const simpleColumn = ['1990', '1991', '1992', '1993', '1994', '1995'];
|
||||
const columns = [
|
||||
{
|
||||
values: ['vip', 'normal'],
|
||||
className: 'column1'
|
||||
},
|
||||
{
|
||||
values: simpleColumn,
|
||||
className: 'column2'
|
||||
}
|
||||
];
|
||||
|
||||
const disabledOption = [{
|
||||
disabled: true,
|
||||
text: '123'
|
||||
}];
|
||||
|
||||
describe('Picker', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create picker', () => {
|
||||
wrapper = mount(Picker, {
|
||||
propsData: {
|
||||
columns: columns
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-picker')).to.be.true;
|
||||
|
||||
expect(wrapper.vm.getColumnValues(0).length).to.equal(2);
|
||||
expect(wrapper.vm.getValues().length).to.equal(2);
|
||||
});
|
||||
|
||||
it('set picker values', () => {
|
||||
wrapper = mount(Picker, {
|
||||
propsData: {
|
||||
columns: columns
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.vm.getColumnValues(0).length).to.equal(2);
|
||||
expect(wrapper.vm.getColumnValues(1).length).to.equal(6);
|
||||
|
||||
expect(wrapper.vm.getColumnValue(0)).to.equal('vip');
|
||||
expect(wrapper.vm.getColumnValue(1)).to.equal('1990');
|
||||
|
||||
wrapper.vm.setColumnValue(0, 'normal');
|
||||
expect(wrapper.vm.getColumnValue(0)).to.equal('normal');
|
||||
|
||||
wrapper.vm.setColumnIndex(0, 0);
|
||||
expect(wrapper.vm.getColumnValue(0)).to.equal('vip');
|
||||
|
||||
wrapper.vm.setColumnValue(1, '1991');
|
||||
expect(wrapper.vm.getColumnValue(1)).to.equal('1991');
|
||||
|
||||
wrapper.vm.setColumnValues(0, ['vip', 'normal', 'other']);
|
||||
expect(wrapper.vm.getColumnValues(0).length).to.equal(3);
|
||||
expect(wrapper.vm.getValues().length).to.equal(2);
|
||||
|
||||
wrapper.vm.setValues(['vip', '1992']);
|
||||
expect(wrapper.vm.getColumnIndex(0)).to.equal(0);
|
||||
expect(wrapper.vm.getColumnIndex(1)).to.equal(2);
|
||||
expect(wrapper.vm.getColumnIndex(2)).to.equal(undefined);
|
||||
expect(wrapper.vm.getIndexes(2)).to.eql([0, 2]);
|
||||
|
||||
wrapper.vm.setIndexes([1, 4]);
|
||||
expect(wrapper.vm.getColumnValue(0)).to.equal('normal');
|
||||
expect(wrapper.vm.getColumnValue(1)).to.equal('1994');
|
||||
expect(wrapper.vm.getColumnValue(2)).to.equal(undefined);
|
||||
});
|
||||
|
||||
it('create a simple column picker', () => {
|
||||
wrapper = mount(Picker, {
|
||||
propsData: {
|
||||
columns: undefined
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-picker')).to.be.true;
|
||||
expect(wrapper.vm.currentColumns.length).to.equal(0);
|
||||
});
|
||||
|
||||
it('create a invalid columns picker', () => {
|
||||
wrapper = mount(Picker, {
|
||||
propsData: {
|
||||
columns: simpleColumn
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.vm.isSimpleColumn).to.be.true;
|
||||
});
|
||||
|
||||
it('set invalid index columns', () => {
|
||||
wrapper = mount(Picker, {
|
||||
propsData: {
|
||||
columns: columns
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.vm.getColumnValues(3)).to.equal(undefined);
|
||||
wrapper.vm.setColumnValues(3, [1, 2]);
|
||||
expect(wrapper.vm.getColumnValues(3)).to.equal(undefined);
|
||||
|
||||
expect(wrapper.vm.getColumnValue(3)).to.equal(undefined);
|
||||
wrapper.vm.setColumnValue(3, 3);
|
||||
expect(wrapper.vm.getColumnValue(3)).to.equal(undefined);
|
||||
});
|
||||
|
||||
it('create a empty picker and emit a cencel event', (done) => {
|
||||
wrapper = mount(Picker, {
|
||||
propsData: {
|
||||
showToolbar: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-picker')).to.be.true;
|
||||
expect(wrapper.contains('.van-picker__toolbar')).to.be.true;
|
||||
expect(wrapper.vm.currentColumns.length).to.equal(0);
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
const cancelBtn = wrapper.find('.van-picker__cancel')[0];
|
||||
cancelBtn.trigger('click');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('cancel'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('create a empty picker and emit a confirm event', (done) => {
|
||||
wrapper = mount(Picker, {
|
||||
propsData: {
|
||||
showToolbar: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-picker')).to.be.true;
|
||||
expect(wrapper.contains('.van-picker__toolbar')).to.be.true;
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
const cancelBtn = wrapper.find('.van-picker__confirm')[0];
|
||||
cancelBtn.trigger('click');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('confirm'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('simple column emit a confirm event', (done) => {
|
||||
wrapper = mount(Picker, {
|
||||
propsData: {
|
||||
columns: simpleColumn,
|
||||
showToolbar: true
|
||||
}
|
||||
});
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
const cancelBtn = wrapper.find('.van-picker__confirm')[0];
|
||||
cancelBtn.trigger('click');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('confirm'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('PickerColumn', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a picker-column', () => {
|
||||
wrapper = mount(PickerColumn);
|
||||
|
||||
expect(wrapper.hasClass('van-picker-column')).to.be.true;
|
||||
expect(wrapper.vm.options.length).to.equal(0);
|
||||
});
|
||||
|
||||
it('change picker-column value', (done) => {
|
||||
wrapper = mount(PickerColumn, {
|
||||
propsData: {
|
||||
options: [1, 2, 3, 4, 5],
|
||||
value: 1
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.vm.options.length).to.equal(5);
|
||||
|
||||
wrapper.vm.setValue(3);
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.currentValue).to.equal(3);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('change picker-column values', (done) => {
|
||||
wrapper = mount(PickerColumn);
|
||||
|
||||
expect(wrapper.vm.options.length).to.equal(0);
|
||||
|
||||
wrapper.vm.options = [1, 2];
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.options.length).to.equal(2);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('change defaultIndex', (done) => {
|
||||
wrapper = mount(PickerColumn, {
|
||||
propsData: {
|
||||
options: simpleColumn,
|
||||
defaultIndex: 0
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.vm.currentIndex).to.equal(0);
|
||||
wrapper.vm.defaultIndex = 2;
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.currentIndex).to.equal(2);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('select disabled options', () => {
|
||||
wrapper = mount(PickerColumn, {
|
||||
propsData: {
|
||||
options: [
|
||||
{ text: '1', disabled: true },
|
||||
{ text: '2' },
|
||||
{ text: '3', disabled: true },
|
||||
{ text: '4', disabled: true }
|
||||
],
|
||||
valueKey: 'text'
|
||||
}
|
||||
});
|
||||
expect(wrapper.vm.currentIndex).to.equal(1);
|
||||
|
||||
wrapper.vm.setIndex(3);
|
||||
expect(wrapper.vm.currentIndex).to.equal(1);
|
||||
});
|
||||
|
||||
it('disabled options', () => {
|
||||
wrapper = mount(PickerColumn, {
|
||||
propsData: {
|
||||
options: disabledOption
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.find('.van-picker-column__item--disabled').length).to.equal(1);
|
||||
expect(wrapper.vm.currentIndex).to.equal(undefined);
|
||||
});
|
||||
|
||||
it('drag options', () => {
|
||||
wrapper = mount(PickerColumn, {
|
||||
propsData: {
|
||||
options: columns[1].values,
|
||||
itemHeight: 50
|
||||
}
|
||||
});
|
||||
expect(wrapper.vm.currentIndex).to.equal(0);
|
||||
|
||||
const column = wrapper.find('.van-picker-column')[0];
|
||||
dragHelper(column, 0, 0);
|
||||
expect(wrapper.vm.currentIndex).to.equal(0);
|
||||
|
||||
dragHelper(column, 0, -100);
|
||||
expect(wrapper.vm.currentIndex).to.equal(2);
|
||||
});
|
||||
});
|
||||
@@ -1,182 +0,0 @@
|
||||
import Popup from 'packages/popup';
|
||||
import { mount } from 'avoriaz';
|
||||
import { triggerTouch } from '../utils';
|
||||
|
||||
describe('Popup', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a popup', () => {
|
||||
wrapper = mount(Popup, {
|
||||
propsData: {
|
||||
position: 'bottom'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-popup')).to.be.true;
|
||||
expect(wrapper.instance().currentTransition).to.equal('popup-slide-bottom');
|
||||
});
|
||||
|
||||
it('create a show popup', (done) => {
|
||||
wrapper = mount(Popup, {
|
||||
propsData: {
|
||||
value: false,
|
||||
zIndex: 100,
|
||||
overlay: false,
|
||||
lockScroll: false
|
||||
}
|
||||
});
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
expect(wrapper.element.style.display).to.equal('none');
|
||||
|
||||
wrapper.vm.value = true;
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.element.style.display).to.equal('');
|
||||
expect(eventStub.calledWith('input'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('toggle popup show', () => {
|
||||
wrapper = mount(Popup, {
|
||||
propsData: {
|
||||
value: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.element.style.display).to.equal('');
|
||||
});
|
||||
|
||||
it('create a popup-fade transition popup', () => {
|
||||
wrapper = mount(Popup, {
|
||||
propsData: {
|
||||
transition: 'popup-fade'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-popup')).to.be.true;
|
||||
expect(wrapper.instance().currentTransition).to.equal('popup-fade');
|
||||
});
|
||||
|
||||
it('popup modal', (done) => {
|
||||
wrapper = mount(Popup, {
|
||||
propsData: {
|
||||
value: true
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$on('input', val => {
|
||||
wrapper.vm.value = val;
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-popup')).to.be.true;
|
||||
|
||||
setTimeout(() => {
|
||||
const modal = document.querySelector('.van-modal');
|
||||
triggerTouch(modal, 'touchstart', 0, 0);
|
||||
triggerTouch(modal, 'touchmove', 0, 10);
|
||||
triggerTouch(modal, 'touchmove', 0, 30);
|
||||
triggerTouch(modal, 'touchmove', 0, -30);
|
||||
expect(modal).to.exist;
|
||||
|
||||
modal.click();
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.value).to.be.false;
|
||||
done();
|
||||
}, 300);
|
||||
}, 300);
|
||||
});
|
||||
|
||||
it('popup prevent scroll', (done) => {
|
||||
wrapper = mount(Popup, {
|
||||
propsData: {
|
||||
value: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-popup')).to.be.true;
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.element.style.display).to.equal('');
|
||||
wrapper.vm.value = false;
|
||||
triggerTouch(document, 'touchstart', 0, 0);
|
||||
triggerTouch(document, 'touchmove', 0, 10);
|
||||
triggerTouch(document, 'touchmove', 0, 30);
|
||||
triggerTouch(document, 'touchmove', 0, -30);
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.element.style.display).to.equal('none');
|
||||
done();
|
||||
}, 500);
|
||||
}, 300);
|
||||
});
|
||||
|
||||
it('treat empty string as true for boolean props', () => {
|
||||
wrapper = mount(Popup, {
|
||||
propsData: {
|
||||
overlay: '',
|
||||
lockScroll: '',
|
||||
closeOnClickOverlay: ''
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.vm.lockScroll).to.be.true;
|
||||
});
|
||||
|
||||
it('get container prop', done => {
|
||||
const testNode = document.createElement('div');
|
||||
const testNode2 = document.createElement('div');
|
||||
document.body.appendChild(testNode);
|
||||
document.body.appendChild(testNode2);
|
||||
|
||||
wrapper = mount(Popup, {
|
||||
propsData: {
|
||||
getContainer: () => testNode
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.vm.$el.parentNode === testNode).to.be.true;
|
||||
wrapper.vm.getContainer = () => testNode2;
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.$el.parentNode === testNode2).to.be.true;
|
||||
wrapper.vm.getContainer = null;
|
||||
done();
|
||||
}, 100);
|
||||
});
|
||||
|
||||
it('watch overlay change', done => {
|
||||
const testNode = document.createElement('div');
|
||||
document.body.appendChild(testNode);
|
||||
|
||||
wrapper = mount(Popup, {
|
||||
propsData: {
|
||||
overlay: false,
|
||||
getContainer: () => testNode
|
||||
}
|
||||
});
|
||||
|
||||
expect(testNode.querySelectorAll('.van-modal').length).to.equal(0);
|
||||
wrapper.vm.overlay = true;
|
||||
setTimeout(() => {
|
||||
expect(testNode.querySelectorAll('.van-modal').length).to.equal(1);
|
||||
done();
|
||||
}, 100);
|
||||
});
|
||||
|
||||
it('popup lock scroll', done => {
|
||||
wrapper = mount(Popup, {
|
||||
propsData: {
|
||||
value: true
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
expect(document.body.classList.contains('van-overflow-hidden')).to.be.true;
|
||||
done();
|
||||
}, 50);
|
||||
});
|
||||
});
|
||||
@@ -1,82 +0,0 @@
|
||||
import Progress from 'packages/progress';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('Progress', () => {
|
||||
let wrapper;
|
||||
let bar;
|
||||
let pivot;
|
||||
const initProgressBar = function(propsData) {
|
||||
wrapper = mount(Progress, {
|
||||
propsData: propsData
|
||||
});
|
||||
bar = wrapper.find('.van-progress__portion')[0];
|
||||
pivot = wrapper.find('.van-progress__pivot')[0];
|
||||
};
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create active 3% progress bar', () => {
|
||||
initProgressBar({ percentage: 3 });
|
||||
|
||||
expect(wrapper.hasClass('van-progress')).to.be.true;
|
||||
expect(bar.is('span')).to.be.true;
|
||||
expect(bar.hasStyle('width', '3%'));
|
||||
|
||||
expect(pivot.is('span')).to.be.true;
|
||||
expect(pivot.hasStyle('left', '0%'));
|
||||
expect(pivot.hasStyle('marginLeft', '0'));
|
||||
expect(pivot.text()).to.equal('3%');
|
||||
});
|
||||
|
||||
it('create active 35% progress bar', () => {
|
||||
initProgressBar({ percentage: 35 });
|
||||
|
||||
expect(wrapper.hasClass('van-progress')).to.be.true;
|
||||
expect(bar.is('span')).to.be.true;
|
||||
expect(bar.hasStyle('width', '35%'));
|
||||
|
||||
expect(pivot.is('span')).to.be.true;
|
||||
expect(pivot.hasStyle('left', '35%'));
|
||||
expect(pivot.hasStyle('marginLeft', '-14px'));
|
||||
expect(pivot.text()).to.equal('35%');
|
||||
});
|
||||
|
||||
it('create active 98% progress bar', () => {
|
||||
initProgressBar({ percentage: 98 });
|
||||
|
||||
expect(wrapper.hasClass('van-progress')).to.be.true;
|
||||
expect(bar.is('span')).to.be.true;
|
||||
expect(bar.hasStyle('width', '98%'));
|
||||
|
||||
expect(pivot.is('span')).to.be.true;
|
||||
expect(pivot.hasStyle('left', '100%'));
|
||||
expect(pivot.hasStyle('marginLeft', '-28px'));
|
||||
expect(pivot.text()).to.equal('98%');
|
||||
});
|
||||
|
||||
it('create inactive 35% progress bar', () => {
|
||||
initProgressBar({ percentage: 35, inactive: true });
|
||||
|
||||
expect(pivot.hasStyle('backgroundColor', '#cacaca'));
|
||||
});
|
||||
|
||||
it('create progress bar with custom text', () => {
|
||||
initProgressBar({ percentage: 35, pivotText: 'pivotText' });
|
||||
|
||||
expect(pivot.text()).to.equal('pivotText');
|
||||
});
|
||||
|
||||
it('create progress bar with custom color', () => {
|
||||
initProgressBar({ percentage: 35, color: 'red' });
|
||||
|
||||
expect(pivot.hasStyle('backgroundColor', 'red'));
|
||||
});
|
||||
|
||||
it('create progress bar with text color', () => {
|
||||
initProgressBar({ percentage: 35, textColor: 'red' });
|
||||
|
||||
expect(pivot.hasStyle('color', 'red'));
|
||||
});
|
||||
});
|
||||
@@ -1,139 +0,0 @@
|
||||
import PullRefresh from 'packages/pull-refresh';
|
||||
import { mount } from 'avoriaz';
|
||||
import { triggerTouch } from '../utils';
|
||||
|
||||
describe('PullRefresh', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a PullRefresh', () => {
|
||||
wrapper = mount(PullRefresh, {
|
||||
propsData: {
|
||||
value: false
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-pull-refresh')).to.be.true;
|
||||
});
|
||||
|
||||
it('change head content when pulling down', (done) => {
|
||||
wrapper = mount(PullRefresh, {
|
||||
propsData: {
|
||||
value: false
|
||||
}
|
||||
});
|
||||
|
||||
const track = wrapper.find('.van-pull-refresh__track')[0];
|
||||
triggerTouch(track, 'touchstart', 0, 0);
|
||||
triggerTouch(track, 'touchmove', 0, 10);
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-pull-refresh__text')[0].text()).to.equal('下拉即可刷新...');
|
||||
|
||||
triggerTouch(track, 'touchmove', 0, 30);
|
||||
triggerTouch(track, 'touchmove', 0, 60);
|
||||
triggerTouch(track, 'touchmove', 0, 100);
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-pull-refresh__text')[0].text()).to.equal('释放即可刷新...');
|
||||
|
||||
triggerTouch(track, 'touchend', 0, 100);
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-pull-refresh__loading span')[1].text()).to.equal('加载中...');
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('change loading status when pulling down', (done) => {
|
||||
wrapper = mount(PullRefresh, {
|
||||
propsData: {
|
||||
value: false
|
||||
}
|
||||
});
|
||||
|
||||
const refreshSpy = sinon.spy();
|
||||
wrapper.vm.$on('refresh', refreshSpy);
|
||||
|
||||
wrapper.vm.$on('input', value => {
|
||||
wrapper.vm.value = value;
|
||||
|
||||
setTimeout(() => {
|
||||
wrapper.vm.value = false;
|
||||
expect(refreshSpy.calledOnce).to.be.true;
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.status).to.equal('normal');
|
||||
done();
|
||||
}, 0);
|
||||
}, 30);
|
||||
});
|
||||
|
||||
const track = wrapper.find('.van-pull-refresh__track')[0];
|
||||
triggerTouch(track, 'touchstart', 0, 0);
|
||||
triggerTouch(track, 'touchmove', 0, 100);
|
||||
triggerTouch(track, 'touchend', 0, 100);
|
||||
|
||||
expect(wrapper.vm.value).to.be.true;
|
||||
expect(wrapper.vm.status).to.equal('loading');
|
||||
|
||||
// ignore touch event when loading
|
||||
triggerTouch(track, 'touchstart', 0, 0);
|
||||
triggerTouch(track, 'touchmove', 0, 100);
|
||||
triggerTouch(track, 'touchend', 0, 100);
|
||||
});
|
||||
|
||||
it('pull a short distance', () => {
|
||||
wrapper = mount(PullRefresh, {
|
||||
propsData: {
|
||||
value: false
|
||||
}
|
||||
});
|
||||
|
||||
const track = wrapper.find('.van-pull-refresh__track')[0];
|
||||
triggerTouch(track, 'touchstart', 0, 0);
|
||||
triggerTouch(track, 'touchmove', 0, 10);
|
||||
triggerTouch(track, 'touchend', 0, 10);
|
||||
|
||||
expect(wrapper.vm.value).to.be.false;
|
||||
expect(wrapper.vm.status).to.equal('normal');
|
||||
});
|
||||
|
||||
it('not in page top', () => {
|
||||
wrapper = mount(PullRefresh, {
|
||||
propsData: {
|
||||
value: false
|
||||
}
|
||||
});
|
||||
|
||||
window.scrollTop = 100;
|
||||
|
||||
const track = wrapper.find('.van-pull-refresh__track')[0];
|
||||
// ignore touch event when not at page top
|
||||
triggerTouch(track, 'touchstart', 0, 0);
|
||||
triggerTouch(track, 'touchmove', 0, 100);
|
||||
triggerTouch(track, 'touchend', 0, 100);
|
||||
expect(wrapper.vm.ceiling).to.be.false;
|
||||
|
||||
window.scrollTop = 0;
|
||||
triggerTouch(track, 'touchmove', 0, 100);
|
||||
expect(wrapper.vm.ceiling).to.be.true;
|
||||
});
|
||||
|
||||
it('horizontal direction', () => {
|
||||
wrapper = mount(PullRefresh, {
|
||||
propsData: {
|
||||
value: false
|
||||
}
|
||||
});
|
||||
|
||||
const track = wrapper.find('.van-pull-refresh__track')[0];
|
||||
triggerTouch(track, 'touchstart', 0, 0);
|
||||
triggerTouch(track, 'touchmove', 10, 0);
|
||||
triggerTouch(track, 'touchend', 10, 0);
|
||||
expect(wrapper.vm.direction).to.equal('horizontal');
|
||||
});
|
||||
});
|
||||
@@ -1,115 +0,0 @@
|
||||
import { mount } from 'avoriaz';
|
||||
import Radio from 'packages/radio';
|
||||
import RadioTestComponent from '../components/radio';
|
||||
|
||||
describe('RadioGroup', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a radio-group', () => {
|
||||
wrapper = mount(RadioTestComponent);
|
||||
|
||||
expect(wrapper.hasClass('van-radio-group')).to.be.true;
|
||||
|
||||
expect(wrapper.vNode.child.value).to.equal('1');
|
||||
expect(wrapper.vNode.child.disabled).to.be.false;
|
||||
});
|
||||
|
||||
it('emit a change event', (done) => {
|
||||
wrapper = mount(RadioTestComponent);
|
||||
|
||||
expect(wrapper.vNode.child.value).to.equal('1');
|
||||
const eventStub = sinon.stub(wrapper.vNode.child, '$emit');
|
||||
|
||||
wrapper.setData({
|
||||
'radio': '2'
|
||||
});
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vNode.child.value).to.equal('2');
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('change'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('click on unchecked radio', (done) => {
|
||||
wrapper = mount(RadioTestComponent);
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vNode.child, '$emit');
|
||||
|
||||
const uncheckedRadioLabel = wrapper.find('.van-radio')[1].find('.van-radio__label')[0];
|
||||
uncheckedRadioLabel.trigger('click');
|
||||
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('input'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('Radio', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a radio', () => {
|
||||
wrapper = mount(Radio, {
|
||||
propsData: {
|
||||
value: '1',
|
||||
name: '1',
|
||||
disabled: false
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-radio')).to.be.true;
|
||||
expect(wrapper.hasClass('van-radio--disabled')).to.be.false;
|
||||
expect(wrapper.instance().currentValue).to.equal('1');
|
||||
expect(wrapper.instance().isDisabled).to.be.false;
|
||||
});
|
||||
|
||||
it('click on a radio', (done) => {
|
||||
wrapper = mount(Radio, {
|
||||
propsData: {
|
||||
value: '1',
|
||||
name: '1',
|
||||
disabled: false
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-radio')).to.be.true;
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
|
||||
wrapper.trigger('click');
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('click'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('click on a disabled radio', () => {
|
||||
wrapper = mount(Radio, {
|
||||
propsData: {
|
||||
value: '1',
|
||||
name: '2',
|
||||
disabled: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-radio')).to.be.true;
|
||||
expect(wrapper.hasClass('van-radio--disabled')).to.be.true;
|
||||
expect(wrapper.instance().currentValue).to.equal('1');
|
||||
expect(wrapper.instance().isDisabled).to.be.true;
|
||||
|
||||
wrapper.trigger('click');
|
||||
|
||||
expect(wrapper.instance().currentValue).to.equal('1');
|
||||
});
|
||||
});
|
||||
@@ -1,104 +0,0 @@
|
||||
import Search from 'packages/search';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('Search', () => {
|
||||
let wrapper;
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a search', () => {
|
||||
wrapper = mount(Search);
|
||||
|
||||
expect(wrapper.hasClass('van-search')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a search with searchText', (done) => {
|
||||
wrapper = mount(Search, {
|
||||
propsData: {
|
||||
value: 'search text'
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
const input = wrapper.find('input')[0];
|
||||
expect(input.element.value === 'search text').to.be.true;
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('emit input event', () => {
|
||||
wrapper = mount(Search);
|
||||
|
||||
const input = wrapper.find('input')[0];
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
input.trigger('input', { target: { value: 'search' }});
|
||||
|
||||
expect(eventStub.calledOnce).to.be.true;
|
||||
expect(eventStub.calledWith('input')).to.be.true;
|
||||
});
|
||||
|
||||
it('handle clean click and refocus', (done) => {
|
||||
wrapper = mount(Search);
|
||||
|
||||
let value = 'test';
|
||||
wrapper.setProps({ value });
|
||||
|
||||
const focusSpy = sinon.spy();
|
||||
wrapper.vm.$on('focus', focusSpy);
|
||||
|
||||
const inputSpy = sinon.spy();
|
||||
wrapper.vm.$on('input', val => {
|
||||
value = val;
|
||||
inputSpy();
|
||||
});
|
||||
|
||||
const input = wrapper.find('input')[0];
|
||||
input.trigger('focus');
|
||||
|
||||
const cleanBtn = wrapper.find('.van-field__icon')[0];
|
||||
cleanBtn.trigger('touchstart');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(inputSpy.calledOnce).to.be.true;
|
||||
expect(value).to.equal('');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('handle cancel click', (done) => {
|
||||
wrapper = mount(Search);
|
||||
|
||||
wrapper.setProps({ value: 'test', showAction: true });
|
||||
expect(wrapper.vm.value).to.be.equal('test');
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
|
||||
const cancelBtn = wrapper.find('.van-search__cancel')[0];
|
||||
cancelBtn.trigger('click');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledTwice).to.be.true;
|
||||
expect(eventStub.calledWith('input'));
|
||||
expect(eventStub.calledWith('change'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('emit a search event', () => {
|
||||
wrapper = mount(Search);
|
||||
|
||||
const searchSpy = sinon.spy();
|
||||
wrapper.vm.$on('search', searchSpy);
|
||||
|
||||
const input = wrapper.find('input')[0];
|
||||
input.trigger('keypress.enter');
|
||||
expect(searchSpy.calledOnce).to.be.true;
|
||||
|
||||
const keypressSpy = sinon.spy();
|
||||
wrapper.vm.$on('keypress', keypressSpy);
|
||||
input.trigger('keypress.a');
|
||||
expect(keypressSpy.calledOnce).to.be.true;
|
||||
});
|
||||
});
|
||||
@@ -1,402 +0,0 @@
|
||||
import Sku from 'packages/sku';
|
||||
import Uploader from 'packages/uploader';
|
||||
import Toast from 'packages/toast';
|
||||
import { mount } from 'avoriaz';
|
||||
import { DOMChecker } from '../utils';
|
||||
import skuMockData from '../../docs/demos/mock/sku';
|
||||
|
||||
const data = skuMockData['zh-CN'];
|
||||
const { skuHelper } = Sku;
|
||||
const goods = data.goods_info;
|
||||
const initialSku = {
|
||||
s1: '30349',
|
||||
s2: '1193'
|
||||
};
|
||||
const repeat = (str, count) => {
|
||||
let result = '';
|
||||
for (let i = 0; i < count; i++) {
|
||||
result += str;
|
||||
}
|
||||
return result;
|
||||
};
|
||||
|
||||
const File = function() {
|
||||
this.name = 'test';
|
||||
this.size = 10000;
|
||||
};
|
||||
|
||||
const mockFile = new File([], '/Users');
|
||||
|
||||
describe('Sku', (done) => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('default', (done) => {
|
||||
wrapper = mount(Sku, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
value: true,
|
||||
sku: data.sku,
|
||||
goodsId: data.goods_id,
|
||||
goods: goods,
|
||||
resetStepperOnHide: true,
|
||||
resetSelectedSkuOnHide: true
|
||||
}
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
text: {
|
||||
'.van-sku__goods-name': goods.title,
|
||||
'.van-sku__price-num': '1.00'
|
||||
},
|
||||
value: {
|
||||
'.van-stepper__input': '1'
|
||||
},
|
||||
src: {
|
||||
'.van-sku-header__img-wrap img': 'https://img.yzcdn.cn/upload_files/2017/02/21/FjKTOxjVgnUuPmHJRdunvYky9OHP.jpg!100x100.jpg'
|
||||
}
|
||||
});
|
||||
|
||||
// 测试默认选中
|
||||
const selectedSku = skuHelper.getSelectedSkuValues(data.sku.tree, wrapper.vm.selectedSku);
|
||||
expect(selectedSku[0].id).to.equal('30349');
|
||||
|
||||
// 测试sku图片
|
||||
const firstSku = wrapper.find('.van-sku-row__item')[0];
|
||||
firstSku.trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
DOMChecker(wrapper, {
|
||||
src: {
|
||||
'.van-sku-header__img-wrap img': 'https://img.yzcdn.cn/upload_files/2017/03/16/Fs_OMbSFPa183sBwvG_94llUYiLa.jpeg?imageView2/2/w/100/h/100/q/75/format/jpg'
|
||||
}
|
||||
});
|
||||
|
||||
// 关闭sku弹层
|
||||
const closeCallback = sinon.spy();
|
||||
const closeIcon = wrapper.find('.van-sku__close-icon')[0];
|
||||
wrapper.vm.$on('sku-close', closeCallback);
|
||||
closeIcon.trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(closeCallback.calledOnce).to.be.true;
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should trigger an event or toast error when click buy and addCart', (done) => {
|
||||
wrapper = mount(Sku, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
value: true,
|
||||
sku: data.sku,
|
||||
goodsId: data.goods_id,
|
||||
goods: goods
|
||||
}
|
||||
});
|
||||
|
||||
const buyCallback = sinon.spy();
|
||||
const addCartCallback = sinon.spy();
|
||||
const buyBtn = wrapper.find('.van-button--bottom-action')[1];
|
||||
const addCartBtn = wrapper.find('.van-button--bottom-action')[0];
|
||||
wrapper.vm.$on('buy-clicked', buyCallback);
|
||||
wrapper.vm.$on('add-cart', addCartCallback);
|
||||
|
||||
// 未选择完整规格时，弹出toast提示
|
||||
buyBtn.trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
const toastText = document.querySelector('.van-toast div');
|
||||
expect(toastText.textContent).to.equal('请选择完整的规格');
|
||||
expect(buyCallback.calledOnce).to.be.false;
|
||||
|
||||
// 选择完整规格时，未填留言时，弹出toast提示。
|
||||
wrapper.find('.van-sku-row')[1].find('.van-sku-row__item')[0].trigger('click');
|
||||
buyBtn.trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(toastText.textContent).to.equal('请填写留言1');
|
||||
expect(buyCallback.calledOnce).to.be.false;
|
||||
|
||||
// 触发buy-clicked事件
|
||||
const requiredMessage = wrapper.find('.van-cell--required .van-field__control')[0];
|
||||
requiredMessage.element.value = 'test';
|
||||
requiredMessage.trigger('input');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
buyBtn.trigger('click');
|
||||
addCartBtn.trigger('click');
|
||||
expect(buyCallback.calledOnce).to.be.true;
|
||||
expect(addCartCallback.calledOnce).to.be.true;
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should modify current num or toast error when change step value', (done) => {
|
||||
wrapper = mount(Sku, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
value: true,
|
||||
sku: data.sku,
|
||||
goodsId: data.goods_id,
|
||||
goods: goods,
|
||||
quota: data.quota,
|
||||
quotaUsed: data.quota_used
|
||||
}
|
||||
});
|
||||
|
||||
// 点击减号
|
||||
const minusBtn = wrapper.find('.van-stepper__minus')[0];
|
||||
minusBtn.trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
const toastText = document.querySelector('.van-toast div');
|
||||
expect(toastText.textContent).to.equal('至少选择一件');
|
||||
|
||||
// 手动修改购买数量
|
||||
const stepperInput = wrapper.find('.van-stepper__input')[0];
|
||||
stepperInput.element.value = 20;
|
||||
stepperInput.trigger('input');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(+stepperInput.element.value).to.equal(data.quota - data.quota_used);
|
||||
|
||||
// 达到购买上限时，点击加号
|
||||
const plusBtn = wrapper.find('.van-stepper__plus')[0];
|
||||
plusBtn.trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(toastText.textContent).to.equal(`限购${data.quota}件`);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should toast custom error when change step value', (done) => {
|
||||
wrapper = mount(Sku, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
value: true,
|
||||
sku: data.sku,
|
||||
goodsId: data.goods_id,
|
||||
goods: goods,
|
||||
quota: data.quota,
|
||||
quotaUsed: data.quota_used,
|
||||
customStepperConfig: {
|
||||
quotaText: '单次限购100件',
|
||||
handleOverLimit: (data) => {
|
||||
const { action, limitType, quota } = data;
|
||||
|
||||
if (action === 'minus') {
|
||||
Toast('至少选择一件商品');
|
||||
} else if (action === 'plus') {
|
||||
if (limitType === 0) {
|
||||
Toast(`限购${quota}件`);
|
||||
} else {
|
||||
Toast('库存不够了~~');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 点击减号
|
||||
const minusBtn = wrapper.find('.van-stepper__minus')[0];
|
||||
minusBtn.trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
const toastText = document.querySelector('.van-toast div');
|
||||
expect(toastText.textContent).to.equal('至少选择一件商品');
|
||||
|
||||
// 手动修改购买数量
|
||||
const stepperInput = wrapper.find('.van-stepper__input')[0];
|
||||
stepperInput.element.value = 20;
|
||||
stepperInput.trigger('input');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(+stepperInput.element.value).to.equal(data.quota - data.quota_used);
|
||||
|
||||
// 达到购买上限时，点击加号
|
||||
const plusBtn = wrapper.find('.van-stepper__plus')[0];
|
||||
plusBtn.trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(toastText.textContent).to.equal(`限购${data.quota}件`);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should not render sku group when none_sku is true', (done) => {
|
||||
const newSku = {
|
||||
...data.sku,
|
||||
none_sku: true
|
||||
};
|
||||
|
||||
wrapper = mount(Sku, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
value: false,
|
||||
sku: newSku,
|
||||
goodsId: data.goods_id,
|
||||
goods: goods
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.value = true;
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-sku-group-container').length).to.equal(0);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('should toast error when sku messages fail to pass validation', (done) => {
|
||||
wrapper = mount(Sku, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
initialSku,
|
||||
value: true,
|
||||
sku: data.sku,
|
||||
goodsId: data.goods_id,
|
||||
goods: goods,
|
||||
messageConfig: {
|
||||
uploadImg: () => {
|
||||
return new Promise((resolve) => {
|
||||
setTimeout(() => resolve('https://img.yzcdn.cn/upload_files/2017/02/21/FjKTOxjVgnUuPmHJRdunvYky9OHP.jpg!100x100.jpg'), 1000);
|
||||
});
|
||||
},
|
||||
uploadMaxSize: 3
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const buyBtn = wrapper.find('.van-button--bottom-action')[0];
|
||||
const skuMessages = wrapper.find('.van-sku-messages')[0];
|
||||
const inputs = skuMessages.find('input');
|
||||
const textarea = skuMessages.find('textarea')[0];
|
||||
const uploader = wrapper.find(Uploader)[0];
|
||||
// 修改留言内容
|
||||
inputs[0].element.value = 123;
|
||||
// 测试身份证号
|
||||
inputs[1].element.value = 234;
|
||||
inputs[0].trigger('input');
|
||||
inputs[1].trigger('input');
|
||||
// 测试图片
|
||||
uploader.vm.onChange({ target: { files: [mockFile] }});
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
// 点击购买
|
||||
buyBtn.trigger('click');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
const toastText = document.querySelector('.van-toast div');
|
||||
expect(toastText.textContent).to.equal('请填写正确的身份证号码');
|
||||
|
||||
inputs[1].element.value = 330101198801012211;
|
||||
// 测试textarea字数限制
|
||||
textarea.element.value = repeat('*', 201);
|
||||
inputs[1].trigger('input');
|
||||
textarea.trigger('input');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
buyBtn.trigger('click');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(toastText.textContent).to.equal('留言4 写的太多了，不要超过200字');
|
||||
|
||||
textarea.element.value = '';
|
||||
// 测试数字留言
|
||||
inputs[3].element.value = 'abc';
|
||||
textarea.trigger('input');
|
||||
inputs[3].trigger('input');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
buyBtn.trigger('click');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(toastText.textContent).to.equal('请填写正确的数字格式留言');
|
||||
|
||||
inputs[3].element.value = 0;
|
||||
inputs[4].element.value = 345;
|
||||
inputs[3].trigger('input');
|
||||
inputs[4].trigger('input');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
buyBtn.trigger('click');
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(toastText.textContent).to.equal('请填写正确的邮箱');
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should toast error when there is no stock', (done) => {
|
||||
/* eslint-disable */
|
||||
const newData = Object.assign({}, data);
|
||||
newData.sku.stock_num = 0;
|
||||
newData.sku.messages = [];
|
||||
newData.sku.list.forEach((item) => {
|
||||
item.stock_num = 0;
|
||||
});
|
||||
/* eslint-enable */
|
||||
|
||||
wrapper = mount(Sku, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
initialSku,
|
||||
value: true,
|
||||
sku: newData.sku,
|
||||
goodsId: newData.goods_id,
|
||||
goods: goods
|
||||
}
|
||||
});
|
||||
|
||||
const buyBtn = wrapper.find('.van-button--bottom-action')[0];
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
buyBtn.trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
const plusBtn = wrapper.find('.van-stepper__plus')[0];
|
||||
plusBtn.trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should reset values when sku change', (done) => {
|
||||
wrapper = mount(Sku, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
value: true,
|
||||
sku: data.sku,
|
||||
goodsId: data.goods_id,
|
||||
goods: goods,
|
||||
resetStepperOnHide: true,
|
||||
resetSelectedSkuOnHide: true
|
||||
}
|
||||
});
|
||||
|
||||
const newSku = {
|
||||
...data.sku,
|
||||
tree: [],
|
||||
list: [],
|
||||
messages: [],
|
||||
none_sku: true
|
||||
};
|
||||
|
||||
wrapper.vm.sku = newSku;
|
||||
const skuMessages = wrapper.find(Sku.SkuMessages)[0];
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.selectedSku).to.be.empty;
|
||||
expect(skuMessages.vm.messageValues).to.be.empty;
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1,90 +0,0 @@
|
||||
import Slider from 'packages/slider';
|
||||
import { mount } from 'avoriaz';
|
||||
import { triggerTouch } from '../utils';
|
||||
|
||||
describe('Slider', () => {
|
||||
let wrapper;
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a simple slider', () => {
|
||||
wrapper = mount(Slider, {
|
||||
propsData: {
|
||||
value: 50,
|
||||
disabled: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-slider')).to.be.true;
|
||||
expect(wrapper.find('.van-slider__bar').length).to.equal(1);
|
||||
expect(wrapper.vm.value).to.equal(50);
|
||||
expect(wrapper.hasClass('van-slider--disabled')).to.equal(true);
|
||||
|
||||
wrapper.setProps({
|
||||
value: 100
|
||||
});
|
||||
wrapper.update();
|
||||
|
||||
expect(wrapper.vm.value).to.equal(100);
|
||||
});
|
||||
|
||||
it('test click bar', () => {
|
||||
wrapper = mount(Slider, {
|
||||
propsData: {
|
||||
disabled: true,
|
||||
value: 50
|
||||
}
|
||||
});
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
const $bar = wrapper.find('.van-slider')[0];
|
||||
$bar.trigger('click');
|
||||
const button = wrapper.find('.van-slider__button')[0];
|
||||
triggerTouch(button, 'touchstart', 0, 0);
|
||||
expect(wrapper.vm.startX).to.equal(undefined);
|
||||
|
||||
triggerTouch(button, 'touchmove', 50, 0);
|
||||
expect(wrapper.vm.offsetX).to.equal(undefined);
|
||||
|
||||
triggerTouch(button, 'touchend', 50, 0);
|
||||
expect(wrapper.vm.offsetX).to.equal(undefined);
|
||||
|
||||
expect(eventStub.called).to.equal(false);
|
||||
|
||||
wrapper.setData({
|
||||
disabled: false
|
||||
});
|
||||
wrapper.update();
|
||||
$bar.trigger('click');
|
||||
|
||||
expect(wrapper.vm.disabled).to.equal(false);
|
||||
expect(eventStub.called).to.equal(true);
|
||||
});
|
||||
|
||||
it('drag button', () => {
|
||||
wrapper = mount(Slider, {
|
||||
propsData: {
|
||||
value: 50
|
||||
}
|
||||
});
|
||||
|
||||
const button = wrapper.find('.van-slider__button')[0];
|
||||
triggerTouch(button, 'touchstart', 0, 0);
|
||||
expect(wrapper.vm.startX).to.equal(0);
|
||||
|
||||
triggerTouch(button, 'touchmove', 50, 0);
|
||||
expect(wrapper.vm.offsetX).to.equal(50);
|
||||
|
||||
triggerTouch(button, 'touchend', 50, 0);
|
||||
expect(wrapper.vm.offsetX).to.equal(50);
|
||||
|
||||
wrapper.setData({
|
||||
disabled: true
|
||||
});
|
||||
|
||||
triggerTouch(button, 'touchstart', 0, 0);
|
||||
expect(wrapper.vm.startX).to.equal(0);
|
||||
});
|
||||
});
|
||||
@@ -1,152 +0,0 @@
|
||||
import Stepper from 'packages/stepper';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('Stepper', () => {
|
||||
let wrapper;
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a stepper', () => {
|
||||
wrapper = mount(Stepper, {
|
||||
propsData: {
|
||||
defaultValue: 1
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-stepper')).to.be.true;
|
||||
expect(wrapper.data().currentValue).to.equal(1);
|
||||
|
||||
const plusButton = wrapper.find('.van-stepper__plus')[0];
|
||||
plusButton.trigger('click');
|
||||
|
||||
expect(wrapper.data().currentValue).to.equal(2);
|
||||
|
||||
const minusButton = wrapper.find('.van-stepper__minus')[0];
|
||||
minusButton.trigger('click');
|
||||
expect(wrapper.data().currentValue).to.equal(1);
|
||||
});
|
||||
|
||||
it('create a disabled stepper', (done) => {
|
||||
wrapper = mount(Stepper, {
|
||||
propsData: {
|
||||
disabled: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-stepper')).to.be.true;
|
||||
const minusButton = wrapper.find('.van-stepper__minus')[0];
|
||||
expect(minusButton.hasClass('van-stepper__minus--disabled')).to.be.true;
|
||||
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
minusButton.trigger('click');
|
||||
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledWith('overlimit'));
|
||||
done();
|
||||
});
|
||||
|
||||
const plusButton = wrapper.find('.van-stepper__plus')[0];
|
||||
expect(plusButton.hasClass('van-stepper__plus--disabled')).to.be.true;
|
||||
|
||||
plusButton.trigger('click');
|
||||
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.calledWith('overlimit'));
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('only disable stepper input', () => {
|
||||
wrapper = mount(Stepper, {
|
||||
propsData: {
|
||||
disableInput: true
|
||||
}
|
||||
});
|
||||
|
||||
const input = wrapper.find('.van-stepper__input')[0];
|
||||
expect(input.hasAttribute('disabled', 'disabled')).to.be.true;
|
||||
});
|
||||
|
||||
it('update stepper value use v-model', (done) => {
|
||||
wrapper = mount(Stepper, {
|
||||
propsData: {
|
||||
value: 1
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-stepper')).to.be.true;
|
||||
|
||||
wrapper.vm.value = 2;
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.currentValue).to.equal(2);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('correct value when value is not correct', (done) => {
|
||||
wrapper = mount(Stepper, {
|
||||
propsData: {
|
||||
value: 50,
|
||||
max: 30
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-stepper')).to.be.true;
|
||||
expect(wrapper.vm.currentValue).to.equal(30);
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
|
||||
wrapper.vm.value = 30;
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.currentValue).to.equal(30);
|
||||
expect(eventStub.calledWith('input'));
|
||||
|
||||
// value设置非数字时，则使用设置的最小值（默认1）
|
||||
wrapper.vm.value = 'abc';
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.currentValue).to.equal(1);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('handle when input change', (done) => {
|
||||
wrapper = mount(Stepper, {
|
||||
propsData: {
|
||||
value: 1
|
||||
}
|
||||
});
|
||||
|
||||
const input = wrapper.find('.van-stepper__input')[0];
|
||||
input.element.value = 2;
|
||||
input.trigger('input');
|
||||
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.data().currentValue).to.equal(2);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('should not fire any event on props changed', (done) => {
|
||||
wrapper = mount(Stepper, {
|
||||
propsData: {
|
||||
value: 1
|
||||
}
|
||||
});
|
||||
const eventStub = sinon.stub(wrapper.vm, '$emit');
|
||||
|
||||
wrapper.vm.value = 2;
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(eventStub.called).to.be.false;
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1,41 +0,0 @@
|
||||
import Steps from 'packages/steps';
|
||||
import { mount } from 'avoriaz';
|
||||
import StepsTestComponent from '../components/steps';
|
||||
|
||||
describe('Steps', () => {
|
||||
let wrapper;
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a steps', () => {
|
||||
wrapper = mount(Steps);
|
||||
|
||||
expect(wrapper.hasClass('van-steps')).to.be.true;
|
||||
expect(wrapper.data().steps.length).to.equal(0);
|
||||
});
|
||||
|
||||
it('create a steps with step', () => {
|
||||
wrapper = mount(StepsTestComponent);
|
||||
|
||||
const finishStep = wrapper.find('.van-step')[0];
|
||||
expect(finishStep.hasClass('van-step--finish')).to.be.true;
|
||||
expect(finishStep.hasClass('van-step--horizontal')).to.be.true;
|
||||
|
||||
const proccessStep = wrapper.find('.van-step')[1];
|
||||
expect(proccessStep.hasClass('van-step--process')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a vertical step', () => {
|
||||
wrapper = mount(Steps, {
|
||||
propsData: {
|
||||
direction: 'vertical'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-steps')).to.be.true;
|
||||
expect(wrapper.hasClass('van-steps--vertical')).to.be.true;
|
||||
expect(wrapper.data().steps.length).to.equal(0);
|
||||
});
|
||||
});
|
||||
@@ -1,100 +0,0 @@
|
||||
import SubmitBar from 'packages/submit-bar';
|
||||
import { mount } from 'avoriaz';
|
||||
import { DOMChecker } from '../utils';
|
||||
|
||||
describe('SubmitBar', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('default', () => {
|
||||
const props = {
|
||||
price: 3050,
|
||||
buttonText: '提交订单',
|
||||
tip: '您的收货地址不支持同城送, 我们已为您推荐快递'
|
||||
};
|
||||
|
||||
wrapper = mount(SubmitBar, {
|
||||
propsData: props
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
text: {
|
||||
'.van-button__text': props.buttonText,
|
||||
'.van-submit-bar__price-integer': '¥30.',
|
||||
'.van-submit-bar__price-decimal': '50',
|
||||
'.van-submit-bar__tip': props.tip
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('no tip', () => {
|
||||
wrapper = mount(SubmitBar, {
|
||||
propsData: {
|
||||
price: 3005,
|
||||
buttonText: '提交订单',
|
||||
buttonType: 'default'
|
||||
}
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
text: {
|
||||
'.van-button__text': '提交订单',
|
||||
'.van-submit-bar__price-integer': '¥30.',
|
||||
'.van-submit-bar__price-decimal': '05',
|
||||
'.van-submit-bar__tip': ''
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('handle submit', () => {
|
||||
wrapper = mount(SubmitBar, {
|
||||
propsData: {
|
||||
price: 3005,
|
||||
buttonText: '提交订单'
|
||||
}
|
||||
});
|
||||
|
||||
const submitSpyFunc = sinon.spy();
|
||||
wrapper.vm.$on('submit', submitSpyFunc);
|
||||
wrapper.find('.van-button')[0].trigger('click');
|
||||
setTimeout(() => {
|
||||
expect(submitSpyFunc.calledOnce).to.be.true;
|
||||
}, 300);
|
||||
});
|
||||
|
||||
it('can not submit when disabled', (done) => {
|
||||
wrapper = mount(SubmitBar, {
|
||||
propsData: {
|
||||
disabled: true,
|
||||
buttonText: '提交订单'
|
||||
}
|
||||
});
|
||||
|
||||
const submitSpyFunc = sinon.spy();
|
||||
wrapper.vm.$on('submit', submitSpyFunc);
|
||||
wrapper.find('.van-button')[0].trigger('click');
|
||||
setTimeout(() => {
|
||||
expect(submitSpyFunc.calledOnce).to.be.false;
|
||||
done();
|
||||
}, 300);
|
||||
});
|
||||
|
||||
it('can not submit when loading', (done) => {
|
||||
wrapper = mount(SubmitBar, {
|
||||
propsData: {
|
||||
loading: true,
|
||||
buttonText: '提交订单'
|
||||
}
|
||||
});
|
||||
|
||||
const submitSpyFunc = sinon.spy();
|
||||
wrapper.vm.$on('submit', submitSpyFunc);
|
||||
wrapper.find('.van-button')[0].trigger('click');
|
||||
setTimeout(() => {
|
||||
expect(submitSpyFunc.calledOnce).to.be.false;
|
||||
done();
|
||||
}, 300);
|
||||
});
|
||||
});
|
||||
@@ -1,95 +0,0 @@
|
||||
import SwitchCell from 'packages/switch-cell';
|
||||
import { mount } from 'avoriaz';
|
||||
import { DOMChecker } from '../utils';
|
||||
|
||||
describe('SwitchCell', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('default', () => {
|
||||
wrapper = mount(SwitchCell, {
|
||||
attachToDocument: true
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
count: {
|
||||
'.van-switch--on': 0,
|
||||
'.van-switch--disabled': 0
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('set title', () => {
|
||||
wrapper = mount(SwitchCell, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
title: '测试标题'
|
||||
}
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
text: {
|
||||
'.van-cell__title span': '测试标题'
|
||||
},
|
||||
count: {
|
||||
'.van-switch--on': 0,
|
||||
'.van-switch--disabled': 0
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('checked', () => {
|
||||
wrapper = mount(SwitchCell, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
value: true
|
||||
}
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
count: {
|
||||
'.van-switch--on': 1,
|
||||
'.van-switch--disabled': 0
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('disabled', () => {
|
||||
wrapper = mount(SwitchCell, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
disabled: true
|
||||
}
|
||||
});
|
||||
|
||||
DOMChecker(wrapper, {
|
||||
count: {
|
||||
'.van-switch--on': 0,
|
||||
'.van-switch--disabled': 1
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('listen to change event', (done) => {
|
||||
wrapper = mount(SwitchCell, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
value: false
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$on('input', (value) => {
|
||||
wrapper.vm.value = value;
|
||||
});
|
||||
|
||||
wrapper.vm.$on('change', (value) => {
|
||||
expect(value).to.be.true;
|
||||
done();
|
||||
});
|
||||
|
||||
const switchEl = wrapper.find('.van-switch')[0];
|
||||
switchEl.trigger('click');
|
||||
});
|
||||
});
|
||||
@@ -1,87 +0,0 @@
|
||||
import Switch from 'packages/switch';
|
||||
import VanLoading from 'packages/loading';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('Switch', () => {
|
||||
let wrapper;
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create on switch', () => {
|
||||
wrapper = mount(Switch, {
|
||||
propsData: {
|
||||
value: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-switch')).to.be.true;
|
||||
expect(wrapper.hasClass('van-switch--on')).to.be.true;
|
||||
});
|
||||
|
||||
it('create loading switch', () => {
|
||||
wrapper = mount(Switch, {
|
||||
propsData: {
|
||||
loading: true
|
||||
}
|
||||
});
|
||||
const loading = wrapper.find(VanLoading)[0];
|
||||
|
||||
expect(wrapper.hasClass('van-switch')).to.be.true;
|
||||
expect(loading.isVueComponent).to.be.true;
|
||||
});
|
||||
|
||||
it('loading switch should be unclickable', () => {
|
||||
wrapper = mount(Switch, {
|
||||
propsData: {
|
||||
loading: true,
|
||||
value: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-switch--on')).to.be.true;
|
||||
wrapper.trigger('click');
|
||||
expect(wrapper.hasClass('van-switch--on')).to.be.true;
|
||||
});
|
||||
|
||||
it('create disabled switch', () => {
|
||||
wrapper = mount(Switch, {
|
||||
propsData: {
|
||||
disabled: true
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-switch')).to.be.true;
|
||||
expect(wrapper.hasClass('van-switch--disabled')).to.be.true;
|
||||
});
|
||||
|
||||
it('disabled switch should be unclickable', () => {
|
||||
wrapper = mount(Switch, {
|
||||
propsData: {
|
||||
disabled: true,
|
||||
value: false
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-switch--on')).to.be.false;
|
||||
wrapper.trigger('click');
|
||||
expect(wrapper.hasClass('van-switch--on')).to.be.false;
|
||||
});
|
||||
|
||||
it('click should toggle the switch', () => {
|
||||
wrapper = mount(Switch, {
|
||||
propsData: {
|
||||
value: false
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$on('input', val => {
|
||||
wrapper.vm.value = val;
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-switch--on')).to.be.false;
|
||||
wrapper.trigger('click');
|
||||
expect(wrapper.hasClass('van-switch--on')).to.be.true;
|
||||
});
|
||||
});
|
||||
@@ -1,23 +0,0 @@
|
||||
import TabbarExample from '../components/tabbar';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('Progress', () => {
|
||||
let wrapper;
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('Tabbar with four items', (done) => {
|
||||
wrapper = mount(TabbarExample);
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-tabbar-item').length).to.equal(4);
|
||||
|
||||
wrapper.find('.van-tabbar-item')[3].element.click();
|
||||
expect(wrapper.vm.active).to.equal(3);
|
||||
expect(wrapper.vm.changeRecord).to.equal(3);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1,166 +0,0 @@
|
||||
import Tabs from 'packages/tabs';
|
||||
import { mount } from 'avoriaz';
|
||||
import TabsTestComponent from '../components/tabs';
|
||||
import MoreTabsTestComponent from '../components/more-tabs';
|
||||
import { triggerTouch } from '../utils';
|
||||
|
||||
describe('Tabs', () => {
|
||||
let wrapper;
|
||||
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create a empty card tabs', () => {
|
||||
wrapper = mount(Tabs, {
|
||||
propsData: {
|
||||
type: 'card'
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.hasClass('van-tabs')).to.be.true;
|
||||
expect(wrapper.hasClass('van-tabs--card')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a tabs with four tab', (done) => {
|
||||
wrapper = mount(TabsTestComponent);
|
||||
|
||||
expect(wrapper.hasClass('van-tabs')).to.be.true;
|
||||
expect(wrapper.hasClass('van-tabs--line')).to.be.true;
|
||||
|
||||
const tabsContainer = wrapper.find('.van-tabs')[0];
|
||||
expect(tabsContainer.vNode.child.curActive).to.equal(0);
|
||||
|
||||
wrapper.vm.active = 1;
|
||||
wrapper.update();
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(tabsContainer.vNode.child.curActive).to.equal(1);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('listen click event', (done) => {
|
||||
wrapper = mount(TabsTestComponent, {
|
||||
attachToDocument: true
|
||||
});
|
||||
|
||||
const clickSpy = sinon.spy();
|
||||
wrapper.vm.$on('click', clickSpy);
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
const nTab = wrapper.find('.van-tab')[0];
|
||||
nTab.trigger('click');
|
||||
expect(clickSpy.calledOnce).to.be.true;
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('listen click disable event', (done) => {
|
||||
wrapper = mount(TabsTestComponent, {
|
||||
attachToDocument: true
|
||||
});
|
||||
|
||||
const clickDisabledSpy = sinon.spy();
|
||||
wrapper.vm.$on('disabled', clickDisabledSpy);
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
const nTab = wrapper.find('.van-tab')[2];
|
||||
nTab.trigger('click');
|
||||
expect(clickDisabledSpy.calledOnce).to.be.true;
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('check animation duration', () => {
|
||||
wrapper = mount(TabsTestComponent);
|
||||
|
||||
expect(wrapper.style.transitionDuration != '').to.be.true;
|
||||
});
|
||||
|
||||
it('create a tabs greater then 4', (done) => {
|
||||
wrapper = mount(MoreTabsTestComponent, {
|
||||
attachToDocument: true
|
||||
});
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
const nTab = wrapper.find('.van-tab')[4];
|
||||
nTab.trigger('click');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('create a tabs greater then 4 then click last tab', (done) => {
|
||||
wrapper = mount(MoreTabsTestComponent, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
active: 7
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
const nTab = wrapper.find('.van-tab')[6];
|
||||
nTab.trigger('click');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('watch tab props changes', (done) => {
|
||||
wrapper = mount(TabsTestComponent);
|
||||
wrapper.vm.firstTabTitle = '测试标题';
|
||||
wrapper.vm.firstTabDisabled = true;
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-tab')[0].text().replace(/\n|\s/g, '')).to.equal('测试标题');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('create a sticky tabs', (done) => {
|
||||
wrapper = mount(TabsTestComponent, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
sticky: true
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.sticky = false;
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.vm.$children[0].position).to.equal('content-top');
|
||||
done();
|
||||
}, 30);
|
||||
});
|
||||
|
||||
it('create a swipeable tabs', (done) => {
|
||||
wrapper = mount(TabsTestComponent, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
swipeable: true
|
||||
}
|
||||
});
|
||||
|
||||
const tabsContainer = wrapper.find('.van-tabs')[0];
|
||||
const tabContent = wrapper.find('.van-tabs__content')[0];
|
||||
|
||||
expect(tabsContainer.vNode.child.curActive).to.equal(0);
|
||||
|
||||
wrapper.vm.$nextTick(() => {
|
||||
triggerTouch(tabContent, 'touchstart', 0, 0);
|
||||
triggerTouch(tabContent, 'touchmove', -100, 0);
|
||||
triggerTouch(tabContent, 'touchend', 0, 0);
|
||||
|
||||
setTimeout(() => {
|
||||
expect(tabsContainer.vNode.child.curActive).to.equal(1);
|
||||
|
||||
triggerTouch(tabContent, 'touchstart', 0, 0);
|
||||
triggerTouch(tabContent, 'touchmove', 100, 0);
|
||||
triggerTouch(tabContent, 'touchend', 0, 0);
|
||||
|
||||
setTimeout(() => {
|
||||
expect(tabsContainer.vNode.child.curActive).to.equal(0);
|
||||
done();
|
||||
}, 500);
|
||||
}, 500);
|
||||
})
|
||||
});
|
||||
});
|
||||
@@ -1,21 +0,0 @@
|
||||
import Tag from 'packages/tag';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('Tag', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create without typeProps', () => {
|
||||
wrapper = mount(Tag);
|
||||
});
|
||||
|
||||
it('create with right typeProps', () => {
|
||||
wrapper = mount(Tag, {
|
||||
propsData: {
|
||||
type: 'primary'
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1,141 +0,0 @@
|
||||
import Vue from 'vue';
|
||||
import Toast from 'packages/toast';
|
||||
|
||||
describe('Toast', () => {
|
||||
afterEach(() => {
|
||||
Toast.clear(true);
|
||||
});
|
||||
|
||||
it('create a empty toast', () => {
|
||||
Toast();
|
||||
expect(document.querySelector('.van-toast')).to.exist;
|
||||
});
|
||||
|
||||
it('create a toast', () => {
|
||||
const toast = Toast('toast');
|
||||
|
||||
expect(document.querySelector('.van-toast')).to.exist;
|
||||
expect(toast.message).to.equal('toast');
|
||||
expect(toast.type).to.equal('text');
|
||||
expect(toast.displayStyle).to.equal('text');
|
||||
expect(typeof toast.timer).to.equal('number');
|
||||
});
|
||||
|
||||
it('create a loading toast', () => {
|
||||
const toast = Toast.loading();
|
||||
|
||||
expect(document.querySelector('.van-toast')).to.exist;
|
||||
expect(toast.type).to.equal('loading');
|
||||
});
|
||||
|
||||
it('create a options loading toast', () => {
|
||||
const toast = Toast.loading({
|
||||
message: 'toast'
|
||||
});
|
||||
|
||||
expect(document.querySelector('.van-toast')).to.exist;
|
||||
expect(toast.message).to.equal('toast');
|
||||
expect(toast.type).to.equal('loading');
|
||||
});
|
||||
|
||||
it('create a success toast', () => {
|
||||
const toast = Toast.success('success');
|
||||
|
||||
expect(document.querySelector('.van-toast')).to.exist;
|
||||
expect(toast.displayStyle).to.equal('default');
|
||||
expect(toast.type).to.equal('success');
|
||||
});
|
||||
|
||||
it('create a options success toast', () => {
|
||||
const toast = Toast.success({
|
||||
message: 'toast'
|
||||
});
|
||||
|
||||
expect(document.querySelector('.van-toast')).to.exist;
|
||||
expect(toast.message).to.equal('toast');
|
||||
expect(toast.type).to.equal('success');
|
||||
});
|
||||
|
||||
it('create a fail toast', () => {
|
||||
const toast = Toast.fail('fail');
|
||||
|
||||
expect(document.querySelector('.van-toast')).to.exist;
|
||||
expect(toast.displayStyle).to.equal('default');
|
||||
expect(toast.type).to.equal('fail');
|
||||
});
|
||||
|
||||
it('create a options fail toast', () => {
|
||||
const toast = Toast.fail({
|
||||
message: 'toast'
|
||||
});
|
||||
|
||||
expect(document.querySelector('.van-toast')).to.exist;
|
||||
expect(toast.message).to.equal('toast');
|
||||
expect(toast.type).to.equal('fail');
|
||||
});
|
||||
|
||||
it('create a forbidClick toast', (done) => {
|
||||
Toast({
|
||||
message: 'test',
|
||||
forbidClick: true
|
||||
});
|
||||
|
||||
expect(document.querySelector('.van-toast')).to.exist;
|
||||
setTimeout(() => {
|
||||
expect(document.querySelector('.van-modal')).to.exist;
|
||||
done();
|
||||
}, 50);
|
||||
});
|
||||
|
||||
it('toast disappeared after duration', (done) => {
|
||||
const toast = Toast({
|
||||
message: 'toast',
|
||||
duration: 10
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
expect(toast.$el.style.display === 'none').to.be.true;
|
||||
Toast.clear();
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
|
||||
it('toast duration 0', () => {
|
||||
Toast.allowMultiple();
|
||||
const toast = Toast({
|
||||
message: 'toast',
|
||||
duration: 0
|
||||
});
|
||||
expect(toast.timer).to.equal(undefined);
|
||||
Toast.allowMultiple(false);
|
||||
});
|
||||
|
||||
it('multiple toast', () => {
|
||||
Toast.allowMultiple();
|
||||
Toast.clear(true);
|
||||
const toast1 = Toast.success('1');
|
||||
const toast2 = Toast.success('2');
|
||||
Toast.clear();
|
||||
expect(toast1.value).to.be.false;
|
||||
expect(toast2.value).to.be.true;
|
||||
Toast.clear();
|
||||
Toast.clear();
|
||||
expect(toast2.value).to.be.false;
|
||||
Toast.allowMultiple(false);
|
||||
});
|
||||
|
||||
it('set default options', () => {
|
||||
Toast.setDefaultOptions({ duration: 1000 });
|
||||
const toast1 = Toast(1);
|
||||
expect(toast1.duration).to.equal(1000);
|
||||
|
||||
Toast.resetDefaultOptions();
|
||||
const toast2 = Toast(1);
|
||||
expect(toast2.duration).to.equal(3000);
|
||||
});
|
||||
|
||||
it('register component', () => {
|
||||
Vue.use(Toast);
|
||||
expect(!!Vue.component('van-toast')).to.be.true;
|
||||
});
|
||||
});
|
||||
@@ -1,68 +0,0 @@
|
||||
import TreeSelect from 'packages/tree-select';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('TreeSelect', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create an empty tree-select', () => {
|
||||
wrapper = mount(TreeSelect);
|
||||
expect(wrapper.hasStyle('height', '0px')).to.be.true;
|
||||
});
|
||||
|
||||
it('create a tree-select correctly', () => {
|
||||
wrapper = mount(TreeSelect, {
|
||||
propsData: {
|
||||
items: [{
|
||||
text: 'A',
|
||||
children: [{
|
||||
text: 'Cc',
|
||||
id: 123
|
||||
}]
|
||||
}],
|
||||
maxHeight: 200
|
||||
}
|
||||
});
|
||||
expect(wrapper.hasClass('van-tree-select')).to.be.true;
|
||||
expect(wrapper.hasStyle('height', '44px')).to.be.true;
|
||||
expect(wrapper.vm.maxHeight).to.equal(200);
|
||||
});
|
||||
|
||||
it('interact with this component', () => {
|
||||
wrapper = mount(TreeSelect, {
|
||||
propsData: {
|
||||
items: [{
|
||||
text: 'A',
|
||||
children: [{
|
||||
text: 'Cc',
|
||||
id: 123
|
||||
}, {
|
||||
text: 'Bb',
|
||||
id: 234
|
||||
}]
|
||||
}, {
|
||||
text: 'B',
|
||||
children: [{
|
||||
text: 'Nmi',
|
||||
id: 345
|
||||
}]
|
||||
}],
|
||||
maxHeight: 220
|
||||
}
|
||||
});
|
||||
wrapper.vm.$on('navclick', index => {
|
||||
wrapper.vm.mainActiveIndex = index;
|
||||
});
|
||||
wrapper.vm.$on('itemclick', item => {
|
||||
wrapper.vm.activeId = item.id;
|
||||
});
|
||||
const secondNav = wrapper.find('.van-tree-select__nitem')[1];
|
||||
secondNav.trigger('click');
|
||||
expect(wrapper.vm.mainActiveIndex).to.equal(1);
|
||||
const target = wrapper.find('.van-tree-select__item')[0];
|
||||
target.trigger('click');
|
||||
expect(wrapper.vm.activeId).to.equal(345);
|
||||
});
|
||||
});
|
||||
@@ -1,137 +0,0 @@
|
||||
import Uploader from 'packages/uploader';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
window.File = function() {
|
||||
this.name = 'test';
|
||||
this.size = 10000;
|
||||
};
|
||||
|
||||
window.FileReader = function() {
|
||||
this.readAsDataURL = this.readAsText = function() {
|
||||
this.onload && this.onload({
|
||||
target: {
|
||||
result: 'test'
|
||||
}
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
const mockFile = new File([], '/Users');
|
||||
|
||||
describe('Uploader', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('disabled', () => {
|
||||
const afterRead = sinon.spy();
|
||||
wrapper = mount(Uploader, {
|
||||
propsData: {
|
||||
disabled: true,
|
||||
afterRead
|
||||
}
|
||||
});
|
||||
|
||||
expect(wrapper.contains('input')).to.equal(true);
|
||||
wrapper.vm.onChange({ target: { files: [] }});
|
||||
expect(afterRead.calledOnce).to.be.false;
|
||||
});
|
||||
|
||||
it('before read', () => {
|
||||
const afterRead = sinon.spy();
|
||||
wrapper = mount(Uploader, {
|
||||
propsData: {
|
||||
beforeRead: () => false,
|
||||
afterRead
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.onChange({ target: { files: [mockFile] }});
|
||||
expect(afterRead.calledOnce).to.be.false;
|
||||
});
|
||||
|
||||
it('read text', done => {
|
||||
wrapper = mount(Uploader, {
|
||||
propsData: {
|
||||
resultType: 'text',
|
||||
afterRead: (file) => {
|
||||
expect(file.content).to.equal('test');
|
||||
done();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.onChange({ target: { files: [mockFile] }});
|
||||
});
|
||||
|
||||
it('read dataUrl', done => {
|
||||
wrapper = mount(Uploader, {
|
||||
propsData: {
|
||||
afterRead: (file) => {
|
||||
expect(file.content).to.equal('test');
|
||||
done();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.onChange({ target: { files: [mockFile] }});
|
||||
});
|
||||
|
||||
it('unknown resultType', () => {
|
||||
const afterRead = sinon.spy();
|
||||
wrapper = mount(Uploader, {
|
||||
propsData: {
|
||||
resultType: 'xxxx',
|
||||
afterRead
|
||||
}
|
||||
});
|
||||
wrapper.vm.onChange({ target: { files: [mockFile] }});
|
||||
expect(afterRead.calledOnce).to.be.false;
|
||||
});
|
||||
|
||||
it('read multiple files', done => {
|
||||
wrapper = mount(Uploader, {
|
||||
propsData: {
|
||||
afterRead: (file) => {
|
||||
expect(file.length).to.equal(2);
|
||||
done();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.onChange({ target: { files: [mockFile, mockFile] }});
|
||||
});
|
||||
|
||||
it('size overlimit', done => {
|
||||
const spy = sinon.spy();
|
||||
wrapper = mount(Uploader, {
|
||||
propsData: {
|
||||
maxSize: 1
|
||||
}
|
||||
});
|
||||
wrapper.vm.$on('oversize', spy);
|
||||
wrapper.vm.onChange({ target: { files: [mockFile] }});
|
||||
|
||||
setTimeout(() => {
|
||||
expect(spy.calledOnce).to.be.true;
|
||||
done();
|
||||
}, 50);
|
||||
});
|
||||
|
||||
it('multi file size overlimit', done => {
|
||||
const spy = sinon.spy();
|
||||
wrapper = mount(Uploader, {
|
||||
propsData: {
|
||||
maxSize: 1
|
||||
}
|
||||
});
|
||||
wrapper.vm.$on('oversize', spy);
|
||||
wrapper.vm.onChange({ target: { files: [mockFile, mockFile] }});
|
||||
|
||||
setTimeout(() => {
|
||||
expect(spy.calledOnce).to.be.true;
|
||||
done();
|
||||
}, 50);
|
||||
});
|
||||
});
|
||||
@@ -1,57 +0,0 @@
|
||||
import deepClone from 'packages/utils/deep-clone';
|
||||
import { isAndroid, isDef, camelize, get } from 'packages/utils';
|
||||
import { raf, cancel } from 'packages/utils/raf';
|
||||
|
||||
describe('Utils', () => {
|
||||
it('deepClone', () => {
|
||||
const a = { foo: 0 };
|
||||
const b = { foo: 0, bar: 1 };
|
||||
const fn = () => {};
|
||||
const arr = [a, b];
|
||||
expect(deepClone(a)).to.eql(a);
|
||||
expect(deepClone(b)).to.eql(b);
|
||||
expect(deepClone(fn)).to.eql(fn);
|
||||
expect(deepClone(arr)).to.eql(arr);
|
||||
expect(deepClone(undefined)).to.eql(undefined);
|
||||
expect(deepClone(1)).to.eql(1);
|
||||
});
|
||||
|
||||
it('isDef', () => {
|
||||
expect(isDef(null)).to.be.false;
|
||||
expect(isDef(undefined)).to.be.false;
|
||||
expect(isDef(1)).to.be.true;
|
||||
expect(isDef('1')).to.be.true;
|
||||
expect(isDef({})).to.be.true;
|
||||
expect(isDef(() => {})).to.be.true;
|
||||
});
|
||||
|
||||
it('camelize', () => {
|
||||
expect(camelize('ab')).to.equal('ab');
|
||||
expect(camelize('a-b')).to.equal('aB');
|
||||
expect(camelize('a-b-c-d')).to.equal('aBCD');
|
||||
expect(camelize('a-b-')).to.equal('aB-');
|
||||
expect(camelize('-a-b')).to.equal('AB');
|
||||
expect(camelize('-')).to.equal('-');
|
||||
});
|
||||
|
||||
it('get', () => {
|
||||
expect(get({ a: 1 }, 'a')).to.equal(1);
|
||||
expect(get({ a: { b: 2 }}, 'a.b')).to.equal(2);
|
||||
expect(get({ a: { b: 2 }}, 'a.b.c')).to.equal('');
|
||||
});
|
||||
|
||||
it('isAndroid', () => {
|
||||
expect(isAndroid()).to.be.false;
|
||||
});
|
||||
|
||||
it('raf', (done) => {
|
||||
const spy = sinon.spy();
|
||||
raf(spy);
|
||||
|
||||
setTimeout(() => {
|
||||
expect(spy.called).to.be.true;
|
||||
cancel(1);
|
||||
done();
|
||||
}, 50);
|
||||
});
|
||||
});
|
||||
@@ -1,91 +0,0 @@
|
||||
import Waterfall from '../components/waterfall/waterfall';
|
||||
import HiddenWaterfall from '../components/waterfall/waterfall-hide';
|
||||
import { mount } from 'avoriaz';
|
||||
|
||||
describe('Waterfall', () => {
|
||||
let wrapper;
|
||||
afterEach(() => {
|
||||
wrapper && wrapper.destroy();
|
||||
});
|
||||
|
||||
it('create', (done) => {
|
||||
const waterfallLowerSpy = sinon.spy();
|
||||
wrapper = mount(Waterfall, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
disabled: false,
|
||||
list: [],
|
||||
onWaterfallLower: waterfallLowerSpy
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
expect(waterfallLowerSpy.called).to.be.true;
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
|
||||
it('test waterfall lower function', (done) => {
|
||||
const waterfallLowerSpy = sinon.spy(function() {
|
||||
wrapper.vm.list = wrapper.vm.list.concat([{ id: 1 }, { id: 2 }, { id: 3 }]);
|
||||
wrapper.vm.disabled = true;
|
||||
});
|
||||
wrapper = mount(Waterfall, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
disabled: false,
|
||||
list: [{ id: 10 }],
|
||||
onWaterfallLower: waterfallLowerSpy
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
const item = wrapper.find('.waterfall-item');
|
||||
expect(waterfallLowerSpy.calledOnce).to.be.true;
|
||||
expect(item.length).to.equal(4);
|
||||
expect(item[item.length - 1].text()).to.equal('3');
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
|
||||
it('test waterfall upper function', (done) => {
|
||||
const waterfallUpperSpy = sinon.spy(function() {
|
||||
wrapper.vm.list.unshift({ id: 1 }, { id: 2 }, { id: 3 });
|
||||
wrapper.vm.disabled = true;
|
||||
});
|
||||
wrapper = mount(Waterfall, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
disabled: false,
|
||||
list: [{ id: 10 }],
|
||||
onWaterfallUpper: waterfallUpperSpy
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
const item = wrapper.find('.waterfall-item');
|
||||
expect(waterfallUpperSpy.calledOnce).to.be.true;
|
||||
expect(item.length).to.equal(4);
|
||||
expect(item[0].text()).to.equal('1');
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
|
||||
it('test waterfall function after hide', (done) => {
|
||||
const waterfallLowerSpy = sinon.spy();
|
||||
wrapper = mount(HiddenWaterfall, {
|
||||
attachToDocument: true,
|
||||
propsData: {
|
||||
show: false,
|
||||
disabled: false,
|
||||
list: [{ id: 10 }],
|
||||
onWaterfallLower: waterfallLowerSpy
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
expect(waterfallLowerSpy.called).to.be.false;
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
});
|
||||
@@ -1,84 +0,0 @@
|
||||
/**
|
||||
* 按照一定的规则进行匹配
|
||||
*/
|
||||
export function DOMChecker(wrapper, rules) {
|
||||
const { text, count, src, style, noStyle, value } = rules;
|
||||
|
||||
if (text) {
|
||||
Object.keys(text).forEach(key => {
|
||||
expect(wrapper.find(key)[0].text().trim()).to.equal(text[key]);
|
||||
});
|
||||
}
|
||||
|
||||
if (count) {
|
||||
Object.keys(count).forEach(key => {
|
||||
expect(wrapper.find(key).length).to.equal(count[key]);
|
||||
});
|
||||
}
|
||||
|
||||
if (src) {
|
||||
Object.keys(src).forEach(key => {
|
||||
expect(wrapper.find(key)[0].element.src).to.equal(src[key]);
|
||||
});
|
||||
}
|
||||
|
||||
if (value) {
|
||||
Object.keys(value).forEach(key => {
|
||||
expect(wrapper.find(key)[0].element.value).to.equal(value[key]);
|
||||
});
|
||||
}
|
||||
|
||||
if (style) {
|
||||
Object.keys(style).forEach(key => {
|
||||
Object.keys(style[key]).forEach(prop => {
|
||||
expect(wrapper.find(key)[0].hasStyle(prop, style[key][prop])).to.equal(
|
||||
true
|
||||
);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
if (noStyle) {
|
||||
Object.keys(noStyle).forEach(key => {
|
||||
Object.keys(noStyle[key]).forEach(prop => {
|
||||
expect(
|
||||
wrapper.find(key)[0].hasStyle(prop, noStyle[key][prop])
|
||||
).to.equal(false);
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 触发一个 touch 事件
|
||||
export function triggerTouch(wrapper, eventName, x, y) {
|
||||
const el = wrapper.element ? wrapper.element : wrapper;
|
||||
const touch = {
|
||||
identifier: Date.now(),
|
||||
target: el,
|
||||
pageX: x,
|
||||
pageY: y,
|
||||
clientX: x,
|
||||
clientY: y,
|
||||
radiusX: 2.5,
|
||||
radiusY: 2.5,
|
||||
rotationAngle: 10,
|
||||
force: 0.5
|
||||
};
|
||||
|
||||
const event = document.createEvent('CustomEvent');
|
||||
event.initCustomEvent(eventName, true, true, {});
|
||||
event.touches = [touch];
|
||||
event.targetTouches = [touch];
|
||||
event.changedTouches = [touch];
|
||||
|
||||
el.dispatchEvent(event);
|
||||
}
|
||||
|
||||
export function dragHelper(el, x = 0, y = 0) {
|
||||
triggerTouch(el, 'touchstart', 0, 0);
|
||||
triggerTouch(el, 'touchmove', x / 4, y / 4);
|
||||
triggerTouch(el, 'touchmove', x / 3, y / 3);
|
||||
triggerTouch(el, 'touchmove', x / 2, y / 2);
|
||||
triggerTouch(el, 'touchmove', x, y);
|
||||
triggerTouch(el, 'touchend', x, y);
|
||||
}
|
||||
Reference in New Issue
Block a user