test(Grid): add demo test

This commit is contained in:
nemo-shen 2021-12-01 23:56:35 +08:00 committed by neverland
parent 2591498204
commit ff4299b124
9 changed files with 1329 additions and 60 deletions

View File

@ -125,6 +125,7 @@
"van-index-bar": "./dist/index-bar/index",
"van-index-anchor": "./dist/index-anchor/index",
"van-grid": "./dist/grid/index",
"van-grid-demo": "./dist/grid/demo/index",
"van-grid-item": "./dist/grid-item/index",
"van-dropdown-menu": "./dist/dropdown-menu/index",
"van-dropdown-item": "./dist/dropdown-item/index",

View File

@ -1,10 +1,3 @@
import Page from '../../common/page';
Page({
data: {
array3: [0, 1, 2],
array4: [0, 1, 2, 3],
array6: [0, 1, 2, 3, 4, 5],
array8: [0, 1, 2, 3, 4, 5, 6, 7],
},
});
Page();

View File

@ -1,51 +1 @@
<demo-block title="基本用法">
<van-grid>
<van-grid-item icon="photo-o" text="文字" wx:for="{{ array4 }}" wx:key="*this" />
</van-grid>
</demo-block>
<demo-block title="自定义列数">
<van-grid column-num="3">
<van-grid-item icon="photo-o" text="文字" wx:for="{{ array6 }}" wx:key="*this" />
</van-grid>
</demo-block>
<demo-block title="自定义内容">
<van-grid column-num="3" border="{{ false }}">
<van-grid-item use-slot wx:for="{{ array3 }}" wx:for-item="index" wx:key="*this">
<image style="width: 100%; height: 90px;" src="https://img.yzcdn.cn/vant/apple-{{ index + 1 }}.jpg" />
</van-grid-item>
</van-grid>
</demo-block>
<demo-block title="正方形格子">
<van-grid square>
<van-grid-item icon="photo-o" text="文字" wx:for="{{ array8 }}" wx:key="*this" />
</van-grid>
</demo-block>
<demo-block title="格子间距">
<van-grid gutter="{{ 10 }}">
<van-grid-item icon="photo-o" text="文字" wx:for="{{ array8 }}" wx:key="*this" />
</van-grid>
</demo-block>
<demo-block title="内容横排">
<van-grid direction="horizontal" column-num="3">
<van-grid-item icon="photo-o" text="文字" wx:for="{{ array3 }}" wx:key="*this" />
</van-grid>
</demo-block>
<demo-block title="页面跳转">
<van-grid clickable column-num="2">
<van-grid-item icon="home-o" link-type="navigateTo" url="/pages/dashboard/index" text="Navigate 跳转" />
<van-grid-item icon="search" link-type="reLaunch" url="/pages/dashboard/index" text="ReLaunch 跳转" />
</van-grid>
</demo-block>
<demo-block title="徽标提示">
<van-grid column-num="2">
<van-grid-item icon="home-o" text="文字" dot />
<van-grid-item icon="search" text="文字" badge="99+" />
</van-grid>
</demo-block>
<van-grid-demo />

View File

@ -1 +0,0 @@
/* empty */

View File

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

View File

@ -0,0 +1,10 @@
import { VantComponent } from '../../common/component';
VantComponent({
data: {
array3: [0, 1, 2],
array4: [0, 1, 2, 3],
array6: [0, 1, 2, 3, 4, 5],
array8: [0, 1, 2, 3, 4, 5, 6, 7],
},
});

View File

@ -0,0 +1,51 @@
<demo-block title="基本用法">
<van-grid>
<van-grid-item icon="photo-o" text="文字" wx:for="{{ array4 }}" wx:key="*this" />
</van-grid>
</demo-block>
<demo-block title="自定义列数">
<van-grid column-num="3">
<van-grid-item icon="photo-o" text="文字" wx:for="{{ array6 }}" wx:key="*this" />
</van-grid>
</demo-block>
<demo-block title="自定义内容">
<van-grid column-num="3" border="{{ false }}">
<van-grid-item use-slot wx:for="{{ array3 }}" wx:for-item="index" wx:key="*this">
<image style="width: 100%; height: 90px;" src="https://img.yzcdn.cn/vant/apple-{{ index + 1 }}.jpg" />
</van-grid-item>
</van-grid>
</demo-block>
<demo-block title="正方形格子">
<van-grid square>
<van-grid-item icon="photo-o" text="文字" wx:for="{{ array8 }}" wx:key="*this" />
</van-grid>
</demo-block>
<demo-block title="格子间距">
<van-grid gutter="{{ 10 }}">
<van-grid-item icon="photo-o" text="文字" wx:for="{{ array8 }}" wx:key="*this" />
</van-grid>
</demo-block>
<demo-block title="内容横排">
<van-grid direction="horizontal" column-num="3">
<van-grid-item icon="photo-o" text="文字" wx:for="{{ array3 }}" wx:key="*this" />
</van-grid>
</demo-block>
<demo-block title="页面跳转">
<van-grid clickable column-num="2">
<van-grid-item icon="home-o" link-type="navigateTo" url="/pages/dashboard/index" text="Navigate 跳转" />
<van-grid-item icon="search" link-type="reLaunch" url="/pages/dashboard/index" text="ReLaunch 跳转" />
</van-grid>
</demo-block>
<demo-block title="徽标提示">
<van-grid column-num="2">
<van-grid-item icon="home-o" text="文字" dot />
<van-grid-item icon="search" text="文字" badge="99+" />
</van-grid>
</demo-block>

File diff suppressed because it is too large Load Diff

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();
});