From 8248ff50d13597f75b3bed1c85127dc228616b73 Mon Sep 17 00:00:00 2001
From: nemo-shen <kienshin626@gmail.com>
Date: Thu, 2 Dec 2021 13:29:37 +0800
Subject: [PATCH] test(ConfigProvider): add demo test

---
 example/app.json                              |   3 +-
 example/pages/config-provider/index.js        |  23 +-
 example/pages/config-provider/index.wxml      |  40 +-
 packages/config-provider/demo/index.json      |  12 +
 packages/config-provider/demo/index.ts        |  26 +
 packages/config-provider/demo/index.wxml      |  39 +
 .../test/__snapshots__/demo.spec.ts.snap      | 711 ++++++++++++++++++
 packages/config-provider/test/demo.spec.ts    |  11 +
 8 files changed, 803 insertions(+), 62 deletions(-)
 create mode 100644 packages/config-provider/demo/index.json
 create mode 100644 packages/config-provider/demo/index.ts
 create mode 100644 packages/config-provider/demo/index.wxml
 create mode 100644 packages/config-provider/test/__snapshots__/demo.spec.ts.snap
 create mode 100644 packages/config-provider/test/demo.spec.ts

diff --git a/example/app.json b/example/app.json
index 60d28a40..84630033 100644
--- a/example/app.json
+++ b/example/app.json
@@ -137,7 +137,8 @@
     "van-skeleton": "./dist/skeleton/index",
     "van-calendar": "./dist/calendar/index",
     "van-share-sheet": "./dist/share-sheet/index",
-    "van-config-provider": "./dist/config-provider/index"
+    "van-config-provider": "./dist/config-provider/index",
+    "van-config-provider-demo": "./dist/config-provider/demo/index"
   },
   "sitemapLocation": "sitemap.json"
 }
diff --git a/example/pages/config-provider/index.js b/example/pages/config-provider/index.js
index 8881f493..cc11dfda 100644
--- a/example/pages/config-provider/index.js
+++ b/example/pages/config-provider/index.js
@@ -1,24 +1,3 @@
 import Page from '../../common/page';
 
