ui/vant
1
0
Fork 0
mirror of https://github.com/youzan/vant.git synced 2025-10-18 09:24:25 +00:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Quantity: rename to Stepper

Browse Source
This commit is contained in:
陈嘉涵
2017-09-08 11:36:03 +08:00
parent 378ef55a0a
commit 6ec9d9852a
13 changed files with 72 additions and 384 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
test/unit/specs/deep-select.spec.js
View File

@@ -27,7 +27,7 @@ describe('DeepSelect', () => {
});
expect(wrapper.hasClass('van-deep-select')).to.be.true;
expect(wrapper.hasStyle('height', '44px')).to.be.true;
expect(wrapper.propsData().maxHeight).to.equal(200);
expect(wrapper.vm.maxHeight).to.equal(200);
});
it('interact with this component', () => {

311
test/unit/specs/order-goods.spec.js
View File

@@ -1,311 +0,0 @@
import OrderGoods from 'packages/order-goods';
import { mount } from 'avoriaz';
import { DOMChecker } from '../utils';
const item1 = {
img_url: 'https://img.yzcdn.cn/upload_files/2017/07/02/af5b9f44deaeb68000d7e4a711160c53.jpg',
pay_price: 1050,
title: '商品 A',
num: '1'
};
const item2 = {
points_price: 200,
pay_price: 50,
img_url: 'https://img.yzcdn.cn/upload_files/2017/07/02/e89d56cd92ad8ce3b9d8e1babc3758b6.jpg',
title: '商品 B',
num: '15',
sku: [{ v: '商品SKU1' }, { v: '商品SKU2' }]
};
const item3 = {
pay_price: 50,
img_url: 'https://img.yzcdn.cn/upload_files/2017/07/02/e89d56cd92ad8ce3b9d8e1babc3758b6.jpg',
title: '商品 C',
num: '15',
is_presale: true,
delivery_time: '三天后发货',
show_delivery_time: true,
is_presale: true,
is_present: true,
message: {
'留言1': '留言1内容',
'留言2': 'https://img.yzcdn.cn/upload_files/2017/07/02/e89d56cd92ad8ce3b9d8e1babc3758b6.jpg'
}
};
describe('OrderGoods', () => {
let wrapper;
afterEach(() => {
wrapper && wrapper.destroy();
});
it('default', () => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
shopName: '起码运动馆',
price: item1.pay_price,
itemList: [item1],
message: '留言留言'
}
});
DOMChecker(wrapper, {
text: {
'.van-order-goods-header a': '起码运动馆',
'.van-order-goods-price .van-cell__value span': '¥10.50',
'.van-card__title': item1.title,
'.van-card__num': 'x ' + item1.num,
'.van-card__price': '¥10.50'
},
value: {
'.van-order-goods-message textarea': '留言留言'
},
src: {
'.van-card__thumb img': item1.img_url
}
});
});
it('empty list', () => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
itemList: []
}
});
const submitSpyFunc = sinon.spy();
wrapper.vm.$on('clickEmptyButton', submitSpyFunc);
wrapper.find('.van-button')[0].trigger('click');
DOMChecker(wrapper, {
text: {
'.van-order-goods-empty p': '当前没有可购买的商品，请重新选择',
'.van-order-goods-empty button': '返回重新选择'
},
src: {
'.van-order-goods-empty img': 'http://b.yzcdn.cn/v2/image/wap/trade/new_order/empty@2x.png'
}
});
expect(submitSpyFunc.calledOnce).to.be.true;
});
it('empty list config', () => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
emptyIcon: 'https://img.yzcdn.cn/upload_files/2017/07/01/FlIeRrn5bMRoWhcwp4Dp1TmVAXKy.jpg',
emptyMessage: '测试',
emptyButtonText: '测试'
}
});
DOMChecker(wrapper, {
text: {
'.van-order-goods-empty p': '测试',
'.van-order-goods-empty button': '测试'
},
src: {
'.van-order-goods-empty img': 'https://img.yzcdn.cn/upload_files/2017/07/01/FlIeRrn5bMRoWhcwp4Dp1TmVAXKy.jpg'
}
});
});
it('edit message', (done) => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
itemList: [item1],
message: ''
}
});
wrapper.vm.$on('input', val => {
wrapper.vm.message = val;
expect(wrapper.vm.message).to.equal('测试留言');
done();
});
const textarea = wrapper.find('textarea')[0];
textarea.element.value = '测试留言';
textarea.trigger('input');
});
it('message not editable', () => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
itemList: [item1],
message: '留言留言',
messageEditable: false
}
});
DOMChecker(wrapper, {
text: {
'.van-order-goods-message p': '留言留言'
}
});
});
it('message not editable && empty', () => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
itemList: [item1],
message: '',
messageEditable: false
}
});
DOMChecker(wrapper, {
text: {
'.van-order-goods-message p': ''
}
});
});
it('points props', () => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
itemList: [item1],
points: 100
}
});
DOMChecker(wrapper, {
text: {
'.van-order-goods-price .van-cell__value span': '100积分'
}
});
});
it('points prop and price prop', () => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
itemList: [item1],
points: 100,
price: 1050
}
});
DOMChecker(wrapper, {
text: {
'.van-order-goods-price .van-cell__value span': '100积分 + ¥10.50'
}
});
});
it('shopLink prop', () => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
itemList: [item1],
shopLink: 'http://www.youzan.com'
}
});
expect(wrapper.find('.van-order-goods-header a')[0].element.getAttribute('href')).to.equal('http://www.youzan.com');
});
it('item with points', () => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
itemList: [item2]
}
});
DOMChecker(wrapper, {
text: {
'.van-card__price': '200积分 + ¥0.50',
'.van-card__title': item2.title,
'.van-card__num': 'x ' + item2.num
},
src: {
'.van-card__thumb img': item2.img_url
}
});
});
it('presable item with deliveryTime', () => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
itemList: [item3]
}
});
DOMChecker(wrapper, {
text: {
'.van-card__price': '¥0.50',
'.van-card__title': item3.title,
'.van-card__num': 'x ' + item3.num,
'.van-order-goods-card__delivery .van-cell__value span': item3.delivery_time
},
count: {
'.van-order-goods-card__present': 1,
'.van-order-goods-card__tag-green': 1
},
src: {
'.van-card__thumb img': item3.img_url
}
});
});
it('item with message', (done) => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
itemList: [item3]
}
});
DOMChecker(wrapper, {
count: {
'.van-order-goods-card__message-button': 1,
'.van-order-goods-card__message li': 2
},
style: {
'.van-order-goods-card__message': {
'display': 'none'
}
}
});
const messageButton = wrapper.find('.van-order-goods-card__message-button')[0];
messageButton.trigger('click');
setTimeout(function() {
DOMChecker(wrapper, {
noStyle: {
'.van-order-goods-card__message': {
'display': 'none'
}
}
});
done();
}, 300);
});
it('multi items', () => {
wrapper = mount(OrderGoods, {
attachToDocument: true,
propsData: {
itemList: [item1, item2, item3]
}
});
DOMChecker(wrapper, {
count: {
'.van-order-goods-card': 3
}
});
});
});

