blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

test(ActionSheet): update test cases

Browse Source
This commit is contained in:
chenjiahan 2020-11-13 23:24:47 +08:00
parent 9965986869
commit 9d3aa1d0f0
4 changed files with 80 additions and 109 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
src/action-sheet/test/__snapshots__/index.legacy.js.snap
View File

@ -1,67 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`callback events 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom">
<div class="van-action-sheet__content"><button type="button" class="van-action-sheet__item"><span class="van-action-sheet__name">Option</span></button><button type="button" class="van-action-sheet__item van-action-sheet__item--disabled"><span class="van-action-sheet__name">Option</span></button><button type="button" class="van-action-sheet__item van-action-sheet__item--loading">
<div class="van-loading van-loading--circular van-action-sheet__loading-icon"><span class="van-loading__spinner van-loading__spinner--circular"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div>
</button><button type="button" class="van-action-sheet__item"><span class="van-action-sheet__name">Option</span>
<div class="van-action-sheet__subname">Subname</div></button></div>
<div class="van-action-sheet__gap"></div><button type="button" class="van-action-sheet__cancel">Cancel</button>
</div>
`;
exports[`close-icon prop 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom">
<div class="van-action-sheet__header">Title<i class="van-icon van-icon-cross van-action-sheet__close">
<!----></i></div>
<div class="van-action-sheet__content"></div>
</div>
`;
exports[`closeable prop 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom">
<div class="van-action-sheet__header">Title</div>
<div class="van-action-sheet__content"></div>
</div>
`;
exports[`color option 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom">
<div class="van-action-sheet__content"><button type="button" class="van-action-sheet__item" style="color: red;"><span class="van-action-sheet__name">Option</span></button></div>
</div>
`;
exports[`description prop 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom">
<div class="van-action-sheet__description">This is a description</div>
<div class="van-action-sheet__content"><button type="button" class="van-action-sheet__item"><span class="van-action-sheet__name">Option</span></button></div>
</div>
`;
exports[`description slot 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom">
<div class="van-action-sheet__description">Custom Description</div>
<div class="van-action-sheet__content"><button type="button" class="van-action-sheet__item"><span class="van-action-sheet__name">Option</span></button></div>
</div>
`;
exports[`disable lazy-render 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" style="display: none;" name="van-popup-slide-bottom">
<div class="van-action-sheet__content"><button type="button" class="van-action-sheet__item"><span class="van-action-sheet__name">Option</span></button><button type="button" class="van-action-sheet__item"><span class="van-action-sheet__name">Option</span></button></div>
<div class="van-action-sheet__gap"></div><button type="button" class="van-action-sheet__cancel">Cancel</button>
</div>
`;
exports[`render title and default slot 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom">
<div class="van-action-sheet__header">Title<i class="van-icon van-icon-cross van-action-sheet__close">
<!----></i></div>
<div class="van-action-sheet__content">Default</div>
</div>
`;
exports[`round prop 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom">
<div class="van-action-sheet__content"><button type="button" class="van-action-sheet__item"><span class="van-action-sheet__name">Option</span></button></div>
</div>
`;

5
src/action-sheet/test/__snapshots__/index.spec.js.snap
View File

@ -31,3 +31,8 @@ exports[`should render default slot and match snapshot 1`] = `
exports[`should render description and match snapshot 1`] = `<div class="van-action-sheet__description">This is a description</div>`;
exports[`should render description slot when match snapshot 1`] = `<div class="van-action-sheet__description">Custom Description</div>`;
exports[`should render subname and match snapshot 1`] = `
<button type="button" class="van-action-sheet__item"><span class="van-action-sheet__name">Option</span>
<div class="van-action-sheet__subname">Subname</div></button>
`;

42
src/action-sheet/test/index.legacy.js
View File

@ -1,42 +0,0 @@
import { mount } from '../../../test';
import ActionSheet from '..';
test('callback events', () => {
const callback = jest.fn();
const onInput = jest.fn();
const onCancel = jest.fn();
const onSelect = jest.fn();
const actions = [
{ name: 'Option', callback },
{ name: 'Option', disabled: true },
{ name: 'Option', loading: true },
{ name: 'Option', subname: 'Subname' },
];
const wrapper = mount(ActionSheet, {
propsData: {
value: true,
actions,
cancelText: 'Cancel',
},
context: {
on: {
input: onInput,
cancel: onCancel,
select: onSelect,
},
},
});
const options = wrapper.findAll('.van-action-sheet__item');
options.at(0).trigger('click');
options.at(1).trigger('click');
wrapper.find('.van-action-sheet__cancel').trigger('click');
expect(callback).toHaveBeenCalled();
expect(onCancel).toHaveBeenCalled();
expect(onInput).toHaveBeenCalledWith(false);
expect(onSelect).toHaveBeenCalledWith(actions[0], 0);
expect(wrapper.html()).toMatchSnapshot();
});

75
src/action-sheet/test/index.spec.js
View File

@ -2,6 +2,81 @@ import { mount } from '@vue/test-utils';
import { later } from '../../../test';
import ActionSheet from '..';
test('should emit select event after clicking option', () => {
const wrapper = mount(ActionSheet, {
propsData: {
show: true,
actions: [{ name: 'Option' }],
},
});
wrapper.find('.van-action-sheet__item').trigger('click');
expect(wrapper.emitted('select').length).toEqual(1);
expect(wrapper.emitted('select')[0][0]).toEqual({ name: 'Option' });
});
test('should call callback function after clicking option', () => {
const callback = jest.fn();
const wrapper = mount(ActionSheet, {
propsData: {
show: true,
actions: [{ name: 'Option', callback }],
},
});
wrapper.find('.van-action-sheet__item').trigger('click');
expect(callback).toHaveBeenCalledTimes(1);
});
test('should not emit select event after clicking loading option', () => {
const wrapper = mount(ActionSheet, {
propsData: {
show: true,
actions: [{ name: 'Option', loading: true }],
},
});
wrapper.find('.van-action-sheet__item').trigger('click');
expect(wrapper.emitted('select')).toBeFalsy();
});
test('should not emit select event after clicking disabled option', () => {
const wrapper = mount(ActionSheet, {
propsData: {
show: true,
actions: [{ name: 'Option', disabled: true }],
},
});
wrapper.find('.van-action-sheet__item').trigger('click');
expect(wrapper.emitted('select')).toBeFalsy();
});
test('should emit cancel event after clicking cancel button', () => {
const wrapper = mount(ActionSheet, {
propsData: {
show: true,
actions: [{ name: 'Option' }],
cancelText: 'Cancel',
},
});
wrapper.find('.van-action-sheet__cancel').trigger('click');
expect(wrapper.emitted('cancel').length).toEqual(1);
});
test('should render subname and match snapshot', () => {
const wrapper = mount(ActionSheet, {
propsData: {
show: true,
actions: [{ name: 'Option', subname: 'Subname' }],
cancelText: 'Cancel',
},
});
expect(wrapper.find('.van-action-sheet__item').html()).toMatchSnapshot();
});
test('should render content after disabling the lazy-render prop', async () => {
const wrapper = mount(ActionSheet);
expect(wrapper.find('.van-action-sheet__content').exists()).toBeFalsy();