test(IndexBar): add demo test

example/app.json

@@ -154,6 +154,7 @@
     "van-circle": "./dist/circle/index",
     "van-circle-demo": "./dist/circle/demo/index",
     "van-index-bar": "./dist/index-bar/index",
+    "van-index-bar-demo": "./dist/index-bar/demo/index",
     "van-index-anchor": "./dist/index-anchor/index",
     "van-grid": "./dist/grid/index",
     "van-grid-demo": "./dist/grid/demo/index",

example/pages/index-bar/index.js

@@ -1,28 +1,3 @@
 import Page from '../../common/page';
 
-const indexList = [];
+Page();
-const charCodeOfA = 'A'.charCodeAt(0);
-for (let i = 0; i < 26; i++) {
-  indexList.push(String.fromCharCode(charCodeOfA + i));
-}
-
-Page({
-  data: {
-    activeTab: 0,
-    indexList,
-    customIndexList: [1, 2, 3, 4, 5, 6, 8, 9, 10],
-    scrollTop: 0,
-  },
-
-  onChange(event) {
-    this.setData({
-      activeTab: event.detail.name
-    });
-  },
-
-  onPageScroll(event) {
-    this.setData({
-      scrollTop: event.scrollTop
-    });
-  }
-});

example/pages/index-bar/index.wxml

@@ -1,45 +1 @@
-<van-tabs
+<van-index-bar-demo />
-  active="{{ activeTab }}"
-  bind:change="onChange"
->
-  <van-tab title="基础用法">
-    <van-index-bar
-      wx:if="{{ activeTab === 0 }}"
-      scroll-top="{{ scrollTop }}"
-    >
-      <view
-        wx:for="{{ indexList }}"
-        wx:for-item="item"
-        wx:key="item"
-      >
-        <van-index-anchor index="{{ item }}" />
-        <van-cell title="文本" />
-        <van-cell title="文本" />
-        <van-cell title="文本" />
-      </view>
-    </van-index-bar>
-  </van-tab>
-
-  <van-tab title="自定义索引列表">
-    <van-index-bar
-      wx:if="{{ activeTab === 1 }}"
-      index-list="{{ customIndexList }}"
-      scroll-top="{{ scrollTop }}"
-    >
-      <view
-        wx:for="{{ customIndexList }}"
-        wx:key="index"
-      >
-        <van-index-anchor
-          use-slot
-          index="{{ item }}"
-        >
-          <text>标题{{ item }}</text>
-        </van-index-anchor>
-        <van-cell title="文本" />
-        <van-cell title="文本" />
-        <van-cell title="文本" />
-      </view>
-    </van-index-bar>
-  </van-tab>
-</van-tabs>

packages/index-bar/demo/index.json

@@ -0,0 +1,11 @@
+{
+  "component": true,
+  "usingComponents": {
+    "van-tab": "../../tab/index",
+    "van-tabs": "../../tabs/index",
+    "van-cell": "../../cell/index",
+    "van-index-bar": "../../index-bar/index",
+    "van-index-anchor": "../../index-anchor/index",
+    "demo-block": "../../../example/components/demo-block/index"
+  }
+}

packages/index-bar/demo/index.ts

@@ -0,0 +1,30 @@
+import { VantComponent } from '../../common/component';
+
+const indexList: string[] = [];
+const charCodeOfA = 'A'.charCodeAt(0);
+for (let i = 0; i < 26; i++) {
+  indexList.push(String.fromCharCode(charCodeOfA + i));
+}
+
+VantComponent({
+  data: {
+    activeTab: 0,
+    indexList,
+    customIndexList: [1, 2, 3, 4, 5, 6, 8, 9, 10],
+    scrollTop: 0,
+  },
+
+  methods: {
+    onChange(event) {
+      this.setData({
+        activeTab: event.detail.name,
+      });
+    },
+
+    onPageScroll(event) {
+      this.setData({
+        scrollTop: event.scrollTop,
+      });
+    },
+  },
+});

packages/index-bar/demo/index.wxml

@@ -0,0 +1,45 @@
+<van-tabs
+  active="{{ activeTab }}"
+  bind:change="onChange"
+>
+  <van-tab title="基础用法">
+    <van-index-bar
+      wx:if="{{ activeTab === 0 }}"
+      scroll-top="{{ scrollTop }}"
+    >
+      <view
+        wx:for="{{ indexList }}"
+        wx:for-item="item"
+        wx:key="item"
+      >
+        <van-index-anchor index="{{ item }}" />
+        <van-cell title="文本" />
+        <van-cell title="文本" />
+        <van-cell title="文本" />
+      </view>
+    </van-index-bar>
+  </van-tab>
+
+  <van-tab title="自定义索引列表">
+    <van-index-bar
+      wx:if="{{ activeTab === 1 }}"
+      index-list="{{ customIndexList }}"
+      scroll-top="{{ scrollTop }}"
+    >
+      <view
+        wx:for="{{ customIndexList }}"
+        wx:key="index"
+      >
+        <van-index-anchor
+          use-slot
+          index="{{ item }}"
+        >
+          <text>标题{{ item }}</text>
+        </van-index-anchor>
+        <van-cell title="文本" />
+        <van-cell title="文本" />
+        <van-cell title="文本" />
+      </view>
+    </van-index-bar>
+  </van-tab>
+</van-tabs>

packages/index-bar/test/demo.spec.ts

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