alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

[Improvement] Collapse: add transition animation (#1500)

Browse Source
This commit is contained in:
neverland
2018-07-17 21:33:55 +08:00
committed by GitHub
parent a99e73e07e
commit 9da3e0ce5a
4 changed files with 88 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/collapse/test/__snapshots__/demo.spec.js.snap
+25 -9
View File
@@ -13,7 +13,9 @@ exports[`renders demo correctly 1`] = `
<!---->
</i>
</div>
<div class="van-collapse-item__content">提供多样店铺模板，快速搭建网上商城</div>
<div class="van-collapse-item__wrapper">
<div class="van-collapse-item__content">提供多样店铺模板，快速搭建网上商城</div>
</div>
</div>
<div class="van-collapse-item van-hairline--top">
<div class="van-cell van-cell--clickable van-hairline van-collapse-item__title">
@@ -24,7 +26,9 @@ exports[`renders demo correctly 1`] = `
<!---->
</i>
</div>
<div class="van-collapse-item__content" style="display:none;">网店吸粉获客、会员分层营销、一机多种收款，告别经营低效和客户流失</div>
<div class="van-collapse-item__wrapper" style="display:none;">
<div class="van-collapse-item__content">网店吸粉获客、会员分层营销、一机多种收款，告别经营低效和客户流失</div>
</div>
</div>
<div class="van-collapse-item van-hairline--top">
<div class="van-cell van-cell--clickable van-hairline van-collapse-item__title">
@@ -35,7 +39,9 @@ exports[`renders demo correctly 1`] = `
<!---->
</i>
</div>
<div class="van-collapse-item__content" style="display:none;">线上拓客，随时预约，贴心顺手的开单收银</div>
<div class="van-collapse-item__wrapper" style="display:none;">
<div class="van-collapse-item__content">线上拓客，随时预约，贴心顺手的开单收银</div>
</div>
</div>
</div>
</div>
@@ -50,7 +56,9 @@ exports[`renders demo correctly 1`] = `
<!---->
</i>
</div>
<div class="van-collapse-item__content">提供多样店铺模板，快速搭建网上商城</div>
<div class="van-collapse-item__wrapper">
<div class="van-collapse-item__content">提供多样店铺模板，快速搭建网上商城</div>
</div>
</div>
<div class="van-collapse-item van-hairline--top">
<div class="van-cell van-cell--clickable van-hairline van-collapse-item__title">
@@ -61,7 +69,9 @@ exports[`renders demo correctly 1`] = `
<!---->
</i>
</div>
<div class="van-collapse-item__content" style="display:none;">网店吸粉获客、会员分层营销、一机多种收款，告别经营低效和客户流失</div>
<div class="van-collapse-item__wrapper" style="display:none;">
<div class="van-collapse-item__content">网店吸粉获客、会员分层营销、一机多种收款，告别经营低效和客户流失</div>
</div>
</div>
<div class="van-collapse-item van-hairline--top">
<div class="van-cell van-cell--clickable van-hairline van-collapse-item__title">
@@ -72,7 +82,9 @@ exports[`renders demo correctly 1`] = `
<!---->
</i>
</div>
<div class="van-collapse-item__content" style="display:none;">线上拓客，随时预约，贴心顺手的开单收银</div>
<div class="van-collapse-item__wrapper" style="display:none;">
<div class="van-collapse-item__content">线上拓客，随时预约，贴心顺手的开单收银</div>
</div>
</div>
</div>
</div>
@@ -93,8 +105,10 @@ exports[`renders demo correctly 1`] = `
<!---->
</i>
</div>
<div class="van-collapse-item__content" style="display:none;">
提供多样店铺模板，快速搭建网上商城
<div class="van-collapse-item__wrapper" style="display:none;">
<div class="van-collapse-item__content">
提供多样店铺模板，快速搭建网上商城
</div>
</div>
</div>
<div class="van-collapse-item van-hairline--top">
@@ -106,7 +120,9 @@ exports[`renders demo correctly 1`] = `
<!---->
</i>
</div>
<div class="van-collapse-item__content" style="display:none;">网店吸粉获客、会员分层营销、一机多种收款，告别经营低效和客户流失</div>
<div class="van-collapse-item__wrapper" style="display:none;">
<div class="van-collapse-item__content">网店吸粉获客、会员分层营销、一机多种收款，告别经营低效和客户流失</div>
</div>
</div>
</div>
</div>
packages/collapse/test/index.spec.js
+5 -3
View File
@@ -1,6 +1,6 @@
import Collapse from '..';
import CollapseItem from '../../collapse-item';
import { mount } from '../../../test/utils';
import { later, mount } from '../../../test/utils';
const component = {
template: `
@@ -24,7 +24,7 @@ const component = {
}
};
test('basic mode', () => {
test('basic mode', async() => {
const wrapper = mount(component);
const titles = wrapper.findAll('.van-collapse-item__title');
@@ -34,13 +34,14 @@ test('basic mode', () => {
titles.at(1).trigger('click');
expect(wrapper.vm.active).toEqual(['first', 1]);
await later();
titles.at(0).trigger('click');
expect(wrapper.vm.active).toEqual([1]);
wrapper.destroy();
});
it('accordion', () => {
it('accordion', async() => {
const wrapper = mount(component, {
propsData: {
accordion: true
@@ -54,6 +55,7 @@ it('accordion', () => {
titles.at(1).trigger('click');
expect(wrapper.vm.active).toEqual(1);
await later();
titles.at(0).trigger('click');
expect(wrapper.vm.active).toEqual('first');