test(Overlay): add demo test

This commit is contained in:
nemo-shen 2021-12-12 22:38:21 +08:00 committed by neverland
parent 1739317a5c
commit 40349869e5
9 changed files with 187 additions and 41 deletions

View File

@ -147,6 +147,7 @@
"van-collapse-item": "./dist/collapse-item/index",
"van-picker": "./dist/picker/index",
"van-overlay": "./dist/overlay/index",
"van-overlay-demo": "./dist/overlay/demo/index",
"van-circle": "./dist/circle/index",
"van-circle-demo": "./dist/circle/demo/index",
"van-index-bar": "./dist/index-bar/index",

View File

@ -1,26 +1,3 @@
import Page from '../../common/page';
Page({
data: {
show: false,
showEmbedded: false
},
onClickShow() {
this.setData({ show: true });
},
onClickHide() {
this.setData({ show: false });
},
onClickShowEmbedded() {
this.setData({ showEmbedded: true });
},
onClickHideEmbedded() {
this.setData({ showEmbedded: false });
},
noop() {}
});
Page();

View File

@ -1,17 +1 @@
<demo-block title="基础用法" padding>
<van-button type="primary" bind:click="onClickShow">
显示遮罩层
</van-button>
<van-overlay show="{{ show }}" bind:click="onClickHide" />
</demo-block>
<demo-block title="嵌入内容" padding>
<van-button type="primary" bind:click="onClickShowEmbedded">
嵌入内容
</van-button>
<van-overlay show="{{ showEmbedded }}" bind:click="onClickHideEmbedded">
<view class="wrapper">
<div class="block" catch:tap="noop" />
</view>
</van-overlay>
</demo-block>
<van-overlay-demo />

View File

@ -0,0 +1,8 @@
{
"component": true,
"usingComponents": {
"van-button": "../../button/index",
"van-overlay": "../../overlay/index",
"demo-block": "../../../example/components/demo-block/index"
}
}

View File

@ -0,0 +1,28 @@
import { VantComponent } from '../../common/component';
VantComponent({
data: {
show: false,
showEmbedded: false,
},
methods: {
onClickShow() {
this.setData({ show: true });
},
onClickHide() {
this.setData({ show: false });
},
onClickShowEmbedded() {
this.setData({ showEmbedded: true });
},
onClickHideEmbedded() {
this.setData({ showEmbedded: false });
},
noop() {},
},
});

View File

@ -0,0 +1,17 @@
<demo-block title="基础用法" padding>
<van-button type="primary" bind:click="onClickShow">
显示遮罩层
</van-button>
<van-overlay show="{{ show }}" bind:click="onClickHide" />
</demo-block>
<demo-block title="嵌入内容" padding>
<van-button type="primary" bind:click="onClickShowEmbedded">
嵌入内容
</van-button>
<van-overlay show="{{ showEmbedded }}" bind:click="onClickHideEmbedded">
<view class="wrapper">
<div class="block" catch:tap="noop" />
</view>
</van-overlay>
</demo-block>

View File

@ -0,0 +1,120 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`should render demo and match snapshot 1`] = `
<main>
<demo-block>
<wx-view
class="custom-class demo-block van-clearfix demo-block--padding"
>
<wx-view
class="demo-block__title"
>
基础用法
</wx-view>
<van-button
bind:click="onClickShow"
>
<wx-button
appParameter=""
ariaLabel=""
businessId="{{0}}"
class="custom-class van-button van-button--primary van-button--normal "
data-detail="{{null}}"
formType=""
hoverClass="van-button--active hover-class"
id=""
lang=""
openType=""
sendMessageImg=""
sendMessagePath=""
sendMessageTitle=""
sessionFrom=""
showMessageCard="{{false}}"
style=""
bind:contact="onContact"
bind:error="onError"
bind:getphonenumber="onGetPhoneNumber"
bind:getuserinfo="onGetUserInfo"
bind:launchapp="onLaunchApp"
bind:opensetting="onOpenSetting"
bind:tap="onClick"
>
<wx-view
class="van-button__text"
>
显示遮罩层
</wx-view>
</wx-button>
</van-button>
<van-overlay
bind:click="onClickHide"
>
<van-transition
customClass="van-overlay"
bind:tap="onClick"
catch:touchmove="noop"
/>
</van-overlay>
</wx-view>
</demo-block>
<demo-block>
<wx-view
class="custom-class demo-block van-clearfix demo-block--padding"
>
<wx-view
class="demo-block__title"
>
嵌入内容
</wx-view>
<van-button
bind:click="onClickShowEmbedded"
>
<wx-button
appParameter=""
ariaLabel=""
businessId="{{0}}"
class="custom-class van-button van-button--primary van-button--normal "
data-detail="{{null}}"
formType=""
hoverClass="van-button--active hover-class"
id=""
lang=""
openType=""
sendMessageImg=""
sendMessagePath=""
sendMessageTitle=""
sessionFrom=""
showMessageCard="{{false}}"
style=""
bind:contact="onContact"
bind:error="onError"
bind:getphonenumber="onGetPhoneNumber"
bind:getuserinfo="onGetUserInfo"
bind:launchapp="onLaunchApp"
bind:opensetting="onOpenSetting"
bind:tap="onClick"
>
<wx-view
class="van-button__text"
>
嵌入内容
</wx-view>
</wx-button>
</van-button>
<van-overlay
bind:click="onClickHideEmbedded"
>
<van-transition
customClass="van-overlay"
bind:tap="onClick"
catch:touchmove="noop"
/>
</van-overlay>
</wx-view>
</demo-block>
</main>
`;

View File

@ -0,0 +1,11 @@
import path from 'path';
import simulate from 'miniprogram-simulate';
test('should render demo and match snapshot', () => {
const id = simulate.load(path.resolve(__dirname, '../demo/index'), {
rootPath: path.resolve(__dirname, '../../'),
});
const comp = simulate.render(id);
comp.attach(document.createElement('parent-wrapper'));
expect(comp.toJSON()).toMatchSnapshot();
});