mirror of
https://gitee.com/vant-contrib/vant-weapp.git
synced 2025-04-05 19:41:45 +08:00
test(Empty): add demo test
This commit is contained in:
nemo-shen
neverland
parent
75eec05604
commit
dfe3d3e9f5
@ -85,6 +85,7 @@
|
||||
"van-divider": "./dist/divider/index",
|
||||
"van-divider-demo": "./dist/divider/demo/index",
|
||||
"van-empty": "./dist/empty/index",
|
||||
"van-empty-demo": "./dist/empty/demo/index",
|
||||
"van-field": "./dist/field/index",
|
||||
"van-goods-action": "./dist/goods-action/index",
|
||||
"van-goods-action-icon": "./dist/goods-action-icon/index",
|
||||
|
||||
@ -1,13 +1,3 @@
|
||||
import Page from '../../common/page';
|
||||
|
||||
Page({
|
||||
data: {
|
||||
activeTab: 0,
|
||||
},
|
||||
|
||||
onChange(event) {
|
||||
this.setData({
|
||||
activeTab: event.detail.name,
|
||||
});
|
||||
},
|
||||
});
|
||||
Page();
|
||||
|
||||
@ -1,36 +1 @@
|
||||
<demo-block title="基础用法" padding>
|
||||
<van-empty description="描述文字" />
|
||||
</demo-block>
|
||||
|
||||
<demo-block title="图片类型">
|
||||
<van-tabs
|
||||
active="{{ activeTab }}"
|
||||
bind:change="onChange"
|
||||
>
|
||||
<van-tab title="通用错误">
|
||||
<van-empty image="error" description="描述文字" />
|
||||
</van-tab>
|
||||
<van-tab title="网络错误">
|
||||
<van-empty image="network" description="描述文字" />
|
||||
</van-tab>
|
||||
<van-tab title="搜索提示">
|
||||
<van-empty image="search" description="描述文字" />
|
||||
</van-tab>
|
||||
</van-tabs>
|
||||
</demo-block>
|
||||
|
||||
<demo-block title="自定义图片" padding>
|
||||
<van-empty
|
||||
custom-class="custom-image"
|
||||
image="https://img.yzcdn.cn/vant/custom-empty-image.png"
|
||||
description="描述文字"
|
||||
/>
|
||||
</demo-block>
|
||||
|
||||
<demo-block title="底部内容" padding>
|
||||
<van-empty description="描述文字">
|
||||
<van-button round type="danger" custom-class="bottom-button">
|
||||
按钮
|
||||
</van-button>
|
||||
</van-empty>
|
||||
</demo-block>
|
||||
<van-empty-demo />
|
||||
|
||||
10
packages/empty/demo/index.json
Normal file
10
packages/empty/demo/index.json
Normal file
@ -0,0 +1,10 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"van-tab": "../../tab/index",
|
||||
"van-tabs": "../../tabs/index",
|
||||
"van-empty": "../../empty/index",
|
||||
"van-button": "../../button/index",
|
||||
"demo-block": "../../../example/components/demo-block/index"
|
||||
}
|
||||
}
|
||||
@ -1,4 +1,3 @@
|
||||
|
||||
.custom-image .van-empty__image {
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
@ -7,4 +6,4 @@
|
||||
.bottom-button {
|
||||
width: 160px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
15
packages/empty/demo/index.ts
Normal file
15
packages/empty/demo/index.ts
Normal file
@ -0,0 +1,15 @@
|
||||
import { VantComponent } from '../../common/component';
|
||||
|
||||
VantComponent({
|
||||
data: {
|
||||
activeTab: 0,
|
||||
},
|
||||
|
||||
methods: {
|
||||
onChange(event) {
|
||||
this.setData({
|
||||
activeTab: event.detail.name,
|
||||
});
|
||||
},
|
||||
},
|
||||
});
|
||||
36
packages/empty/demo/index.wxml
Normal file
36
packages/empty/demo/index.wxml
Normal file
@ -0,0 +1,36 @@
|
||||
<demo-block title="基础用法" padding>
|
||||
<van-empty description="描述文字" />
|
||||
</demo-block>
|
||||
|
||||
<demo-block title="图片类型">
|
||||
<van-tabs
|
||||
active="{{ activeTab }}"
|
||||
bind:change="onChange"
|
||||
>
|
||||
<van-tab title="通用错误">
|
||||
<van-empty image="error" description="描述文字" />
|
||||
</van-tab>
|
||||
<van-tab title="网络错误">
|
||||
<van-empty image="network" description="描述文字" />
|
||||
</van-tab>
|
||||
<van-tab title="搜索提示">
|
||||
<van-empty image="search" description="描述文字" />
|
||||
</van-tab>
|
||||
</van-tabs>
|
||||
</demo-block>
|
||||
|
||||
<demo-block title="自定义图片" padding>
|
||||
<van-empty
|
||||
custom-class="custom-image"
|
||||
image="https://img.yzcdn.cn/vant/custom-empty-image.png"
|
||||
description="描述文字"
|
||||
/>
|
||||
</demo-block>
|
||||
|
||||
<demo-block title="底部内容" padding>
|
||||
<van-empty description="描述文字">
|
||||
<van-button round type="danger" custom-class="bottom-button">
|
||||
按钮
|
||||
</van-button>
|
||||
</van-empty>
|
||||
</demo-block>
|
||||
@ -12,3 +12,4 @@ function imageUrl(image) {
|
||||
module.exports = {
|
||||
imageUrl: imageUrl,
|
||||
};
|
||||
|
||||
|
||||
330
packages/empty/test/__snapshots__/demo.spec.ts.snap
Normal file
330
packages/empty/test/__snapshots__/demo.spec.ts.snap
Normal file
@ -0,0 +1,330 @@
|
||||
// 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-empty>
|
||||
<wx-view
|
||||
class="custom-class van-empty"
|
||||
>
|
||||
<wx-view
|
||||
class="van-empty__image"
|
||||
/>
|
||||
<wx-view
|
||||
class="van-empty__image"
|
||||
>
|
||||
<wx-image
|
||||
class="van-empty__image__img"
|
||||
src="https://img.yzcdn.cn/vant/empty-image-default.png"
|
||||
/>
|
||||
</wx-view>
|
||||
<wx-view
|
||||
class="van-empty__description"
|
||||
/>
|
||||
<wx-view
|
||||
class="van-empty__description"
|
||||
>
|
||||
|
||||
描述文字
|
||||
|
||||
</wx-view>
|
||||
<wx-view
|
||||
class="van-empty__bottom"
|
||||
/>
|
||||
</wx-view>
|
||||
</van-empty>
|
||||
</wx-view>
|
||||
</demo-block>
|
||||
<demo-block>
|
||||
<wx-view
|
||||
class="custom-class demo-block van-clearfix "
|
||||
>
|
||||
<wx-view
|
||||
class="demo-block__title"
|
||||
>
|
||||
图片类型
|
||||
</wx-view>
|
||||
<van-tabs
|
||||
bind:change="onChange"
|
||||
>
|
||||
<wx-view
|
||||
class="custom-class van-tabs van-tabs--line"
|
||||
>
|
||||
<van-sticky
|
||||
bind:scroll="onTouchScroll"
|
||||
>
|
||||
<wx-view
|
||||
class="custom-class van-sticky"
|
||||
style="z-index:1"
|
||||
>
|
||||
<wx-view
|
||||
class="van-sticky-wrap"
|
||||
style="z-index:1"
|
||||
>
|
||||
<wx-view
|
||||
class="van-tabs__wrap "
|
||||
>
|
||||
<wx-scroll-view
|
||||
class="van-tabs__scroll van-tabs__scroll--line"
|
||||
scrollLeft="{{0}}"
|
||||
scrollWithAnimation="{{false}}"
|
||||
scrollX="{{false}}"
|
||||
style=""
|
||||
>
|
||||
<wx-view
|
||||
class="van-tabs__nav van-tabs__nav--line nav-class"
|
||||
style=""
|
||||
>
|
||||
<wx-view
|
||||
class="van-tabs__line"
|
||||
style="width:40px;transform:translateX(0px);-webkit-transform:translateX(0px)"
|
||||
/>
|
||||
<wx-view
|
||||
class="tab-class tab-active-class van-ellipsis van-tab van-tab--active"
|
||||
data-index="{{0}}"
|
||||
style=""
|
||||
bind:tap="onTap"
|
||||
>
|
||||
<wx-view
|
||||
class="van-ellipsis"
|
||||
style=""
|
||||
>
|
||||
|
||||
通用错误
|
||||
|
||||
</wx-view>
|
||||
</wx-view>
|
||||
<wx-view
|
||||
class="tab-class van-ellipsis van-tab"
|
||||
data-index="{{1}}"
|
||||
style=""
|
||||
bind:tap="onTap"
|
||||
>
|
||||
<wx-view
|
||||
class="van-ellipsis"
|
||||
style=""
|
||||
>
|
||||
|
||||
网络错误
|
||||
|
||||
</wx-view>
|
||||
</wx-view>
|
||||
<wx-view
|
||||
class="tab-class van-ellipsis van-tab"
|
||||
data-index="{{2}}"
|
||||
style=""
|
||||
bind:tap="onTap"
|
||||
>
|
||||
<wx-view
|
||||
class="van-ellipsis"
|
||||
style=""
|
||||
>
|
||||
|
||||
搜索提示
|
||||
|
||||
</wx-view>
|
||||
</wx-view>
|
||||
</wx-view>
|
||||
</wx-scroll-view>
|
||||
</wx-view>
|
||||
</wx-view>
|
||||
</wx-view>
|
||||
</van-sticky>
|
||||
<wx-view
|
||||
class="van-tabs__content"
|
||||
bind:touchcancel="onTouchEnd"
|
||||
bind:touchend="onTouchEnd"
|
||||
bind:touchmove="onTouchMove"
|
||||
bind:touchstart="onTouchStart"
|
||||
>
|
||||
<wx-view
|
||||
class="van-tabs__track van-tabs__track"
|
||||
style=""
|
||||
>
|
||||
<van-tab>
|
||||
<wx-view
|
||||
class="custom-class van-tab__pane van-tab__pane--active"
|
||||
style=""
|
||||
>
|
||||
<van-empty>
|
||||
<wx-view
|
||||
class="custom-class van-empty"
|
||||
>
|
||||
<wx-view
|
||||
class="van-empty__image"
|
||||
/>
|
||||
<wx-view
|
||||
class="van-empty__image"
|
||||
>
|
||||
<wx-image
|
||||
class="van-empty__image__img"
|
||||
src="https://img.yzcdn.cn/vant/empty-image-error.png"
|
||||
/>
|
||||
</wx-view>
|
||||
<wx-view
|
||||
class="van-empty__description"
|
||||
/>
|
||||
<wx-view
|
||||
class="van-empty__description"
|
||||
>
|
||||
|
||||
描述文字
|
||||
|
||||
</wx-view>
|
||||
<wx-view
|
||||
class="van-empty__bottom"
|
||||
/>
|
||||
</wx-view>
|
||||
</van-empty>
|
||||
</wx-view>
|
||||
</van-tab>
|
||||
<van-tab>
|
||||
<wx-view
|
||||
class="custom-class van-tab__pane van-tab__pane--inactive"
|
||||
style="display: none;"
|
||||
/>
|
||||
</van-tab>
|
||||
<van-tab>
|
||||
<wx-view
|
||||
class="custom-class van-tab__pane van-tab__pane--inactive"
|
||||
style="display: none;"
|
||||
/>
|
||||
</van-tab>
|
||||
</wx-view>
|
||||
</wx-view>
|
||||
</wx-view>
|
||||
</van-tabs>
|
||||
</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-empty
|
||||
customClass="custom-image"
|
||||
>
|
||||
<wx-view
|
||||
class="custom-class van-empty"
|
||||
>
|
||||
<wx-view
|
||||
class="van-empty__image"
|
||||
/>
|
||||
<wx-view
|
||||
class="van-empty__image"
|
||||
>
|
||||
<wx-image
|
||||
class="van-empty__image__img"
|
||||
src="https://img.yzcdn.cn/vant/custom-empty-image.png"
|
||||
/>
|
||||
</wx-view>
|
||||
<wx-view
|
||||
class="van-empty__description"
|
||||
/>
|
||||
<wx-view
|
||||
class="van-empty__description"
|
||||
>
|
||||
|
||||
描述文字
|
||||
|
||||
</wx-view>
|
||||
<wx-view
|
||||
class="van-empty__bottom"
|
||||
/>
|
||||
</wx-view>
|
||||
</van-empty>
|
||||
</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-empty>
|
||||
<wx-view
|
||||
class="custom-class van-empty"
|
||||
>
|
||||
<wx-view
|
||||
class="van-empty__image"
|
||||
/>
|
||||
<wx-view
|
||||
class="van-empty__image"
|
||||
>
|
||||
<wx-image
|
||||
class="van-empty__image__img"
|
||||
src="https://img.yzcdn.cn/vant/empty-image-default.png"
|
||||
/>
|
||||
</wx-view>
|
||||
<wx-view
|
||||
class="van-empty__description"
|
||||
/>
|
||||
<wx-view
|
||||
class="van-empty__description"
|
||||
>
|
||||
|
||||
描述文字
|
||||
|
||||
</wx-view>
|
||||
<wx-view
|
||||
class="van-empty__bottom"
|
||||
>
|
||||
<van-button
|
||||
customClass="bottom-button"
|
||||
>
|
||||
<wx-button
|
||||
appParameter=""
|
||||
ariaLabel=""
|
||||
businessId="{{0}}"
|
||||
class="custom-class van-button van-button--danger van-button--normal van-button--round "
|
||||
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>
|
||||
</wx-view>
|
||||
</wx-view>
|
||||
</van-empty>
|
||||
</wx-view>
|
||||
</demo-block>
|
||||
</main>
|
||||
`;
|
||||
11
packages/empty/test/demo.spec.ts
Normal file
11
packages/empty/test/demo.spec.ts
Normal 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();
|
||||
});
|
||||
Loading…
x
Reference in New Issue
Block a user