test(Form): improve test coverage

This commit is contained in:
陈嘉涵 2020-02-14 10:53:47 +08:00
parent 2e927ec2e4
commit 6bbeed7dd1
7 changed files with 108 additions and 15 deletions

View File

@ -300,3 +300,17 @@ test('name prop', () => {
});
expect(wrapper).toMatchSnapshot();
});
test('call focus method before mounted', done => {
mount(Field, {
created() {
this.focus();
this.blur();
done();
},
});
});
test('destroy field', () => {
mount(Field).destroy();
});

View File

@ -138,3 +138,4 @@ export default createComponent({
);
},
});
//

View File

@ -0,0 +1,39 @@
import { later } from '../../../test';
import { mountForm } from './shared';
test('dynamic add/remove fileds', async () => {
const onSubmit = jest.fn();
const wrapper = mountForm({
template: `
<van-form @submit="onSubmit">
<van-field
v-for="item in list"
:key="item"
:name="item"
value=""
/>
<van-button native-type="submit" />
</van-form>
`,
data() {
return { list: ['A'] };
},
methods: {
onSubmit,
},
});
wrapper.find('.van-button').trigger('click');
await later();
expect(onSubmit).toHaveBeenCalledWith({ A: '' });
wrapper.setData({ list: ['A', 'B'] });
wrapper.find('.van-button').trigger('click');
await later();
expect(onSubmit).toHaveBeenCalledWith({ A: '', B: '' });
wrapper.setData({ list: ['B'] });
wrapper.find('.van-button').trigger('click');
await later();
expect(onSubmit).toHaveBeenCalledWith({ B: '' });
});

View File

@ -1,5 +1,5 @@
import { later } from '../../../test';
import { mountForm, mountSimpleRulesForm } from './shared';
import { mountForm, mountSimpleRulesForm, getSimpleRules } from './shared';
test('submit method', async () => {
const onSubmit = jest.fn();
@ -37,7 +37,7 @@ test('validate method - validate all fields', done => {
});
});
test('validate method - validate one field', done => {
test('validate method - validate one field and passed', done => {
mountSimpleRulesForm({
mounted() {
this.$refs.form.validate('A').catch(err => {
@ -48,6 +48,30 @@ test('validate method - validate one field', done => {
});
});
test('validate method - validate one field and failed', done => {
mountForm({
template: `
<van-form ref="form" @failed="onFailed">
<van-field name="A" :rules="rulesA" value="123" />
<van-field name="B" :rules="rulesB" value="" />
<van-button native-type="submit" />
</van-form>
`,
data: getSimpleRules,
mounted() {
this.$refs.form.validate('A').then(done);
},
});
});
test('validate method - unexisted name', done => {
mountSimpleRulesForm({
mounted() {
this.$refs.form.validate('unexisted').catch(done);
},
});
});
test('resetValidation method - reset all fields', done => {
const wrapper = mountSimpleRulesForm({
mounted() {

View File

@ -71,19 +71,25 @@ test('rules prop - async validator', async () => {
});
test('validate-first prop', async () => {
const onSubmit = jest.fn();
const onFailed = jest.fn();
const wrapper = mountForm({
template: `
<van-form validate-first @failed="onFailed">
<van-field name="A" :rules="rulesA" value="" />
<van-field name="B" :rules="rulesB" value="" />
<van-form validate-first @submit="onSubmit" @failed="onFailed">
<van-field name="A" :rules="rulesA" :value="value" />
<van-field name="B" :rules="rulesB" :value="value" />
<van-button native-type="submit" />
</van-form>
`,
data() {
return getSimpleRules();
return {
...getSimpleRules(),
value: '',
};
},
methods: {
onSubmit,
onFailed,
},
});
@ -96,6 +102,12 @@ test('validate-first prop', async () => {
errors: [{ message: 'A failed', name: 'A' }],
values: { A: '', B: '' },
});
wrapper.setData({ value: 'foo' });
wrapper.find('.van-button').trigger('click');
await later();
expect(onSubmit).toHaveBeenCalledWith({ A: 'foo', B: 'foo' });
});
test('label-align prop', () => {

View File

@ -1,4 +1,9 @@
import { mount } from '../../../test';
import { mount, later } from '../../../test';
export async function submitForm(wrapper) {
wrapper.find('.van-button').trigger('click');
return later();
}
export function mountForm(options) {
return mount(options, { attachToDocument: true });
@ -20,9 +25,7 @@ export function mountSimpleRulesForm(options) {
<van-button native-type="submit" />
</van-form>
`,
data() {
return getSimpleRules();
},
data: getSimpleRules,
...options,
});
}