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

Browse Source
This commit is contained in:
chenjiahan 2020-12-21 22:57:50 +08:00
parent bf497eed33
commit 292ca41d20
2 changed files with 130 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

101
src/cascader/test/__snapshots__/index.spec.js.snap Normal file
View File

@ -0,0 +1,101 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`should render title slot correctly 1`] = `
<h2 class="van-cascader__title">
Custom Title
</h2>
`;
exports[`should update tabs when previous tab is clicked 1`] = `
<div class="van-cascader">
<div class="van-cascader__header">
<h2 class="van-cascader__title">
</h2>
<i class="van-badge__wrapper van-icon van-icon-cross van-cascader__close-icon">
</i>
</div>
<div class="van-tabs van-tabs--line van-cascader__tabs">
<div class="van-tabs__wrap van-tabs__wrap--scrollable">
<div role="tablist"
class="van-tabs__nav van-tabs__nav--line van-tabs__nav--complete"
>
<div role="tab"
class="van-tab van-cascader__tab"
aria-selected="false"
>
<span class="van-tab__text">
Jiangsu
</span>
</div>
<div role="tab"
class="van-tab van-tab--active van-cascader__tab van-cascader__tab--unselected"
aria-selected="true"
>
<span class="van-tab__text">
请选择
</span>
</div>
<div class="van-tabs__line"
style="transform: translateX(0px) translateX(-50%); transition-duration: 0.3s;"
>
</div>
</div>
</div>
<div class="van-tabs__content van-tabs__content--animated">
<div class="van-swipe van-tabs__track">
<div style="width: 0px; transition-duration: 0ms; transform: translateX(0px);"
class="van-swipe__track"
>
<div class="van-swipe-item van-tab__pane-wrapper van-tab__pane-wrapper--inactive"
style="width: 0px;"
role="tabpanel"
aria-hidden="true"
>
<div class="van-tab__pane">
<ul class="van-cascader__options">
<li class="van-cascader__option">
<span>
Zhejiang
</span>
</li>
<li class="van-cascader__option van-cascader__option--selected">
<span>
Jiangsu
</span>
<i class="van-badge__wrapper van-icon van-icon-success van-cascader__selected-icon">
</i>
</li>
</ul>
</div>
</div>
<div class="van-swipe-item van-tab__pane-wrapper"
style="width: 0px;"
role="tabpanel"
aria-hidden="false"
>
<div class="van-tab__pane">
<ul class="van-cascader__options">
<li class="van-cascader__option">
<span>
Nanjing
</span>
</li>
<li class="van-cascader__option">
<span>
Wuxi
</span>
</li>
<li class="van-cascader__option">
<span>
Xuzhou
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
`;

59
src/cascader/test/index.legacy.js → src/cascader/test/index.spec.js
View File

@ -1,10 +1,11 @@
import Cascader from '..';
import { mount, later } from '../../../test';
import { mount } from '@vue/test-utils';
import { later } from '../../../test';
import options from '../demo/area-en-US';
test('should emit change event when active option changed', async () => {
const wrapper = mount(Cascader, {
propsData: {
props: {
options,
},
});
@ -23,8 +24,7 @@ test('should emit change event when active option changed', async () => {
await later();
wrapper
.findAll('.van-cascader__options')
.at(1)
.findAll('.van-cascader__options')[1]
.find('.van-cascader__option')
.trigger('click');
const secondOption = options[0].children[0];
@ -40,7 +40,7 @@ test('should emit change event when active option changed', async () => {
test('should emit finish event when all options is selected', async () => {
const option = { value: '1', text: 'foo' };
const wrapper = mount(Cascader, {
propsData: {
props: {
options: [option],
},
});
@ -64,61 +64,60 @@ test('should emit close event when close icon is clicked', () => {
test('should not render close icon when closeable is false', () => {
const wrapper = mount(Cascader, {
propsData: {
props: {
closeable: false,
},
});
expect(wrapper.contains('.van-cascader__close-icon')).toBeFalsy();
expect(wrapper.find('.van-cascader__close-icon').exists()).toBeFalsy();
});
test('should render title slot correctly', () => {
const wrapper = mount(Cascader, {
scopedSlots: {
slots: {
title: () => 'Custom Title',
},
});
expect(wrapper.find('.van-cascader__title').html()).toMatchSnapshot();
});
test('should select correct option when value changed', async () => {
const wrapper = mount(Cascader, {
propsData: {
options,
},
});
// TODO
// test('should select correct option when value changed', async () => {
// const wrapper = mount(Cascader, {
// props: {
// options,
// },
// });
await later();
wrapper.setProps({ value: '330304' });
await later();
const selectedOptions = wrapper.findAll('.van-cascader__option--selected');
const lastSelectedOption = selectedOptions.at(selectedOptions.length - 1);
expect(lastSelectedOption).toMatchSnapshot();
});
// await later();
// await wrapper.setProps({ modelValue: '330304' });
// await later();
// const selectedOptions = wrapper.findAll('.van-cascader__option--selected');
// const lastSelectedOption = selectedOptions[selectedOptions.length - 1];
// expect(lastSelectedOption.html()).toMatchSnapshot();
// });
test('should reset selected options when value is set to emtpy', async () => {
const wrapper = mount(Cascader, {
propsData: {
value: '330304',
props: {
options,
modelValue: '330304',
},
});
await later();
wrapper.setProps({ value: '' });
await later();
expect(wrapper.contains('.van-cascader__option--selected')).toBeFalsy();
await wrapper.setProps({ modelValue: '' });
expect(wrapper.find('.van-cascader__option--selected').exists()).toBeFalsy();
});
test('should update tabs when previous tab is clicked', async () => {
const wrapper = mount(Cascader, {
propsData: {
value: '330304',
props: {
options,
modelValue: '330304',
},
});
await later();
wrapper.findAll('.van-cascader__option').at(1).trigger('click');
wrapper.findAll('.van-cascader__option')[1].trigger('click');
await later();
expect(wrapper.html()).toMatchSnapshot();
});