mirror of
https://github.com/youzan/vant.git
synced 2025-10-16 08:00:34 +00:00
AddressEdit: add test cases
This commit is contained in:
陈嘉涵
327
test/unit/specs/address-edit.spec.js
Normal file
327
test/unit/specs/address-edit.spec.js
Normal file
@@ -0,0 +1,327 @@
|
||||
import { mount } from 'avoriaz';
|
||||
import AddressEdit from 'packages/address-edit';
|
||||
import AddressDetail from 'packages/address-edit/Detail';
|
||||
import areaList from '../../../docs/mock/area.json';
|
||||
|
||||
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 = {
|
||||
user_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.user_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 = {
|
||||
user_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.addressInfo.user_name = '';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['user_name']).to.be.true;
|
||||
wrapper.find('.van-field__control')[0].trigger('focus');
|
||||
expect(wrapper.vm.errorInfo['user_name']).to.be.false;
|
||||
|
||||
// name too long
|
||||
wrapper.vm.addressInfo.user_name = '111111111111111111111111111';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['user_name']).to.be.true;
|
||||
wrapper.find('.van-field__control')[0].trigger('focus');
|
||||
expect(wrapper.vm.errorInfo['user_name']).to.be.false;
|
||||
|
||||
// tel empty
|
||||
wrapper.vm.addressInfo.user_name = '123';
|
||||
wrapper.vm.addressInfo.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.addressInfo.tel = '13000000000';
|
||||
wrapper.vm.addressInfo.area_code = '';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['area_code']).to.be.true;
|
||||
|
||||
// area_code invalid
|
||||
wrapper.vm.addressInfo.tel = '13000000000';
|
||||
wrapper.vm.addressInfo.area_code = '-1';
|
||||
saveButton.trigger('click');
|
||||
expect(wrapper.vm.errorInfo['area_code']).to.be.true;
|
||||
|
||||
// address_detail empty
|
||||
wrapper.vm.addressInfo.area_code = '100000';
|
||||
wrapper.vm.addressInfo.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.addressInfo.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.addressInfo.address_detail = '123';
|
||||
wrapper.vm.addressInfo.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.addressInfo.postal_code = '123456';
|
||||
saveButton.trigger('click');
|
||||
|
||||
// not show postal_code
|
||||
wrapper.vm.addressInfo.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-address-edit-detail__suggest-item');
|
||||
expect(items.length).to.equal(3);
|
||||
|
||||
items[0].trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-field__control')[2].element.value).to.equal('杭州市西湖区 黄龙万科中心');
|
||||
|
||||
items[1].trigger('click');
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.find('.van-field__control')[2].element.value).to.equal('黄龙万科中心H座');
|
||||
items[2].trigger('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.addressInfo['area_code']).to.equal(undefined);
|
||||
|
||||
wrapper.vm.onAreaConfirm([{ name: '浙江省' }, { name: '杭州市' }, { name: '西湖区', code: '123456' }]);
|
||||
expect(wrapper.vm.addressInfo['province']).to.equal('浙江省');
|
||||
expect(wrapper.vm.addressInfo['city']).to.equal('杭州市');
|
||||
expect(wrapper.vm.addressInfo['county']).to.equal('西湖区');
|
||||
expect(wrapper.vm.addressInfo['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.onDeleteAddress();
|
||||
|
||||
setTimeout(() => {
|
||||
expect(document.querySelectorAll('.van-dialog').length).to.equal(0);
|
||||
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();
|
||||
done();
|
||||
}, 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.isAndriod = 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.addressInfo.address_detail).to.equal('');
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('finish edit address detail in andriod', 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 = {
|
||||
user_name: '123'
|
||||
};
|
||||
|
||||
wrapper = mount(AddressEdit, {
|
||||
propsData: {
|
||||
addressInfo: {}
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.setProps({ addressInfo });
|
||||
wrapper.vm.$nextTick(() => {
|
||||
expect(wrapper.vm.currentInfo.user_name).to.equal('123');
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user