2
test/unit/specs/search.spec.js
View File

@@ -8,7 +8,7 @@ describe('Search', () => {
wrapper && wrapper.destroy();
});
it('create a quantity', () => {
it('create a stepper', () => {
wrapper = mount(Search);
expect(wrapper.hasClass('van-search')).to.be.true;

42
test/unit/specs/quantity.spec.js → test/unit/specs/stepper.js
View File

@@ -1,43 +1,43 @@
import Quantity from 'packages/quantity';
import Stepper from 'packages/stepper';
import { mount } from 'avoriaz';
describe('Quantity', () => {
describe('Stepper', () => {
let wrapper;
afterEach(() => {
wrapper && wrapper.destroy();
});
it('create a quantity', () => {
wrapper = mount(Quantity, {
it('create a stepper', () => {
wrapper = mount(Stepper, {
propsData: {
defaultValue: 1
}
});
expect(wrapper.hasClass('van-quantity')).to.be.true;
expect(wrapper.hasClass('van-stepper')).to.be.true;
expect(wrapper.data().currentValue).to.equal(1);
const plusButton = wrapper.find('.van-quantity__plus')[0];
const plusButton = wrapper.find('.van-stepper__plus')[0];
plusButton.trigger('click');
expect(wrapper.data().currentValue).to.equal(2);
const minusButton = wrapper.find('.van-quantity__minus')[0];
const minusButton = wrapper.find('.van-stepper__minus')[0];
minusButton.trigger('click');
expect(wrapper.data().currentValue).to.equal(1);
});
it('create a disabled quantity', (done) => {
wrapper = mount(Quantity, {
it('create a disabled stepper', (done) => {
wrapper = mount(Stepper, {
propsData: {
disabled: true
}
});
expect(wrapper.hasClass('van-quantity')).to.be.true;
const minusButton = wrapper.find('.van-quantity__minus')[0];
expect(minusButton.hasClass('van-quantity__minus--disabled')).to.be.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');
@@ -48,8 +48,8 @@ describe('Quantity', () => {
done();
});
const plusButton = wrapper.find('.van-quantity__plus')[0];
expect(plusButton.hasClass('van-quantity__plus--disabled')).to.be.true;
const plusButton = wrapper.find('.van-stepper__plus')[0];
expect(plusButton.hasClass('van-stepper__plus--disabled')).to.be.true;
plusButton.trigger('click');
@@ -60,14 +60,14 @@ describe('Quantity', () => {
});
});
it('update quantity value use v-model', (done) => {
wrapper = mount(Quantity, {
it('update stepper value use v-model', (done) => {
wrapper = mount(Stepper, {
propsData: {
value: 1
}
});
expect(wrapper.hasClass('van-quantity')).to.be.true;
expect(wrapper.hasClass('van-stepper')).to.be.true;
const eventStub = sinon.stub(wrapper.vm, '$emit');
wrapper.vm.value = 2;
@@ -80,14 +80,14 @@ describe('Quantity', () => {
});
it('correct value when value is not correct', (done) => {
wrapper = mount(Quantity, {
wrapper = mount(Stepper, {
propsData: {
value: 50,
max: 30
}
});
expect(wrapper.hasClass('van-quantity')).to.be.true;
expect(wrapper.hasClass('van-stepper')).to.be.true;
expect(wrapper.vm.currentValue).to.equal(30);
const eventStub = sinon.stub(wrapper.vm, '$emit');
@@ -101,13 +101,13 @@ describe('Quantity', () => {
});
it('handle when input change', (done) => {
wrapper = mount(Quantity, {
wrapper = mount(Stepper, {
propsData: {
value: 1
}
});
const input = wrapper.find('.van-quantity__input')[0];
const input = wrapper.find('.van-stepper__input')[0];
input.element.value = 2;
input.trigger('input');