提交 567b53d4 编写于 作者: F Frans

Merge branch 'v2' of https://github.com/jdf2e/nutui into v2

......@@ -24,7 +24,7 @@
"build": "npm run build:prod && npm run build:prodmin && npm run build:disp",
"eslint": "eslint src/packages/**/*.{js,vue}",
"add": "node scripts/createCptTpl.js",
"test": "cross-env NODE_ENV=test nyc --reporter=lcov --reporter=text mocha-webpack --webpack-config build/webpack.test.conf.js --require test/setup.js src/packages/*/__test__/**.spec.js",
"test": "cross-env NODE_ENV=test nyc --reporter=lcov --reporter=text mocha-webpack --webpack-config build/webpack.test.conf.js --require test/setup.js src/packages/tab/__test__/**.spec.js",
"coveralls": "cat ./coverage/lcov.info | coveralls",
"test:watch": "npm run test --watch"
},
......
......@@ -3,103 +3,72 @@ import Button from '../button.vue';
import Vue from 'vue';
describe('Button.vue', () => {
let wrapper = shallowMount(Button, {
slots: {
default: '去结算'
}
});
it('设置type', () => {
let wrapper = shallowMount(Button, {
slots: {
default: '去结算'
},
propsData:{
type: 'light'
}
});
wrapper.setProps({
type: 'light'
})
return Vue.nextTick().then(function () {
expect(wrapper.attributes('class')).toContain('light');
})
});
it('设置slot', () => {
let wrapper = shallowMount(Button, {
slots: {
default: '去结算'
}
});
return Vue.nextTick().then(function () {
expect(wrapper.text()).toBe('去结算');
})
});
it('设置disabled', () => {
let wrapper = shallowMount(Button, {
slots: {
default: '去结算'
},
propsData:{
disabled: true
}
});
wrapper.setProps({
disabled: true
})
return Vue.nextTick().then(function () {
expect(wrapper.text()).toBe('去结算');
expect(wrapper.attributes('disabled')).toContain('disabled');
})
});
it('设置shape', () => {
let wrapper = shallowMount(Button, {
slots: {
default: '去结算'
},
propsData:{
shape: 'circle'
}
});
wrapper.setProps({
shape: 'circle'
})
return Vue.nextTick().then(function () {
expect(wrapper.text()).toBe('去结算');
expect(wrapper.attributes('class')).toContain('circle');
})
});
it('设置small', () => {
let wrapper = shallowMount(Button, {
slots: {
default: '去结算'
},
propsData:{
small: true
}
});
wrapper.setProps({
small: true
})
return Vue.nextTick().then(function () {
expect(wrapper.text()).toBe('去结算');
expect(wrapper.attributes('class')).toContain('small');
})
});
it('设置icon', () => {
let wrapper = shallowMount(Button, {
slots: {
default: '全部100万'
},
propsData:{
type: 'actived',
icon: 'tick'
}
});
wrapper.setProps({
type: 'actived',
icon: 'tick'
})
return Vue.nextTick().then(function () {
expect(wrapper.text()).toBe('全部100万');
expect(wrapper.text()).toBe('去结算');
expect(wrapper.contains('.txt-icon')).toBe(true);
expect(wrapper.find('.txt-icon').attributes('type')).toBe('tick');
expect(wrapper.find('span').text()).toBe('全部100万');
expect(wrapper.find('span').text()).toBe('去结算');
})
});
it('设置color', () => {
let wrapper = shallowMount(Button, {
slots: {
default: '去结算'
},
propsData:{
icon: 'tick',
color: '#fff'
}
});
wrapper.setProps({
icon: 'tick',
color: '#fff'
})
return Vue.nextTick().then(function () {
expect(wrapper.text()).toBe('去结算');
expect(wrapper.find('span').attributes('style')).toBe('color: rgb(255, 255, 255);');
expect(wrapper.find('.txt-icon').attributes('color')).toBe('#fff');
})
});
});
\ No newline at end of file
<template>
<button :class="btnCls" :disabled="disabled" @click="clickHandler">
<button :class="clsStyle" :disabled="disabled" @click="clickHandler">
<nut-icon class="txt-icon" v-if="icon != ''" :type="icon" :color="this.color"></nut-icon>
<span :style="{color:this.color}"><slot></slot></span>
</button>
......@@ -41,31 +41,24 @@ export default {
components: {
'nut-icon': Icon
},
data() {
return {
btnCls: ''
};
},
mounted() {
this.initStyle();
this.initIcon();
},
methods: {
initStyle() {
this.btnCls = `nut-button ${this.type} ${this.shape}`;
this.btnCls += this.small ? ' small': '';
this.btnCls += this.block ? ' block': '';
this.btnCls += this.label ? ' label': '';
},
initIcon() {
computed: {
clsStyle() {
let cls = 'nut-button ';
cls += `${this.type} ${this.shape}`;
cls += this.small ? ' small': '';
cls += this.block ? ' block': '';
cls += this.label ? ' label': '';
if(!this.$slots.default) {
if(this.small) {
this.btnCls += ' no-txt-small';
cls += ' no-txt-small';
}else {
this.btnCls += ' no-txt';
cls += ' no-txt';
}
}
},
}
return cls;
}
},
methods: {
clickHandler() {
this.$emit('click');
}
......
......@@ -10,10 +10,10 @@
</div>
<h4>常规按钮组</h4>
<nut-button-group>
<nut-buttongroup>
<nut-button type="light">重置</nut-button>
<nut-button>确定</nut-button>
</nut-button-group>
</nut-buttongroup>
<h4>通栏按钮</h4>
<div>
......
import { shallowMount, mount } from '@vue/test-utils'
import ButtonGroup from '../buttongroup.vue';
import Vue from 'vue';
describe('ButtonGroup.vue', () => {
it('设置shape', () => {
let wrapper = shallowMount(ButtonGroup, {
slots: {
default: '<div>测试</div>'
},
propsData:{
shape: 'circle'
}
});
return Vue.nextTick().then(function () {
expect(wrapper.attributes('class')).toContain('circle');
})
});
it('设置type', () => {
let wrapper = shallowMount(ButtonGroup, {
slots: {
default: `<div>测试</div>`
},
propsData:{
type: 'menu'
}
});
return Vue.nextTick().then(function () {
expect(wrapper.attributes('class')).toContain('menu');
})
});
});
\ No newline at end of file
......@@ -4,15 +4,62 @@ import Vue from 'vue';
describe('Tab.vue', () => {
const wrapper = mount(Tab);
it('页签类型为based', () => {
wrapper.setProps({ type: 'based' });
return Vue.nextTick().then(function () {
expect(wrapper.contains('.based')).toBe(true);
})
});
it('当前tab的位置', () => {
wrapper.setProps({ positionNav: 'left' });
return Vue.nextTick().then(function () {
expect(wrapper.contains('.nut-tab')).toBe(true);
})
});
//const wrapper = mount(Tab);
// it('页签类型为based', () => {
// wrapper.setProps({ type: 'based' });
// return Vue.nextTick().then(function () {
// expect(wrapper.contains('.based')).toBe(true);
// })
// });
it('禁止选择第一个标签', () => {
wrapper.setData({ tabTitleList: [
{
tabTitle: "衣物",
disable: false,
iconUrl:
"http://img13.360buyimg.com/uba/jfs/t27280/289/2061314663/2392/872e32ff/5bf76318Ndc80c1d8.jpg",
content: "<p>衣物内容</p>"
},
{
tabTitle: "日用品",
iconUrl:
"http://img13.360buyimg.com/uba/jfs/t30331/209/562746340/2190/6619973d/5bf763aaN6ff02099.jpg",
content: "<p>日用品内容</p>"
},
{
tabTitle: "运动器材",
iconUrl:
"http://img20.360buyimg.com/uba/jfs/t30346/262/553689202/2257/5dfa3983/5bf76407N72deabf4.jpg",
content: "<p>运动器材内容</p>"
},
{
tabTitle: "电影票",
iconUrl:
"http://img10.360buyimg.com/uba/jfs/t26779/215/2118525153/2413/470d1613/5bf767b2N075957b7.jpg",
content: "<p>电影票内容</p>"
}
] });
setTimeout(()=>{
return Vue.nextTick().then(function () {
expect(wrapper.findAll('.nut-title-nav-leftnav').at(0).is('.nut-tab-disable')).toBe(true)
})
},10)
});
it('当前默认选中的tab', () => {
wrapper.setProps({ defIndex: 0 });
setTimeout(()=>{
return Vue.nextTick().then(function () {
expect(wrapper.findAll('.nut-title-nav-list').at(1).is('.nut-tab-active')).toBe(true)
})
},20)
});
});
\ No newline at end of file
......@@ -123,7 +123,7 @@ export default {
let slot = [...this.$slots.default];
this.tabTitleList = [];
this.initTab(slot);
},0);
},50);
}
},
computed:{
......@@ -139,8 +139,9 @@ export default {
},
},
mounted() {
let slot = [...this.$slots.default];
this.initTab(slot);
this.$nextTick(()=>{
this.$slots.default && this.initTab(this.$slots.default);
})
},
methods: {
closeItem:function(value){
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册