mirror of
https://gitee.com/vant-contrib/vant-weapp.git
synced 2025-04-05 19:41:45 +08:00
test(Toast): add demo test
This commit is contained in:
nemo-shen
neverland
parent
a3787220c2
commit
c9dbfc570a
@ -129,9 +129,10 @@
|
|||||||
"van-tabbar": "./dist/tabbar/index",
|
"van-tabbar": "./dist/tabbar/index",
|
||||||
"van-tabbar-demo": "./dist/tabbar/demo/index",
|
"van-tabbar-demo": "./dist/tabbar/demo/index",
|
||||||
"van-tabbar-item": "./dist/tabbar-item/index",
|
"van-tabbar-item": "./dist/tabbar-item/index",
|
||||||
"van-tag": "./dist/tag/index",packages/tag/demo/index.less,
|
"van-tag": "./dist/tag/index",
|
||||||
"van-tag-demo": "./dist/tag/demo/index",
|
"van-tag-demo": "./dist/tag/demo/index",
|
||||||
"van-toast": "./dist/toast/index",
|
"van-toast": "./dist/toast/index",
|
||||||
|
"van-toast-demo": "./dist/toast/demo/index",
|
||||||
"van-transition": "./dist/transition/index",
|
"van-transition": "./dist/transition/index",
|
||||||
"van-tree-select": "./dist/tree-select/index",
|
"van-tree-select": "./dist/tree-select/index",
|
||||||
"van-datetime-picker": "./dist/datetime-picker/index",
|
"van-datetime-picker": "./dist/datetime-picker/index",
|
||||||
|
|||||||
@ -1,52 +1,3 @@
|
|||||||
import Page from '../../common/page';
|
import Page from '../../common/page';
|
||||||
import Toast from '../../dist/toast/toast';
|
|
||||||
|
|
||||||
Page({
|
Page();
|
||||||
showToast() {
|
|
||||||
Toast('提示内容');
|
|
||||||
},
|
|
||||||
|
|
||||||
showLongToast() {
|
|
||||||
Toast('这是一条长文字提示，超过一定字数就会换行');
|
|
||||||
},
|
|
||||||
|
|
||||||
showLoadingToast() {
|
|
||||||
Toast.loading({ message: '加载中...', forbidClick: true });
|
|
||||||
},
|
|
||||||
|
|
||||||
showCustomLoadingToast() {
|
|
||||||
Toast.loading({
|
|
||||||
message: '加载中...',
|
|
||||||
forbidClick: true,
|
|
||||||
loadingType: 'spinner',
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
showSuccessToast() {
|
|
||||||
Toast.success('成功文案');
|
|
||||||
},
|
|
||||||
|
|
||||||
showFailToast() {
|
|
||||||
Toast.fail('失败提示');
|
|
||||||
},
|
|
||||||
|
|
||||||
showCustomizedToast() {
|
|
||||||
const text = (second) => `倒计时 ${second} 秒`;
|
|
||||||
const toast = Toast.loading({
|
|
||||||
duration: 0,
|
|
||||||
forbidClick: true,
|
|
||||||
message: text(3),
|
|
||||||
});
|
|
||||||
|
|
||||||
let second = 3;
|
|
||||||
const timer = setInterval(() => {
|
|
||||||
second--;
|
|
||||||
if (second) {
|
|
||||||
toast.setData({ message: text(second) });
|
|
||||||
} else {
|
|
||||||
clearInterval(timer);
|
|
||||||
Toast.clear();
|
|
||||||
}
|
|
||||||
}, 1000);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|||||||
@ -1,20 +1 @@
|
|||||||
<demo-block title="文字提示" padding>
|
<van-toast-demo />
|
||||||
<van-button type="primary" bind:tap="showToast" class="demo-margin-right">文字提示</van-button>
|
|
||||||
<van-button type="primary" bind:tap="showLongToast">长文字提示</van-button>
|
|
||||||
</demo-block>
|
|
||||||
|
|
||||||
<demo-block title="加载提示" padding>
|
|
||||||
<van-button type="primary" bind:tap="showLoadingToast" class="demo-margin-right">加载提示</van-button>
|
|
||||||
<van-button type="primary" bind:tap="showCustomLoadingToast">自定义加载图标</van-button>
|
|
||||||
</demo-block>
|
|
||||||
|
|
||||||
<demo-block title="成功/失败提示" padding>
|
|
||||||
<van-button type="info" bind:tap="showSuccessToast" class="demo-margin-right">成功提示</van-button>
|
|
||||||
<van-button type="danger" bind:tap="showFailToast">失败提示</van-button>
|
|
||||||
</demo-block>
|
|
||||||
|
|
||||||
<demo-block title="动态更新提示" padding>
|
|
||||||
<van-button type="primary" bind:tap="showCustomizedToast">动态更新提示</van-button>
|
|
||||||
</demo-block>
|
|
||||||
|
|
||||||
<van-toast id="van-toast" />
|
|
||||||
|
|||||||
8
packages/toast/demo/index.json
Normal file
8
packages/toast/demo/index.json
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
{
|
||||||
|
"component": true,
|
||||||
|
"usingComponents": {
|
||||||
|
"van-toast": "../../toast/index",
|
||||||
|
"van-button": "../../button/index",
|
||||||
|
"demo-block": "../../../example/components/demo-block/index"
|
||||||
|
}
|
||||||
|
}
|
||||||
59
packages/toast/demo/index.ts
Normal file
59
packages/toast/demo/index.ts
Normal file
@ -0,0 +1,59 @@
|
|||||||
|
import { VantComponent } from '../../common/component';
|
||||||
|
import Toast from '../../toast/toast';
|
||||||
|
|
||||||
|
VantComponent({
|
||||||
|
methods: {
|
||||||
|
showToast() {
|
||||||
|
Toast({ context: this, message: '提示内容' });
|
||||||
|
},
|
||||||
|
|
||||||
|
showLongToast() {
|
||||||
|
Toast({
|
||||||
|
context: this,
|
||||||
|
message: '这是一条长文字提示，超过一定字数就会换行',
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
showLoadingToast() {
|
||||||
|
Toast.loading({ context: this, message: '加载中...', forbidClick: true });
|
||||||
|
},
|
||||||
|
|
||||||
|
showCustomLoadingToast() {
|
||||||
|
Toast.loading({
|
||||||
|
context: this,
|
||||||
|
message: '加载中...',
|
||||||
|
forbidClick: true,
|
||||||
|
loadingType: 'spinner',
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
showSuccessToast() {
|
||||||
|
Toast.success({ context: this, message: '成功文案' });
|
||||||
|
},
|
||||||
|
|
||||||
|
showFailToast() {
|
||||||
|
Toast.fail({ context: this, message: '失败提示' });
|
||||||
|
},
|
||||||
|
|
||||||
|
showCustomizedToast() {
|
||||||
|
const text = (second) => `倒计时 ${second} 秒`;
|
||||||
|
const toast = Toast.loading({
|
||||||
|
context: this,
|
||||||
|
duration: 0,
|
||||||
|
forbidClick: true,
|
||||||
|
message: text(3),
|
||||||
|
});
|
||||||
|
|
||||||
|
let second = 3;
|
||||||
|
const timer = setInterval(() => {
|
||||||
|
second--;
|
||||||
|
if (second) {
|
||||||
|
toast?.setData({ message: text(second) });
|
||||||
|
} else {
|
||||||
|
clearInterval(timer);
|
||||||
|
Toast.clear();
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
20
packages/toast/demo/index.wxml
Normal file
20
packages/toast/demo/index.wxml
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
<demo-block title="文字提示" padding>
|
||||||
|
<van-button type="primary" bind:tap="showToast" class="demo-margin-right">文字提示</van-button>
|
||||||
|
<van-button type="primary" bind:tap="showLongToast">长文字提示</van-button>
|
||||||
|
</demo-block>
|
||||||
|
|
||||||
|
<demo-block title="加载提示" padding>
|
||||||
|
<van-button type="primary" bind:tap="showLoadingToast" class="demo-margin-right">加载提示</van-button>
|
||||||
|
<van-button type="primary" bind:tap="showCustomLoadingToast">自定义加载图标</van-button>
|
||||||
|
</demo-block>
|
||||||
|
|
||||||
|
<demo-block title="成功/失败提示" padding>
|
||||||
|
<van-button type="info" bind:tap="showSuccessToast" class="demo-margin-right">成功提示</van-button>
|
||||||
|
<van-button type="danger" bind:tap="showFailToast">失败提示</van-button>
|
||||||
|
</demo-block>
|
||||||
|
|
||||||
|
<demo-block title="动态更新提示" padding>
|
||||||
|
<van-button type="primary" bind:tap="showCustomizedToast">动态更新提示</van-button>
|
||||||
|
</demo-block>
|
||||||
|
|
||||||
|
<van-toast id="van-toast" />
|
||||||
305
packages/toast/test/__snapshots__/demo.spec.ts.snap
Normal file
305
packages/toast/test/__snapshots__/demo.spec.ts.snap
Normal file
@ -0,0 +1,305 @@
|
|||||||
|
// 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
|
||||||
|
class="demo-margin-right"
|
||||||
|
bind:tap="showToast"
|
||||||
|
>
|
||||||
|
<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-button
|
||||||
|
bind:tap="showLongToast"
|
||||||
|
>
|
||||||
|
<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>
|
||||||
|
</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
|
||||||
|
class="demo-margin-right"
|
||||||
|
bind:tap="showLoadingToast"
|
||||||
|
>
|
||||||
|
<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-button
|
||||||
|
bind:tap="showCustomLoadingToast"
|
||||||
|
>
|
||||||
|
<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>
|
||||||
|
</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
|
||||||
|
class="demo-margin-right"
|
||||||
|
bind:tap="showSuccessToast"
|
||||||
|
>
|
||||||
|
<wx-button
|
||||||
|
appParameter=""
|
||||||
|
ariaLabel=""
|
||||||
|
businessId="{{0}}"
|
||||||
|
class="custom-class van-button van-button--info 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-button
|
||||||
|
bind:tap="showFailToast"
|
||||||
|
>
|
||||||
|
<wx-button
|
||||||
|
appParameter=""
|
||||||
|
ariaLabel=""
|
||||||
|
businessId="{{0}}"
|
||||||
|
class="custom-class van-button van-button--danger 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>
|
||||||
|
</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:tap="showCustomizedToast"
|
||||||
|
>
|
||||||
|
<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>
|
||||||
|
</wx-view>
|
||||||
|
</demo-block>
|
||||||
|
<van-toast
|
||||||
|
id="van-toast"
|
||||||
|
>
|
||||||
|
<van-transition
|
||||||
|
customClass="van-toast__container"
|
||||||
|
/>
|
||||||
|
</van-toast>
|
||||||
|
</main>
|
||||||
|
`;
|
||||||
11
packages/toast/test/demo.spec.ts
Normal file
11
packages/toast/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