mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
[Improvement] Switch: add test cases (#1202)
This commit is contained in:
parent
06056dc226
commit
49701851f7
@ -46,7 +46,7 @@ test('checkbox group', () => {
|
||||
const wrapper = mount({
|
||||
template: `
|
||||
<checkbox-group v-model="result" :max="2">
|
||||
<checkbox v-for="item in list" :key="item" :name="item" :disabled="item === 'd'"></checkbox>
|
||||
<checkbox v-for="item in list" :key="item" :name="item"></checkbox>
|
||||
</checkbox-group>
|
||||
`,
|
||||
components: {
|
||||
@ -56,7 +56,7 @@ test('checkbox group', () => {
|
||||
data() {
|
||||
return {
|
||||
result: [],
|
||||
list: ['a', 'b', 'c', 'd']
|
||||
list: ['a', 'b', 'c']
|
||||
};
|
||||
}
|
||||
});
|
||||
|
21
packages/contact-card/test/__snapshots__/index.spec.js.snap
Normal file
21
packages/contact-card/test/__snapshots__/index.spec.js.snap
Normal file
@ -0,0 +1,21 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`ContactList render 1`] = `
|
||||
<div class="van-contact-list">
|
||||
<div class="van-radio-group">
|
||||
<div class="van-cell-group van-hairline--top-bottom"></div>
|
||||
</div>
|
||||
<div class="van-hairline--top van-cell van-cell--clickable van-hairline van-contact-list__add">
|
||||
<i class="van-icon van-icon-add van-cell__left-icon">
|
||||
<!---->
|
||||
</i>
|
||||
<div class="van-cell__title"><span>新建联系人</span>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<i class="van-icon van-icon-arrow van-cell__right-icon">
|
||||
<!---->
|
||||
</i>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
@ -1,3 +1,5 @@
|
||||
import ContactCard from '..';
|
||||
import ContactList from '../../contact-list';
|
||||
import ContactEdit from '../../contact-edit';
|
||||
import { mount } from '@vue/test-utils';
|
||||
|
||||
@ -6,79 +8,105 @@ const contactInfo = {
|
||||
tel: '123123213'
|
||||
};
|
||||
|
||||
const createComponent = () => {
|
||||
const wrapper = mount(ContactEdit, {
|
||||
propsData: {
|
||||
contactInfo
|
||||
}
|
||||
});
|
||||
describe('ContactCard', () => {
|
||||
test('click event', () => {
|
||||
const wrapper = mount(ContactCard, {
|
||||
propsData: {
|
||||
editable: false
|
||||
}
|
||||
});
|
||||
|
||||
const button = wrapper.find('.van-button');
|
||||
const field = wrapper.findAll('.van-field__control');
|
||||
const { errorInfo, data } = wrapper.vm;
|
||||
return {
|
||||
wrapper,
|
||||
data,
|
||||
field,
|
||||
button,
|
||||
errorInfo
|
||||
wrapper.trigger('click');
|
||||
expect(wrapper.emitted('click')).toBeFalsy();
|
||||
|
||||
wrapper.setProps({ editable: true });
|
||||
wrapper.trigger('click');
|
||||
expect(wrapper.emitted('click')).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
||||
describe('ContactList', () => {
|
||||
test('render', () => {
|
||||
const wrapper = mount(ContactList);
|
||||
expect(wrapper.html()).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
|
||||
describe('ContactEdit', () => {
|
||||
const createComponent = () => {
|
||||
const wrapper = mount(ContactEdit, {
|
||||
propsData: {
|
||||
contactInfo
|
||||
}
|
||||
});
|
||||
|
||||
const button = wrapper.find('.van-button');
|
||||
const field = wrapper.findAll('.van-field__control');
|
||||
const { errorInfo, data } = wrapper.vm;
|
||||
return {
|
||||
wrapper,
|
||||
data,
|
||||
field,
|
||||
button,
|
||||
errorInfo
|
||||
};
|
||||
};
|
||||
};
|
||||
|
||||
test('valid name', () => {
|
||||
const { data, field, button, errorInfo } = createComponent();
|
||||
test('valid name', () => {
|
||||
const { data, field, button, errorInfo } = createComponent();
|
||||
|
||||
// name empty
|
||||
data.name = '';
|
||||
button.trigger('click');
|
||||
expect(errorInfo.name).toBeTruthy();
|
||||
field.at(0).trigger('focus');
|
||||
expect(errorInfo.name).toBeFalsy();
|
||||
// name empty
|
||||
data.name = '';
|
||||
button.trigger('click');
|
||||
expect(errorInfo.name).toBeTruthy();
|
||||
field.at(0).trigger('focus');
|
||||
expect(errorInfo.name).toBeFalsy();
|
||||
|
||||
// name too long
|
||||
data.name = '1'.repeat(30);
|
||||
button.trigger('click');
|
||||
expect(errorInfo.name).toBeTruthy();
|
||||
field.at(0).trigger('focus');
|
||||
expect(errorInfo.name).toBeFalsy();
|
||||
});
|
||||
|
||||
it('valid tel', () => {
|
||||
const { data, field, button, errorInfo, wrapper } = createComponent();
|
||||
data.tel = '';
|
||||
button.trigger('click');
|
||||
expect(errorInfo.tel).toBeTruthy();
|
||||
field.at(1).trigger('focus');
|
||||
expect(errorInfo.tel).toBeFalsy();
|
||||
|
||||
data.tel = '13000000000';
|
||||
button.trigger('click');
|
||||
expect(errorInfo.tel).toBeFalsy();
|
||||
expect(wrapper.emitted('save')[0][0]).toEqual({
|
||||
name: 'test',
|
||||
tel: '13000000000'
|
||||
});
|
||||
});
|
||||
|
||||
test('watch contact info', () => {
|
||||
const wrapper = mount(ContactEdit);
|
||||
wrapper.setProps({ contactInfo: { name: '123' }});
|
||||
expect(wrapper.vm.data.name).toEqual('123');
|
||||
});
|
||||
|
||||
test('delete contact', done => {
|
||||
const wrapper = mount(ContactEdit, {
|
||||
propsData: {
|
||||
isEdit: true
|
||||
}
|
||||
// name too long
|
||||
data.name = '1'.repeat(30);
|
||||
button.trigger('click');
|
||||
expect(errorInfo.name).toBeTruthy();
|
||||
field.at(0).trigger('focus');
|
||||
expect(errorInfo.name).toBeFalsy();
|
||||
});
|
||||
|
||||
const deleteButton = wrapper.findAll('.van-button').at(1);
|
||||
deleteButton.trigger('click');
|
||||
document.querySelector('.van-dialog__confirm').click();
|
||||
it('valid tel', () => {
|
||||
const { data, field, button, errorInfo, wrapper } = createComponent();
|
||||
data.tel = '';
|
||||
button.trigger('click');
|
||||
expect(errorInfo.tel).toBeTruthy();
|
||||
field.at(1).trigger('focus');
|
||||
expect(errorInfo.tel).toBeFalsy();
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.emitted('delete')).toBeTruthy();
|
||||
done();
|
||||
data.tel = '13000000000';
|
||||
button.trigger('click');
|
||||
expect(errorInfo.tel).toBeFalsy();
|
||||
expect(wrapper.emitted('save')[0][0]).toEqual({
|
||||
name: 'test',
|
||||
tel: '13000000000'
|
||||
});
|
||||
});
|
||||
|
||||
test('watch contact info', () => {
|
||||
const wrapper = mount(ContactEdit);
|
||||
wrapper.setProps({ contactInfo: { name: '123' }});
|
||||
expect(wrapper.vm.data.name).toEqual('123');
|
||||
});
|
||||
|
||||
test('delete contact', done => {
|
||||
const wrapper = mount(ContactEdit, {
|
||||
propsData: {
|
||||
isEdit: true
|
||||
}
|
||||
});
|
||||
|
||||
const deleteButton = wrapper.findAll('.van-button').at(1);
|
||||
deleteButton.trigger('click');
|
||||
document.querySelector('.van-dialog__confirm').click();
|
||||
|
||||
setTimeout(() => {
|
||||
expect(wrapper.emitted('delete')).toBeTruthy();
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
13
packages/switch-cell/test/index.spec.js
Normal file
13
packages/switch-cell/test/index.spec.js
Normal file
@ -0,0 +1,13 @@
|
||||
import SwitchCell from '..';
|
||||
import { mount } from '@vue/test-utils';
|
||||
|
||||
test('emit event', () => {
|
||||
const wrapper = mount(SwitchCell);
|
||||
|
||||
wrapper.vm.$on('input', value => {
|
||||
wrapper.setProps({ value });
|
||||
});
|
||||
wrapper.find('.van-switch').trigger('click');
|
||||
|
||||
expect(wrapper.emitted('change')).toBeTruthy();
|
||||
});
|
13
packages/switch/test/index.spec.js
Normal file
13
packages/switch/test/index.spec.js
Normal file
@ -0,0 +1,13 @@
|
||||
import Switch from '..';
|
||||
import { mount } from '@vue/test-utils';
|
||||
|
||||
test('emit event', () => {
|
||||
const wrapper = mount(Switch);
|
||||
wrapper.trigger('click');
|
||||
wrapper.trigger('click');
|
||||
wrapper.setProps({ disabled: true });
|
||||
wrapper.trigger('click');
|
||||
|
||||
expect(wrapper.emitted('input')).toEqual([[true], [true]]);
|
||||
expect(wrapper.emitted('change')).toEqual([[true], [true]]);
|
||||
});
|
Loading…
x
Reference in New Issue
Block a user