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(ShareSheet): update test cases

Browse Source
This commit is contained in:
chenjiahan 2020-11-22 20:05:46 +08:00
parent cf5fda8c89
commit 33627aab1b
3 changed files with 68 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/share-sheet/test/__snapshots__/index.legacy.js.snap
View File

@ -1,14 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`cancel-text prop 1`] = `<button type="button" class="van-share-sheet__cancel">foo</button>`;
exports[`description prop 1`] = `<span class="van-share-sheet__description">foo</span>`;
exports[`title & description slot 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-share-sheet" name="van-popup-slide-bottom">
<div class="van-share-sheet__header">
<h2 class="van-share-sheet__title">Custom Title</h2><span class="van-share-sheet__description">Custom Description</span>
</div>
<div class="van-share-sheet__options"></div><button type="button" class="van-share-sheet__cancel">取消</button>
</div>
`;

41
src/share-sheet/test/__snapshots__/index.spec.js.snap Normal file
View File

@ -0,0 +1,41 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`should render cancel text when using cancel-text prop 1`] = `
<button type="button"
class="van-share-sheet__cancel"
>
foo
</button>
`;
exports[`should render description when using description prop 1`] = `
<span class="van-share-sheet__description">
foo
</span>
`;
exports[`should render title and description slot correctly 1`] = `
<transition-stub>
<div class="van-overlay">
</div>
</transition-stub>
<transition-stub>
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-share-sheet">
<div class="van-share-sheet__header">
<h2 class="van-share-sheet__title">
Custom Title
</h2>
<span class="van-share-sheet__description">
Custom Description
</span>
</div>
<div class="van-share-sheet__options">
</div>
<button type="button"
class="van-share-sheet__cancel"
>
取消
</button>
</div>
</transition-stub>
`;

49
src/share-sheet/test/index.legacy.js → src/share-sheet/test/index.spec.js
View File

@ -1,38 +1,40 @@
import ShareSheet from '..';
import { mount, trigger, later } from '../../../test';
test('cancel-text prop', () => {
test('should render cancel text when using cancel-text prop', async () => {
const wrapper = mount(ShareSheet, {
props: {
value: true,
show: true,
cancelText: 'foo',
},
});
expect(wrapper.find('.van-share-sheet__cancel')).toMatchSnapshot();
expect(wrapper.find('.van-share-sheet__cancel').html()).toMatchSnapshot();
wrapper.setProps({ cancelText: '' });
expect(wrapper.contains('.van-share-sheet__cancel')).toBeFalsy();
await wrapper.setProps({ cancelText: '' });
expect(wrapper.find('.van-share-sheet__cancel').exists()).toBeFalsy();
});
test('description prop', () => {
test('should render description when using description prop', async () => {
const wrapper = mount(ShareSheet, {
props: {
value: true,
show: true,
description: 'foo',
},
});
expect(wrapper.find('.van-share-sheet__description')).toMatchSnapshot();
expect(
wrapper.find('.van-share-sheet__description').html()
).toMatchSnapshot();
wrapper.setProps({ description: '' });
expect(wrapper.contains('.van-share-sheet__description')).toBeFalsy();
await wrapper.setProps({ description: '' });
expect(wrapper.find('.van-share-sheet__description').exists()).toBeFalsy();
});
test('option className', () => {
test('should allow to custom the className of option', () => {
const wrapper = mount(ShareSheet, {
props: {
value: true,
show: true,
options: [{ name: 'Link', icon: 'link', className: 'foo' }],
},
});
@ -42,10 +44,10 @@ test('option className', () => {
expect(option.className.includes('foo')).toBeTruthy();
});
test('select event', () => {
test('should emit select event when an option is clicked', () => {
const wrapper = mount(ShareSheet, {
props: {
value: true,
show: true,
options: [{ icon: 'wechat', name: 'wechat' }],
},
});
@ -57,23 +59,23 @@ test('select event', () => {
]);
});
test('cancel event', () => {
test('should emit cancel event when the cancel button is clicked', () => {
const wrapper = mount(ShareSheet, {
props: {
value: true,
show: true,
},
});
wrapper.find('.van-share-sheet__cancel').trigger('click');
expect(wrapper.emitted('input')[0][0]).toEqual(false);
expect(wrapper.emitted('update:show')[0][0]).toEqual(false);
expect(wrapper.emitted('cancel')[0]).toBeTruthy();
});
test('title & description slot', () => {
test('should render title and description slot correctly', () => {
const wrapper = mount(ShareSheet, {
props: {
value: true,
show: true,
},
slots: {
title: () => 'Custom Title',
@ -84,12 +86,14 @@ test('title & description slot', () => {
expect(wrapper.html()).toMatchSnapshot();
});
test('click-overlay event', async () => {
test('should emit click-overlay event when overlay is clicked', async () => {
const root = document.createElement('div');
const onClickOverlay = jest.fn();
const wrapper = mount(ShareSheet, {
props: {
value: true,
show: true,
teleport: root,
onClickOverlay,
},
});
@ -97,5 +101,6 @@ test('click-overlay event', async () => {
const overlay = root.querySelector('.van-overlay');
trigger(overlay, 'click');
expect(wrapper.emitted('click-overlay')).toBeTruthy();
expect(onClickOverlay).toHaveBeenCalledTimes(1);
expect(wrapper.emitted('update:show')[0][0]).toEqual(false);
});