-Page({
-  data: {
-    rate: 4,
-    slider: 50,
-    themeVars: {
-      rateIconFullColor: '#07c160',
-      sliderBarHeight: '4px',
-      sliderButtonWidth: '20px',
-      sliderButtonHeight: '20px',
-      sliderActiveBackgroundColor: '#07c160',
-      buttonPrimaryBorderColor: '#07c160',
-      buttonPrimaryBackgroundColor: '#07c160',
-    },
-  },
-
-  onChange(event) {
-    const { key } = event.currentTarget.dataset;
-    this.setData({
-      [key]: event.detail,
-    });
-  },
-});
+Page();
diff --git a/example/pages/config-provider/index.wxml b/example/pages/config-provider/index.wxml
index df95c7a3..260a1ac7 100644
--- a/example/pages/config-provider/index.wxml
+++ b/example/pages/config-provider/index.wxml
@@ -1,39 +1 @@
-<demo-block title="默认主题">
-  <van-cell-group>
-    <van-field label="评分">
-      <view slot="input" style="width: 100%">
-        <van-rate model:value="{{ rate }}" data-key="rate" bind:change="onChange" />
-      </view>
-    </van-field>
-    <van-field label="滑块" border="{{ false }}">
-      <view slot="input" style="width: 100%">
-        <van-slider value="{{ slider }}" data-key="slider" bind:change="onChange" />
-      </view>
-    </van-field>
-  </van-cell-group>
-
-  <view style="margin: 16px">
-    <van-button round block type="primary">提交</van-button>
-  </view>
-</demo-block>
-
-<demo-block title="定制主题">
-  <van-config-provider theme-vars="{{ themeVars }}">
-    <van-cell-group>
-      <van-field label="评分">
-        <view slot="input" style="width: 100%">
-          <van-rate model:value="{{ rate }}" data-key="rate" bind:change="onChange" />
-        </view>
-      </van-field>
-      <van-field label="滑块" border="{{ false }}">
-        <view slot="input" style="width: 100%">
-          <van-slider value="{{ slider }}" data-key="slider" bind:change="onChange" />
-        </view>
-      </van-field>
-    </van-cell-group>
-
-    <view style="margin: 16px">
-      <van-button round block type="primary">提交</van-button>
-    </view>
-  </van-config-provider>
-</demo-block>
+<van-config-provider-demo />
diff --git a/packages/config-provider/demo/index.json b/packages/config-provider/demo/index.json
new file mode 100644
index 00000000..c2631c2d
--- /dev/null
+++ b/packages/config-provider/demo/index.json
@@ -0,0 +1,12 @@
+{
+  "component": true,
+  "usingComponents": {
+    "van-rate": "../../rate/index",
+    "van-field": "../../field/index",
+    "van-slider": "../../slider/index",
+    "van-button": "../../button/index",
+    "van-cell-group": "../../cell-group/index",
+    "van-config-provider": "../../config-provider/index",
+    "demo-block": "../../../example/components/demo-block/index"
+  }
+}
diff --git a/packages/config-provider/demo/index.ts b/packages/config-provider/demo/index.ts
new file mode 100644
index 00000000..bdc956fd
--- /dev/null
+++ b/packages/config-provider/demo/index.ts
@@ -0,0 +1,26 @@
+import { VantComponent } from '../../common/component';
+
+VantComponent({
+  data: {
+    rate: 4,
+    slider: 50,
+    themeVars: {
+      rateIconFullColor: '#07c160',
+      sliderBarHeight: '4px',
+      sliderButtonWidth: '20px',
+      sliderButtonHeight: '20px',
+      sliderActiveBackgroundColor: '#07c160',
+      buttonPrimaryBorderColor: '#07c160',
+      buttonPrimaryBackgroundColor: '#07c160',
+    },
+  },
+
+  methods: {
+    onChange(event) {
+      const { key } = event.currentTarget.dataset;
+      this.setData({
+        [key]: event.detail,
+      });
+    },
+  },
+});
diff --git a/packages/config-provider/demo/index.wxml b/packages/config-provider/demo/index.wxml
new file mode 100644
index 00000000..df95c7a3
--- /dev/null
+++ b/packages/config-provider/demo/index.wxml
@@ -0,0 +1,39 @@
+<demo-block title="默认主题">
+  <van-cell-group>
+    <van-field label="评分">
+      <view slot="input" style="width: 100%">
+        <van-rate model:value="{{ rate }}" data-key="rate" bind:change="onChange" />
+      </view>
+    </van-field>
+    <van-field label="滑块" border="{{ false }}">
+      <view slot="input" style="width: 100%">
+        <van-slider value="{{ slider }}" data-key="slider" bind:change="onChange" />
+      </view>
+    </van-field>
+  </van-cell-group>
+
+  <view style="margin: 16px">
+    <van-button round block type="primary">提交</van-button>
+  </view>
+</demo-block>
+
+<demo-block title="定制主题">
+  <van-config-provider theme-vars="{{ themeVars }}">
+    <van-cell-group>
+      <van-field label="评分">
+        <view slot="input" style="width: 100%">
+          <van-rate model:value="{{ rate }}" data-key="rate" bind:change="onChange" />
+        </view>
+      </van-field>
+      <van-field label="滑块" border="{{ false }}">
+        <view slot="input" style="width: 100%">
+          <van-slider value="{{ slider }}" data-key="slider" bind:change="onChange" />
+        </view>
+      </van-field>
+    </van-cell-group>
+
+    <view style="margin: 16px">
+      <van-button round block type="primary">提交</van-button>
+    </view>
+  </van-config-provider>
+</demo-block>
diff --git a/packages/config-provider/test/__snapshots__/demo.spec.ts.snap b/packages/config-provider/test/__snapshots__/demo.spec.ts.snap
new file mode 100644
index 00000000..a412b0f9
--- /dev/null
+++ b/packages/config-provider/test/__snapshots__/demo.spec.ts.snap
@@ -0,0 +1,711 @@
+// 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 "
+    >
+      <wx-view
+        class="demo-block__title"
+      >
+        默认主题
+      </wx-view>
+      <van-cell-group>
+        <wx-view
+          class="custom-class van-cell-group van-hairline--top-bottom"
+        >
+          <van-field>
+            <van-cell
+              customClass="van-field"
+            >
+              <wx-view
+                class="custom-class van-cell"
+                hoverClass="van-cell--hover hover-class"
+                hoverStayTime="70"
+                style=""
+                bind:tap="onClick"
+              >
+                <wx-view
+                  class="van-cell__title title-class"
+                  style="max-width:6.2em;min-width:6.2em;margin-right: 12px;"
+                >
+                  <wx-view
+                    class="label-class van-field__label"
+                    slot="title"
+                  >
+                    
+    评分
+  
+                  </wx-view>
+                </wx-view>
+                <wx-view
+                  class="van-cell__value value-class"
+                >
+                  <wx-view
+                    class="van-field__body van-field__body--text"
+                  >
+                    <wx-view
+                      class="van-field__control van-field__control--custom"
+                      bind:tap="onClickInput"
+                    >
+                      <wx-view
+                        slot="input"
+                        style="width: 100%"
+                      >
+                        <van-rate
+                          data-key="rate"
+                          bind:change="onChange"
+                        >
+                          <wx-view
+                            class="van-rate custom-class"
+                            bind:touchmove="onTouchMove"
+                          >
+                            <wx-view
+                              class="van-rate__item"
+                              style=""
+                            >
+                              <van-icon
+                                class="van-rate__icon van-rate__icon--full"
+                                customClass="icon-class"
+                                data-score="{{0}}"
+                                style=""
+                                bind:click="onSelect"
+                              >
+                                <wx-view
+                                  class="custom-class van-icon van-icon-star"
+                                  style=""
+                                  bind:tap="onClick"
+                                />
+                              </van-icon>
+                            </wx-view>
+                            <wx-view
+                              class="van-rate__item"
+                              style=""
+                            >
+                              <van-icon
+                                class="van-rate__icon van-rate__icon--full"
+                                customClass="icon-class"
+                                data-score="{{1}}"
+                                style=""
+                                bind:click="onSelect"
+                              >
+                                <wx-view
+                                  class="custom-class van-icon van-icon-star"
+                                  style=""
+                                  bind:tap="onClick"
+                                />
+                              </van-icon>
+                            </wx-view>
+                            <wx-view
+                              class="van-rate__item"
+                              style=""
+                            >
+                              <van-icon
+                                class="van-rate__icon van-rate__icon--full"
+                                customClass="icon-class"
+                                data-score="{{2}}"
+                                style=""
+                                bind:click="onSelect"
+                              >
+                                <wx-view
+                                  class="custom-class van-icon van-icon-star"
+                                  style=""
+                                  bind:tap="onClick"
+                                />
+                              </van-icon>
+                            </wx-view>
+                            <wx-view
+                              class="van-rate__item"
+                              style=""
+                            >
+                              <van-icon
+                                class="van-rate__icon van-rate__icon--full"
+                                customClass="icon-class"
+                                data-score="{{3}}"
+                                style=""
+                                bind:click="onSelect"
+                              >
+                                <wx-view
+                                  class="custom-class van-icon van-icon-star"
+                                  style=""
+                                  bind:tap="onClick"
+                                />
+                              </van-icon>
+                            </wx-view>
+                            <wx-view
+                              class="van-rate__item"
+                              style=""
+                            >
+                              <van-icon
+                                class="van-rate__icon"
+                                customClass="icon-class"
+                                data-score="{{4}}"
+                                style=""
+                                bind:click="onSelect"
+                              >
+                                <wx-view
+                                  class="custom-class van-icon van-icon-star-o"
+                                  style=""
+                                  bind:tap="onClick"
+                                />
+                              </van-icon>
+                            </wx-view>
+                          </wx-view>
+                        </van-rate>
+                      </wx-view>
+                    </wx-view>
+                    <wx-input
+                      adjustPosition="{{true}}"
+                      alwaysEmbed="{{false}}"
+                      autoFocus="{{false}}"
+                      class="van-field__control input-class"
+                      confirmHold="{{false}}"
+                      confirmType=""
+                      cursor="{{-1}}"
+                      cursorSpacing="{{50}}"
+                      disabled="{{false}}"
+                      focus="{{false}}"
+                      holdKeyboard="{{false}}"
+                      maxlength="{{-1}}"
+                      password="{{false}}"
+                      placeholder=""
+                      placeholderClass="van-field__placeholder"
+                      placeholderStyle=""
+                      selectionEnd="{{-1}}"
+                      selectionStart="{{-1}}"
+                      type="text"
+                      value=""
+                      bind:blur="onBlur"
+                      bind:confirm="onConfirm"
+                      bind:focus="onFocus"
+                      bind:input="onInput"
+                      bind:keyboardheightchange="onKeyboardHeightChange"
+                      bind:tap="onClickInput"
+                    />
+                    <wx-view
+                      class="van-field__icon-container"
+                      bind:tap="onClickIcon"
+                    />
+                    <wx-view
+                      class="van-field__button"
+                    />
+                  </wx-view>
+                </wx-view>
+              </wx-view>
+            </van-cell>
+          </van-field>
+          <van-field>
+            <van-cell
+              customClass="van-field"
+            >
+              <wx-view
+                class="custom-class van-cell van-cell--borderless"
+                hoverClass="van-cell--hover hover-class"
+                hoverStayTime="70"
+                style=""
+                bind:tap="onClick"
+              >
+                <wx-view
+                  class="van-cell__title title-class"
+                  style="max-width:6.2em;min-width:6.2em;margin-right: 12px;"
+                >
+                  <wx-view
+                    class="label-class van-field__label"
+                    slot="title"
+                  >
+                    
+    滑块
+  
+                  </wx-view>
+                </wx-view>
+                <wx-view
+                  class="van-cell__value value-class"
+                >
+                  <wx-view
+                    class="van-field__body van-field__body--text"
+                  >
+                    <wx-view
+                      class="van-field__control van-field__control--custom"
+                      bind:tap="onClickInput"
+                    >
+                      <wx-view
+                        slot="input"
+                        style="width: 100%"
+                      >
+                        <van-slider
+                          data-key="slider"
+                          bind:change="onChange"
+                        >
+                          <wx-view
+                            class="custom-class van-slider"
+                            style="
+          background: ;
+          height: ;
+        "
+                            bind:tap="onClick"
+                          >
+                            <wx-view
+                              class="van-slider__bar"
+                              style="
+          width: 50%;
+          left: 0%;
+          top: 0;
+          
+        ; "
+                            >
+                              <wx-view
+                                class="van-slider__button-wrapper"
+                                bind:touchcancel="onTouchEnd"
+                                bind:touchend="onTouchEnd"
+                                catch:touchmove="onTouchMove"
+                                bind:touchstart="onTouchStart"
+                              >
+                                <wx-view
+                                  class="van-slider__button"
+                                />
+                              </wx-view>
+                            </wx-view>
+                          </wx-view>
+                        </van-slider>
+                      </wx-view>
+                    </wx-view>
+                    <wx-input
+                      adjustPosition="{{true}}"
+                      alwaysEmbed="{{false}}"
+                      autoFocus="{{false}}"
+                      class="van-field__control input-class"
+                      confirmHold="{{false}}"
+                      confirmType=""
+                      cursor="{{-1}}"
+                      cursorSpacing="{{50}}"
+                      disabled="{{false}}"
+                      focus="{{false}}"
+                      holdKeyboard="{{false}}"
+                      maxlength="{{-1}}"
+                      password="{{false}}"
+                      placeholder=""
+                      placeholderClass="van-field__placeholder"
+                      placeholderStyle=""
+                      selectionEnd="{{-1}}"
+                      selectionStart="{{-1}}"
+                      type="text"
+                      value=""
+                      bind:blur="onBlur"
+                      bind:confirm="onConfirm"
+                      bind:focus="onFocus"
+                      bind:input="onInput"
+                      bind:keyboardheightchange="onKeyboardHeightChange"
+                      bind:tap="onClickInput"
+                    />
+                    <wx-view
+                      class="van-field__icon-container"
+                      bind:tap="onClickIcon"
+                    />
+                    <wx-view
+                      class="van-field__button"
+                    />
+                  </wx-view>
+                </wx-view>
+              </wx-view>
+            </van-cell>
+          </van-field>
+        </wx-view>
+      </van-cell-group>
+      <wx-view
+        style="margin: 16px"
+      >
+        <van-button>
+          <wx-button
+            appParameter=""
+            ariaLabel=""
+            businessId="{{0}}"
+            class="custom-class van-button van-button--primary van-button--normal van-button--block 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>
+  </demo-block>
+  <demo-block>
+    <wx-view
+      class="custom-class demo-block van-clearfix "
+    >
+      <wx-view
+        class="demo-block__title"
+      >
+        定制主题
+      </wx-view>
+      <van-config-provider>
+        <wx-view
+          class="van-config-provider"
+          style="--rate-icon-full-color:#07c160;--slider-bar-height:4px;--slider-button-width:20px;--slider-button-height:20px;--slider-active-background-color:#07c160;--button-primary-border-color:#07c160;--button-primary-background-color:#07c160"
+        >
+          <van-cell-group>
+            <wx-view
+              class="custom-class van-cell-group van-hairline--top-bottom"
+            >
+              <van-field>
+                <van-cell
+                  customClass="van-field"
+                >
+                  <wx-view
+                    class="custom-class van-cell"
+                    hoverClass="van-cell--hover hover-class"
+                    hoverStayTime="70"
+                    style=""
+                    bind:tap="onClick"
+                  >
+                    <wx-view
+                      class="van-cell__title title-class"
+                      style="max-width:6.2em;min-width:6.2em;margin-right: 12px;"
+                    >
+                      <wx-view
+                        class="label-class van-field__label"
+                        slot="title"
+                      >
+                        
+    评分
+  
+                      </wx-view>
+                    </wx-view>
+                    <wx-view
+                      class="van-cell__value value-class"
+                    >
+                      <wx-view
+                        class="van-field__body van-field__body--text"
+                      >
+                        <wx-view
+                          class="van-field__control van-field__control--custom"
+                          bind:tap="onClickInput"
+                        >
+                          <wx-view
+                            slot="input"
+                            style="width: 100%"
+                          >
+                            <van-rate
+                              data-key="rate"
+                              bind:change="onChange"
+                            >
+                              <wx-view
+                                class="van-rate custom-class"
+                                bind:touchmove="onTouchMove"
+                              >
+                                <wx-view
+                                  class="van-rate__item"
+                                  style=""
+                                >
+                                  <van-icon
+                                    class="van-rate__icon van-rate__icon--full"
+                                    customClass="icon-class"
+                                    data-score="{{0}}"
+                                    style=""
+                                    bind:click="onSelect"
+                                  >
+                                    <wx-view
+                                      class="custom-class van-icon van-icon-star"
+                                      style=""
+                                      bind:tap="onClick"
+                                    />
+                                  </van-icon>
+                                </wx-view>
+                                <wx-view
+                                  class="van-rate__item"
+                                  style=""
+                                >
+                                  <van-icon
+                                    class="van-rate__icon van-rate__icon--full"
+                                    customClass="icon-class"
+                                    data-score="{{1}}"
+                                    style=""
+                                    bind:click="onSelect"
+                                  >
+                                    <wx-view
+                                      class="custom-class van-icon van-icon-star"
+                                      style=""
+                                      bind:tap="onClick"
+                                    />
+                                  </van-icon>
+                                </wx-view>
+                                <wx-view
+                                  class="van-rate__item"
+                                  style=""
+                                >
+                                  <van-icon
+                                    class="van-rate__icon van-rate__icon--full"
+                                    customClass="icon-class"
+                                    data-score="{{2}}"
+                                    style=""
+                                    bind:click="onSelect"
+                                  >
+                                    <wx-view
+                                      class="custom-class van-icon van-icon-star"
+                                      style=""
+                                      bind:tap="onClick"
+                                    />
+                                  </van-icon>
+                                </wx-view>
+                                <wx-view
+                                  class="van-rate__item"
+                                  style=""
+                                >
+                                  <van-icon
+                                    class="van-rate__icon van-rate__icon--full"
+                                    customClass="icon-class"
+                                    data-score="{{3}}"
+                                    style=""
+                                    bind:click="onSelect"
+                                  >
+                                    <wx-view
+                                      class="custom-class van-icon van-icon-star"
+                                      style=""
+                                      bind:tap="onClick"
+                                    />
+                                  </van-icon>
+                                </wx-view>
+                                <wx-view
+                                  class="van-rate__item"
+                                  style=""
+                                >
+                                  <van-icon
+                                    class="van-rate__icon"
+                                    customClass="icon-class"
+                                    data-score="{{4}}"
+                                    style=""
+                                    bind:click="onSelect"
+                                  >
+                                    <wx-view
+                                      class="custom-class van-icon van-icon-star-o"
+                                      style=""
+                                      bind:tap="onClick"
+                                    />
+                                  </van-icon>
+                                </wx-view>
+                              </wx-view>
+                            </van-rate>
+                          </wx-view>
+                        </wx-view>
+                        <wx-input
+                          adjustPosition="{{true}}"
+                          alwaysEmbed="{{false}}"
+                          autoFocus="{{false}}"
+                          class="van-field__control input-class"
+                          confirmHold="{{false}}"
+                          confirmType=""
+                          cursor="{{-1}}"
+                          cursorSpacing="{{50}}"
+                          disabled="{{false}}"
+                          focus="{{false}}"
+                          holdKeyboard="{{false}}"
+                          maxlength="{{-1}}"
+                          password="{{false}}"
+                          placeholder=""
+                          placeholderClass="van-field__placeholder"
+                          placeholderStyle=""
+                          selectionEnd="{{-1}}"
+                          selectionStart="{{-1}}"
+                          type="text"
+                          value=""
+                          bind:blur="onBlur"
+                          bind:confirm="onConfirm"
+                          bind:focus="onFocus"
+                          bind:input="onInput"
+                          bind:keyboardheightchange="onKeyboardHeightChange"
+                          bind:tap="onClickInput"
+                        />
+                        <wx-view
+                          class="van-field__icon-container"
+                          bind:tap="onClickIcon"
+                        />
+                        <wx-view
+                          class="van-field__button"
+                        />
+                      </wx-view>
+                    </wx-view>
+                  </wx-view>
+                </van-cell>
+              </van-field>
+              <van-field>
+                <van-cell
+                  customClass="van-field"
+                >
+                  <wx-view
+                    class="custom-class van-cell van-cell--borderless"
+                    hoverClass="van-cell--hover hover-class"
+                    hoverStayTime="70"
+                    style=""
+                    bind:tap="onClick"
+                  >
+                    <wx-view
+                      class="van-cell__title title-class"
+                      style="max-width:6.2em;min-width:6.2em;margin-right: 12px;"
+                    >
+                      <wx-view
+                        class="label-class van-field__label"
+                        slot="title"
+                      >
+                        
+    滑块
+  
+                      </wx-view>
+                    </wx-view>
+                    <wx-view
+                      class="van-cell__value value-class"
+                    >
+                      <wx-view
+                        class="van-field__body van-field__body--text"
+                      >
+                        <wx-view
+                          class="van-field__control van-field__control--custom"
+                          bind:tap="onClickInput"
+                        >
+                          <wx-view
+                            slot="input"
+                            style="width: 100%"
+                          >
+                            <van-slider
+                              data-key="slider"
+                              bind:change="onChange"
+                            >
+                              <wx-view
+                                class="custom-class van-slider"
+                                style="
+          background: ;
+          height: ;
+        "
+                                bind:tap="onClick"
+                              >
+                                <wx-view
+                                  class="van-slider__bar"
+                                  style="
+          width: 50%;
+          left: 0%;
+          top: 0;
+          
+        ; "
+                                >
+                                  <wx-view
+                                    class="van-slider__button-wrapper"
+                                    bind:touchcancel="onTouchEnd"
+                                    bind:touchend="onTouchEnd"
+                                    catch:touchmove="onTouchMove"
+                                    bind:touchstart="onTouchStart"
+                                  >
+                                    <wx-view
+                                      class="van-slider__button"
+                                    />
+                                  </wx-view>
+                                </wx-view>
+                              </wx-view>
+                            </van-slider>
+                          </wx-view>
+                        </wx-view>
+                        <wx-input
+                          adjustPosition="{{true}}"
+                          alwaysEmbed="{{false}}"
+                          autoFocus="{{false}}"
+                          class="van-field__control input-class"
+                          confirmHold="{{false}}"
+                          confirmType=""
+                          cursor="{{-1}}"
+                          cursorSpacing="{{50}}"
+                          disabled="{{false}}"
+                          focus="{{false}}"
+                          holdKeyboard="{{false}}"
+                          maxlength="{{-1}}"
+                          password="{{false}}"
+                          placeholder=""
+                          placeholderClass="van-field__placeholder"
+                          placeholderStyle=""
+                          selectionEnd="{{-1}}"
+                          selectionStart="{{-1}}"
+                          type="text"
+                          value=""
+                          bind:blur="onBlur"
+                          bind:confirm="onConfirm"
+                          bind:focus="onFocus"
+                          bind:input="onInput"
+                          bind:keyboardheightchange="onKeyboardHeightChange"
+                          bind:tap="onClickInput"
+                        />
+                        <wx-view
+                          class="van-field__icon-container"
+                          bind:tap="onClickIcon"
+                        />
+                        <wx-view
+                          class="van-field__button"
+                        />
+                      </wx-view>
+                    </wx-view>
+                  </wx-view>
+                </van-cell>
+              </van-field>
+            </wx-view>
+          </van-cell-group>
+          <wx-view
+            style="margin: 16px"
+          >
+            <van-button>
+              <wx-button
+                appParameter=""
+                ariaLabel=""
+                businessId="{{0}}"
+                class="custom-class van-button van-button--primary van-button--normal van-button--block 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-config-provider>
+    </wx-view>
+  </demo-block>
+</main>
+`;
diff --git a/packages/config-provider/test/demo.spec.ts b/packages/config-provider/test/demo.spec.ts
new file mode 100644
index 00000000..4c3798cb
--- /dev/null
+++ b/packages/config-provider/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();
+});