test(GoodsAction): add demo test

example/app.json

@@ -88,6 +88,7 @@
     "van-empty-demo": "./dist/empty/demo/index",
     "van-field": "./dist/field/index",
     "van-goods-action": "./dist/goods-action/index",
+    "van-goods-action-demo": "./dist/goods-action/demo/index",
     "van-goods-action-icon": "./dist/goods-action-icon/index",
     "van-goods-action-button": "./dist/goods-action-button/index",
     "van-icon": "./dist/icon/index",

example/pages/goods-action/index.js

@@ -1,12 +1,3 @@
 import Page from '../../common/page';
-import Toast from '../../dist/toast/toast';
 
-Page({
+Page();
-  onClickIcon() {
-    Toast('点击图标');
-  },
-
-  onClickButton() {
-    Toast('点击按钮');
-  }
-});

example/pages/goods-action/index.wxml

@@ -1,53 +1 @@
-<demo-block title="基础用法">
+<van-goods-action-demo />
-  <van-goods-action custom-class="goods-action-position" safe-area-inset-bottom="{{ false }}">
-    <van-goods-action-icon
-      icon="chat-o"
-      text="客服"
-      open-type="contact"
-    />
-    <van-goods-action-icon
-      icon="cart-o"
-      text="购物车"
-      bind:click="onClickIcon"
-    />
-    <van-goods-action-button
-      text="加入购物车"
-      type="warning"
-      bind:click="onClickButton"
-    />
-    <van-goods-action-button
-      text="立即购买"
-      bind:click="onClickButton"
-    />
-  </van-goods-action>
-</demo-block>
-
-<demo-block title="提示信息">
-  <van-goods-action custom-class="goods-action-position" safe-area-inset-bottom="{{ false }}">
-    <van-goods-action-icon icon="chat-o" text="客服" dot />
-    <van-goods-action-icon icon="cart-o" text="购物车" info="5" />
-    <van-goods-action-icon icon="shop-o" text="店铺" />
-    <van-goods-action-button text="加入购物车" type="warning" />
-    <van-goods-action-button text="立即购买" />
-  </van-goods-action>
-</demo-block>
-
-<demo-block title="自定义按钮颜色">
-  <van-goods-action custom-class="goods-action-position" safe-area-inset-bottom="{{ false }}">
-    <van-goods-action-icon icon="chat-o" text="客服" />
-    <van-goods-action-icon icon="shop-o" text="店铺" />
-    <van-goods-action-button color="#be99ff" type="warning" text="加入购物车" />
-    <van-goods-action-button color="#7232dd" text="立即购买" />
-  </van-goods-action>
-</demo-block>
-
-<demo-block title="朴素按钮">
-  <van-goods-action custom-class="goods-action-position" safe-area-inset-bottom="{{ false }}">
-    <van-goods-action-icon icon="chat-o" text="客服" />
-    <van-goods-action-icon icon="shop-o" text="店铺" />
-    <van-goods-action-button color="#7232dd"  text="加入购物车" type="warning" />
-    <van-goods-action-button plain color="#7232dd" text="立即购买" />
-  </van-goods-action>
-</demo-block>
-
-<van-toast id="van-toast" />

packages/goods-action/demo/index.json

@@ -0,0 +1,10 @@
+{
+  "component": true,
+  "usingComponents": {
+    "van-toast": "../../toast/index",
+    "van-goods-action": "../../goods-action/index",
+    "van-goods-action-icon": "../../goods-action-icon/index",
+    "van-goods-action-button": "../../goods-action-button/index",
+    "demo-block": "../../../example/components/demo-block/index"
+  }
+}

packages/goods-action/demo/index.ts

@@ -0,0 +1,14 @@
+import { VantComponent } from '../../common/component';
+import Toast from '../../toast/toast';
+
+VantComponent({
+  methods: {
+    onClickIcon() {
+      Toast({ context: this, message: '点击图标' });
+    },
+
+    onClickButton() {
+      Toast({ context: this, message: '点击按钮' });
+    },
+  },
+});

packages/goods-action/demo/index.wxml

@@ -0,0 +1,53 @@
+<demo-block title="基础用法">
+  <van-goods-action custom-class="goods-action-position" safe-area-inset-bottom="{{ false }}">
+    <van-goods-action-icon
+      icon="chat-o"
+      text="客服"
+      open-type="contact"
+    />
+    <van-goods-action-icon
+      icon="cart-o"
+      text="购物车"
+      bind:click="onClickIcon"
+    />
+    <van-goods-action-button
+      text="加入购物车"
+      type="warning"
+      bind:click="onClickButton"
+    />
+    <van-goods-action-button
+      text="立即购买"
+      bind:click="onClickButton"
+    />
+  </van-goods-action>
+</demo-block>
+
+<demo-block title="提示信息">
+  <van-goods-action custom-class="goods-action-position" safe-area-inset-bottom="{{ false }}">
+    <van-goods-action-icon icon="chat-o" text="客服" dot />
+    <van-goods-action-icon icon="cart-o" text="购物车" info="5" />
+    <van-goods-action-icon icon="shop-o" text="店铺" />
+    <van-goods-action-button text="加入购物车" type="warning" />
+    <van-goods-action-button text="立即购买" />
+  </van-goods-action>
+</demo-block>
+
+<demo-block title="自定义按钮颜色">
+  <van-goods-action custom-class="goods-action-position" safe-area-inset-bottom="{{ false }}">
+    <van-goods-action-icon icon="chat-o" text="客服" />
+    <van-goods-action-icon icon="shop-o" text="店铺" />
+    <van-goods-action-button color="#be99ff" type="warning" text="加入购物车" />
+    <van-goods-action-button color="#7232dd" text="立即购买" />
+  </van-goods-action>
+</demo-block>
+
+<demo-block title="朴素按钮">
+  <van-goods-action custom-class="goods-action-position" safe-area-inset-bottom="{{ false }}">
+    <van-goods-action-icon icon="chat-o" text="客服" />
+    <van-goods-action-icon icon="shop-o" text="店铺" />
+    <van-goods-action-button color="#7232dd"  text="加入购物车" type="warning" />
+    <van-goods-action-button plain color="#7232dd" text="立即购买" />
+  </van-goods-action>
+</demo-block>
+
+<van-toast id="van-toast" />

packages/goods-action/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();
+});