From bb8bf0e0f81333c0f50be12a47fdc7406fbe25d8 Mon Sep 17 00:00:00 2001
From: tangjinzhou <415800467@qq.com>
Date: Fri, 6 Nov 2020 22:13:45 +0800
Subject: [PATCH] test: update snap

---
 antdv-demo                                    |   2 +-
 .../__tests__/__snapshots__/demo.test.js.snap |   4 +-
 .../__tests__/__snapshots__/demo.test.js.snap |   6 +-
 .../__tests__/__snapshots__/demo.test.js.snap |  16 +--
 .../__tests__/__snapshots__/demo.test.js.snap | 110 +++++++++---------
 .../__tests__/__snapshots__/demo.test.js.snap |  35 +++---
 components/input/__tests__/index.test.js      |   7 +-
 .../__tests__/__snapshots__/demo.test.js.snap |  18 +--
 .../__tests__/__snapshots__/demo.test.js.snap |   6 +-
 .../__tests__/__snapshots__/demo.test.js.snap |   5 +-
 .../__tests__/__snapshots__/demo.test.js.snap |  76 +++++++++---
 tests/shared/demoTest.js                      |  23 ++--
 12 files changed, 179 insertions(+), 129 deletions(-)

diff --git a/antdv-demo b/antdv-demo
index 52006fa6a..1ef0721ef 160000
--- a/antdv-demo
+++ b/antdv-demo
@@ -1 +1 @@
-Subproject commit 52006fa6ae47595a2af099ab226e3c79861d3f84
+Subproject commit 1ef0721ef9a98944042be3708326790615a208e7
diff --git a/components/anchor/__tests__/__snapshots__/demo.test.js.snap b/components/anchor/__tests__/__snapshots__/demo.test.js.snap
index 5183569ab..933b992a6 100644
--- a/components/anchor/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/anchor/__tests__/__snapshots__/demo.test.js.snap
@@ -22,9 +22,9 @@ exports[`renders ./antdv-demo/docs/anchor/demo/basic.md correctly 1`] = `
 exports[`renders ./antdv-demo/docs/anchor/demo/customizeHighlight.md correctly 1`] = `
 <div class="ant-anchor-wrapper" style="max-height: 100vh;">
   <div class="ant-anchor fixed">
-    <div class="ant-anchor-ink"><span class="ant-anchor-ink-ball"></span></div>
+    <div class="ant-anchor-ink"><span class="ant-anchor-ink-ball visible" style="top: -4.5px;"></span></div>
     <div class="ant-anchor-link"><a href="#components-anchor-demo-basic" title="Basic demo" class="ant-anchor-link-title">Basic demo</a></div>
-    <div class="ant-anchor-link"><a href="#components-anchor-demo-static" title="Static demo" class="ant-anchor-link-title">Static demo</a></div>
+    <div class="ant-anchor-link ant-anchor-link-active"><a href="#components-anchor-demo-static" title="Static demo" class="ant-anchor-link-title ant-anchor-link-title-active">Static demo</a></div>
     <div class="ant-anchor-link"><a href="#API" title="API" class="ant-anchor-link-title">API</a>
       <div class="ant-anchor-link"><a href="#Anchor-Props" title="Anchor Props" class="ant-anchor-link-title">Anchor Props</a></div>
       <div class="ant-anchor-link"><a href="#Link-Props" title="Link Props" class="ant-anchor-link-title">Link Props</a></div>
diff --git a/components/avatar/__tests__/__snapshots__/demo.test.js.snap b/components/avatar/__tests__/__snapshots__/demo.test.js.snap
index 221432c1a..07e062633 100644
--- a/components/avatar/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/avatar/__tests__/__snapshots__/demo.test.js.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`renders ./antdv-demo/docs/avatar/demo/badge.md correctly 1`] = `<div><span style="margin-right: 24px;"><span class="ant-badge"><span class="ant-avatar ant-avatar-square ant-avatar-icon"><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i></span><sup title="1" class="ant-scroll-number ant-badge-count ant-badge-zoom-enter" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1100%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit current">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span></span> <span><span class="ant-badge"><span class="ant-avatar ant-avatar-square ant-avatar-icon"><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i></span><sup class="ant-scroll-number ant-badge-dot ant-badge-zoom-enter" data-show="true"></sup></span></span></div>`;
+exports[`renders ./antdv-demo/docs/avatar/demo/badge.md correctly 1`] = `<div><span style="margin-right: 24px;"><span class="ant-badge"><span class="ant-avatar ant-avatar-square ant-avatar-icon"><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i></span><sup title="1" class="ant-scroll-number ant-badge-count" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1100%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit current">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span></span> <span><span class="ant-badge"><span class="ant-avatar ant-avatar-square ant-avatar-icon"><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i></span><sup class="ant-scroll-number ant-badge-dot" data-show="true"></sup></span></span></div>`;
 
 exports[`renders ./antdv-demo/docs/avatar/demo/basic.md correctly 1`] = `
 <div>
@@ -10,13 +10,13 @@ exports[`renders ./antdv-demo/docs/avatar/demo/basic.md correctly 1`] = `
 `;
 
 exports[`renders ./antdv-demo/docs/avatar/demo/dynamic.md correctly 1`] = `
-<div><span class="ant-avatar ant-avatar-lg ant-avatar-square" style="background-color: rgb(245, 106, 0); vertical-align: middle;"><span class="ant-avatar-string" style="opacity: 0;">
+<div><span class="ant-avatar ant-avatar-lg ant-avatar-square" style="background-color: rgb(245, 106, 0); vertical-align: middle;"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">
     U
   </span></span> <button type="button" class="ant-btn ant-btn-sm" style="vertical-align: middle;"><span>改 变</span></button></div>
 `;
 
 exports[`renders ./antdv-demo/docs/avatar/demo/type.md correctly 1`] = `
-<div><span class="ant-avatar ant-avatar-circle ant-avatar-icon"><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i></span> <span class="ant-avatar ant-avatar-circle ant-avatar-icon"><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i></span> <span class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="opacity: 0;">U</span></span> <span class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="opacity: 0;">USER</span></span> <span class="ant-avatar ant-avatar-circle ant-avatar-image"><img src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png"></span> <span class="ant-avatar ant-avatar-circle" style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);"><span class="ant-avatar-string" style="opacity: 0;">
+<div><span class="ant-avatar ant-avatar-circle ant-avatar-icon"><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i></span> <span class="ant-avatar ant-avatar-circle ant-avatar-icon"><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i></span> <span class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">U</span></span> <span class="ant-avatar ant-avatar-circle"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">USER</span></span> <span class="ant-avatar ant-avatar-circle ant-avatar-image"><img src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png"></span> <span class="ant-avatar ant-avatar-circle" style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);"><span class="ant-avatar-string" style="transform: scale(1) translateX(-50%);">
     U
   </span></span> <span class="ant-avatar ant-avatar-circle ant-avatar-icon" style="background-color: rgb(135, 208, 104);"><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i></span></div>
 `;
diff --git a/components/badge/__tests__/__snapshots__/demo.test.js.snap b/components/badge/__tests__/__snapshots__/demo.test.js.snap
index f5f0b7f2d..251d267ad 100644
--- a/components/badge/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/badge/__tests__/__snapshots__/demo.test.js.snap
@@ -1,10 +1,10 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`renders ./antdv-demo/docs/badge/demo/basic.md correctly 1`] = `<div><span class="ant-badge"><a href="#" class="head-example"></a><sup title="5" class="ant-scroll-number ant-badge-count ant-badge-zoom-enter" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1500%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit current">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span> <span class="ant-badge"><a href="#" class="head-example"></a><sup title="0" class="ant-scroll-number ant-badge-count ant-badge-zoom-enter" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1000%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit current">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span> <span class="ant-badge"><a href="#" class="head-example"></a><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-scroll-number-custom-component ant-badge-zoom-enter" style="color: rgb(245, 34, 45);" data-show="true"><svg viewBox="64 64 896 896" data-icon="clock-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path><path d="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></div>`;
+exports[`renders ./antdv-demo/docs/badge/demo/basic.md correctly 1`] = `<div><span class="ant-badge"><a href="#" class="head-example"></a><sup title="5" class="ant-scroll-number ant-badge-count" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1500%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit current">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span> <span class="ant-badge"><a href="#" class="head-example"></a><sup title="0" class="ant-scroll-number ant-badge-count" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1000%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit current">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span> <span class="ant-badge"><a href="#" class="head-example"></a><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-scroll-number-custom-component" style="color: rgb(245, 34, 45);" data-show="true"><svg viewBox="64 64 896 896" data-icon="clock-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path><path d="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></div>`;
 
 exports[`renders ./antdv-demo/docs/badge/demo/change.md correctly 1`] = `
 <div>
-  <div><span class="ant-badge"><a href="#" class="head-example"></a><sup title="5" class="ant-scroll-number ant-badge-count ant-badge-zoom-enter" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1500%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit current">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span>
+  <div><span class="ant-badge"><a href="#" class="head-example"></a><sup title="5" class="ant-scroll-number ant-badge-count" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1500%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit current">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span>
     <div class="ant-btn-group"><button type="button" class="ant-btn"><i aria-label="icon: minus" class="anticon anticon-minus"><svg viewBox="64 64 896 896" data-icon="minus" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class="">
             <path d="M872 474H152c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h720c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8z"></path>
           </svg></i></button><button type="button" class="ant-btn"><i aria-label="icon: plus" class="anticon anticon-plus"><svg viewBox="64 64 896 896" data-icon="plus" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class="">
@@ -12,7 +12,7 @@ exports[`renders ./antdv-demo/docs/badge/demo/change.md correctly 1`] = `
             <path d="M176 474h672q8 0 8 8v60q0 8-8 8H176q-8 0-8-8v-60q0-8 8-8z"></path>
           </svg></i></button></div>
   </div>
-  <div style="margin-top: 10px;"><span class="ant-badge"><a href="#" class="head-example"></a><sup class="ant-scroll-number ant-badge-dot ant-badge-zoom-enter" data-show="true"></sup></span> <button type="button" role="switch" aria-checked="true" class="ant-switch ant-switch-checked"><span class="ant-switch-inner"></span></button></div>
+  <div style="margin-top: 10px;"><span class="ant-badge"><a href="#" class="head-example"></a><sup class="ant-scroll-number ant-badge-dot" data-show="true"></sup></span> <button type="button" role="switch" aria-checked="true" class="ant-switch ant-switch-checked"><span class="ant-switch-inner"></span></button></div>
 </div>
 `;
 
@@ -43,14 +43,14 @@ exports[`renders ./antdv-demo/docs/badge/demo/colors.md correctly 1`] = `
 </div>
 `;
 
-exports[`renders ./antdv-demo/docs/badge/demo/dot.md correctly 1`] = `<div id="components-badge-demo-dot"><span class="ant-badge"><i aria-label="icon: notification" class="anticon anticon-notification"><svg viewBox="64 64 896 896" data-icon="notification" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M880 112c-3.8 0-7.7.7-11.6 2.3L292 345.9H128c-8.8 0-16 7.4-16 16.6v299c0 9.2 7.2 16.6 16 16.6h101.7c-3.7 11.6-5.7 23.9-5.7 36.4 0 65.9 53.8 119.5 120 119.5 55.4 0 102.1-37.6 115.9-88.4l408.6 164.2c3.9 1.5 7.8 2.3 11.6 2.3 16.9 0 32-14.2 32-33.2V145.2C912 126.2 897 112 880 112zM344 762.3c-26.5 0-48-21.4-48-47.8 0-11.2 3.9-21.9 11-30.4l84.9 34.1c-2 24.6-22.7 44.1-47.9 44.1zm496 58.4L318.8 611.3l-12.9-5.2H184V417.9h121.9l12.9-5.2L840 203.3v617.4z"></path></svg></i><sup class="ant-scroll-number ant-badge-dot ant-badge-zoom-enter" data-show="true"></sup></span> <span class="ant-badge"><i aria-label="icon: notification" class="anticon anticon-notification"><svg viewBox="64 64 896 896" data-icon="notification" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M880 112c-3.8 0-7.7.7-11.6 2.3L292 345.9H128c-8.8 0-16 7.4-16 16.6v299c0 9.2 7.2 16.6 16 16.6h101.7c-3.7 11.6-5.7 23.9-5.7 36.4 0 65.9 53.8 119.5 120 119.5 55.4 0 102.1-37.6 115.9-88.4l408.6 164.2c3.9 1.5 7.8 2.3 11.6 2.3 16.9 0 32-14.2 32-33.2V145.2C912 126.2 897 112 880 112zM344 762.3c-26.5 0-48-21.4-48-47.8 0-11.2 3.9-21.9 11-30.4l84.9 34.1c-2 24.6-22.7 44.1-47.9 44.1zm496 58.4L318.8 611.3l-12.9-5.2H184V417.9h121.9l12.9-5.2L840 203.3v617.4z"></path></svg></i><!----></span> <span class="ant-badge"><a href="#">Link something</a><sup class="ant-scroll-number ant-badge-dot ant-badge-zoom-enter" data-show="true"></sup></span></div>`;
+exports[`renders ./antdv-demo/docs/badge/demo/dot.md correctly 1`] = `<div id="components-badge-demo-dot"><span class="ant-badge"><i aria-label="icon: notification" class="anticon anticon-notification"><svg viewBox="64 64 896 896" data-icon="notification" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M880 112c-3.8 0-7.7.7-11.6 2.3L292 345.9H128c-8.8 0-16 7.4-16 16.6v299c0 9.2 7.2 16.6 16 16.6h101.7c-3.7 11.6-5.7 23.9-5.7 36.4 0 65.9 53.8 119.5 120 119.5 55.4 0 102.1-37.6 115.9-88.4l408.6 164.2c3.9 1.5 7.8 2.3 11.6 2.3 16.9 0 32-14.2 32-33.2V145.2C912 126.2 897 112 880 112zM344 762.3c-26.5 0-48-21.4-48-47.8 0-11.2 3.9-21.9 11-30.4l84.9 34.1c-2 24.6-22.7 44.1-47.9 44.1zm496 58.4L318.8 611.3l-12.9-5.2H184V417.9h121.9l12.9-5.2L840 203.3v617.4z"></path></svg></i><sup class="ant-scroll-number ant-badge-dot" data-show="true"></sup></span> <span class="ant-badge"><i aria-label="icon: notification" class="anticon anticon-notification"><svg viewBox="64 64 896 896" data-icon="notification" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M880 112c-3.8 0-7.7.7-11.6 2.3L292 345.9H128c-8.8 0-16 7.4-16 16.6v299c0 9.2 7.2 16.6 16 16.6h101.7c-3.7 11.6-5.7 23.9-5.7 36.4 0 65.9 53.8 119.5 120 119.5 55.4 0 102.1-37.6 115.9-88.4l408.6 164.2c3.9 1.5 7.8 2.3 11.6 2.3 16.9 0 32-14.2 32-33.2V145.2C912 126.2 897 112 880 112zM344 762.3c-26.5 0-48-21.4-48-47.8 0-11.2 3.9-21.9 11-30.4l84.9 34.1c-2 24.6-22.7 44.1-47.9 44.1zm496 58.4L318.8 611.3l-12.9-5.2H184V417.9h121.9l12.9-5.2L840 203.3v617.4z"></path></svg></i><!----></span> <span class="ant-badge"><a href="#">Link something</a><sup class="ant-scroll-number ant-badge-dot" data-show="true"></sup></span></div>`;
 
-exports[`renders ./antdv-demo/docs/badge/demo/link.md correctly 1`] = `<a href="#"><span class="ant-badge"><span class="head-example"></span><sup title="5" class="ant-scroll-number ant-badge-count ant-badge-zoom-enter" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1500%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit current">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span></a>`;
+exports[`renders ./antdv-demo/docs/badge/demo/link.md correctly 1`] = `<a href="#"><span class="ant-badge"><span class="head-example"></span><sup title="5" class="ant-scroll-number ant-badge-count" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1500%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit current">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span></a>`;
 
-exports[`renders ./antdv-demo/docs/badge/demo/no-wrapper.md correctly 1`] = `<div><span class="ant-badge ant-badge-not-a-wrapper"><sup title="25" class="ant-scroll-number ant-badge-count ant-badge-multiple-words -enter" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1200%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit current">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1500%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit current">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span> <span class="ant-badge ant-badge-not-a-wrapper"><sup title="4" class="ant-scroll-number ant-badge-count -enter" style="background-color: rgb(255, 255, 255); color: rgb(153, 153, 153); box-shadow: 0 0 0 1px #d9d9d9 inset;" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1400%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit current">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span> <span class="ant-badge ant-badge-not-a-wrapper"><sup title="109" class="ant-scroll-number ant-badge-count ant-badge-multiple-words -enter" style="background-color: rgb(82, 196, 26);" data-show="true">99+</sup></span></div>`;
+exports[`renders ./antdv-demo/docs/badge/demo/no-wrapper.md correctly 1`] = `<div><span class="ant-badge ant-badge-not-a-wrapper"><sup title="25" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1200%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit current">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1500%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit current">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span> <span class="ant-badge ant-badge-not-a-wrapper"><sup title="4" class="ant-scroll-number ant-badge-count" style="background-color: rgb(255, 255, 255); color: rgb(153, 153, 153); box-shadow: 0 0 0 1px #d9d9d9 inset;" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1400%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit current">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span> <span class="ant-badge ant-badge-not-a-wrapper"><sup title="109" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" style="background-color: rgb(82, 196, 26);" data-show="true">99+</sup></span></div>`;
 
-exports[`renders ./antdv-demo/docs/badge/demo/overflow.md correctly 1`] = `<div><span class="ant-badge"><a href="#" class="head-example"></a><sup title="99" class="ant-scroll-number ant-badge-count ant-badge-multiple-words ant-badge-zoom-enter" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1900%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit current">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1900%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit current">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span> <span class="ant-badge"><a href="#" class="head-example"></a><sup title="100" class="ant-scroll-number ant-badge-count ant-badge-multiple-words ant-badge-zoom-enter" data-show="true">99+</sup></span> <span class="ant-badge"><a href="#" class="head-example"></a><sup title="99" class="ant-scroll-number ant-badge-count ant-badge-multiple-words ant-badge-zoom-enter" data-show="true">10+</sup></span> <span class="ant-badge"><a href="#" class="head-example"></a><sup title="1000" class="ant-scroll-number ant-badge-count ant-badge-multiple-words ant-badge-zoom-enter" data-show="true">999+</sup></span></div>`;
+exports[`renders ./antdv-demo/docs/badge/demo/overflow.md correctly 1`] = `<div><span class="ant-badge"><a href="#" class="head-example"></a><sup title="99" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1900%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit current">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1900%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit current">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span> <span class="ant-badge"><a href="#" class="head-example"></a><sup title="100" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" data-show="true">99+</sup></span> <span class="ant-badge"><a href="#" class="head-example"></a><sup title="99" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" data-show="true">10+</sup></span> <span class="ant-badge"><a href="#" class="head-example"></a><sup title="1000" class="ant-scroll-number ant-badge-count ant-badge-multiple-words" data-show="true">999+</sup></span></div>`;
 
 exports[`renders ./antdv-demo/docs/badge/demo/status.md correctly 1`] = `<div><span class="ant-badge ant-badge-status ant-badge-not-a-wrapper"><span class="ant-badge-status-dot ant-badge-status-success"></span><span class="ant-badge-status-text"></span></span> <span class="ant-badge ant-badge-status ant-badge-not-a-wrapper"><span class="ant-badge-status-dot ant-badge-status-error"></span><span class="ant-badge-status-text"></span></span> <span class="ant-badge ant-badge-status ant-badge-not-a-wrapper"><span class="ant-badge-status-dot ant-badge-status-default"></span><span class="ant-badge-status-text"></span></span> <span class="ant-badge ant-badge-status ant-badge-not-a-wrapper"><span class="ant-badge-status-dot ant-badge-status-processing"></span><span class="ant-badge-status-text"></span></span> <span class="ant-badge ant-badge-status ant-badge-not-a-wrapper"><span class="ant-badge-status-dot ant-badge-status-warning"></span><span class="ant-badge-status-text"></span></span> <br> <span class="ant-badge ant-badge-status ant-badge-not-a-wrapper"><span class="ant-badge-status-dot ant-badge-status-success"></span><span class="ant-badge-status-text">Success</span></span> <br> <span class="ant-badge ant-badge-status ant-badge-not-a-wrapper"><span class="ant-badge-status-dot ant-badge-status-error"></span><span class="ant-badge-status-text">Error</span></span> <br> <span class="ant-badge ant-badge-status ant-badge-not-a-wrapper"><span class="ant-badge-status-dot ant-badge-status-default"></span><span class="ant-badge-status-text">Default</span></span> <br> <span class="ant-badge ant-badge-status ant-badge-not-a-wrapper"><span class="ant-badge-status-dot ant-badge-status-processing"></span><span class="ant-badge-status-text">Processing</span></span> <br> <span class="ant-badge ant-badge-status ant-badge-not-a-wrapper"><span class="ant-badge-status-dot ant-badge-status-warning"></span><span class="ant-badge-status-text">warning</span></span></div>`;
 
-exports[`renders ./antdv-demo/docs/badge/demo/title.md correctly 1`] = `<div id="components-badge-demo-title"><span class="ant-badge"><a href="#" class="head-example"></a><sup title="Custom hover text" class="ant-scroll-number ant-badge-count ant-badge-zoom-enter" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1500%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit current">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span></div>`;
+exports[`renders ./antdv-demo/docs/badge/demo/title.md correctly 1`] = `<div id="components-badge-demo-title"><span class="ant-badge"><a href="#" class="head-example"></a><sup title="Custom hover text" class="ant-scroll-number ant-badge-count" data-show="true"><span class="ant-scroll-number-only" style="transition: none; transform: translateY(-1500%);"><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit current">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p><p class="ant-scroll-number-only-unit">0</p><p class="ant-scroll-number-only-unit">1</p><p class="ant-scroll-number-only-unit">2</p><p class="ant-scroll-number-only-unit">3</p><p class="ant-scroll-number-only-unit">4</p><p class="ant-scroll-number-only-unit">5</p><p class="ant-scroll-number-only-unit">6</p><p class="ant-scroll-number-only-unit">7</p><p class="ant-scroll-number-only-unit">8</p><p class="ant-scroll-number-only-unit">9</p></span></sup></span></div>`;
diff --git a/components/carousel/__tests__/__snapshots__/demo.test.js.snap b/components/carousel/__tests__/__snapshots__/demo.test.js.snap
index 823bc6a42..a002ede01 100644
--- a/components/carousel/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/carousel/__tests__/__snapshots__/demo.test.js.snap
@@ -4,64 +4,64 @@ exports[`renders ./antdv-demo/docs/carousel/demo/autoplay.md correctly 1`] = `
 <div class="ant-carousel">
   <div class="slick-slider slick-initialized">
     <div class="slick-list">
-      <div class="slick-track" style="width: 900%; left: -100%;">
-        <div tabindex="-1" data-index="-1" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+      <div class="slick-track" style="opacity: 1; transform: translate3d(0px, 0px, 0px);">
+        <div tabindex="-1" data-index="-1" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>4</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="0" class="slick-slide slick-active slick-current" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="0" class="slick-slide slick-active slick-current" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>1</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>2</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>3</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>4</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>1</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>2</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>3</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>4</h3>
@@ -84,64 +84,64 @@ exports[`renders ./antdv-demo/docs/carousel/demo/basic.md correctly 1`] = `
 <div class="ant-carousel">
   <div class="slick-slider slick-initialized">
     <div class="slick-list">
-      <div class="slick-track" style="width: 900%; left: -100%;">
-        <div tabindex="-1" data-index="-1" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+      <div class="slick-track" style="opacity: 1; transform: translate3d(0px, 0px, 0px);">
+        <div tabindex="-1" data-index="-1" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>4</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="0" class="slick-slide slick-active slick-current" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="0" class="slick-slide slick-active slick-current" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>1</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>2</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>3</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>4</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>1</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>2</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>3</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>4</h3>
@@ -168,64 +168,64 @@ exports[`renders ./antdv-demo/docs/carousel/demo/customArrows.md correctly 1`] =
           <path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path>
         </svg></i></div>
     <div class="slick-list">
-      <div class="slick-track" style="width: 900%; left: -100%;">
-        <div tabindex="-1" data-index="-1" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+      <div class="slick-track" style="opacity: 1; transform: translate3d(0px, 0px, 0px);">
+        <div tabindex="-1" data-index="-1" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>4</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="0" class="slick-slide slick-active slick-current" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="0" class="slick-slide slick-active slick-current" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>1</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>2</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>3</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>4</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>1</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>2</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>3</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>4</h3>
@@ -252,48 +252,48 @@ exports[`renders ./antdv-demo/docs/carousel/demo/customPaging.md correctly 1`] =
 <div class="ant-carousel">
   <div class="slick-slider slick-initialized"><button type="button" class="slick-arrow slick-prev" style="display: block;"> Previous</button>
     <div class="slick-list">
-      <div class="slick-track" style="width: 900%; left: -100%;">
-        <div tabindex="-1" data-index="-1" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+      <div class="slick-track" style="opacity: 1; transform: translate3d(0px, 0px, 0px);">
+        <div tabindex="-1" data-index="-1" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/master/components/vc-slick/assets/img/react-slick/abstract04.jpg"></div>
           </div>
         </div>
-        <div tabindex="-1" data-index="0" class="slick-slide slick-active slick-current" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="0" class="slick-slide slick-active slick-current" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/master/components/vc-slick/assets/img/react-slick/abstract01.jpg"></div>
           </div>
         </div>
-        <div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/master/components/vc-slick/assets/img/react-slick/abstract02.jpg"></div>
           </div>
         </div>
-        <div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/master/components/vc-slick/assets/img/react-slick/abstract03.jpg"></div>
           </div>
         </div>
-        <div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/master/components/vc-slick/assets/img/react-slick/abstract04.jpg"></div>
           </div>
         </div>
-        <div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/master/components/vc-slick/assets/img/react-slick/abstract01.jpg"></div>
           </div>
         </div>
-        <div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/master/components/vc-slick/assets/img/react-slick/abstract02.jpg"></div>
           </div>
         </div>
-        <div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/master/components/vc-slick/assets/img/react-slick/abstract03.jpg"></div>
           </div>
         </div>
-        <div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;"><img src="https://raw.githubusercontent.com/vueComponent/ant-design-vue/master/components/vc-slick/assets/img/react-slick/abstract04.jpg"></div>
           </div>
@@ -314,29 +314,29 @@ exports[`renders ./antdv-demo/docs/carousel/demo/fade.md correctly 1`] = `
 <div class="ant-carousel">
   <div class="slick-slider slick-initialized">
     <div class="slick-list">
-      <div class="slick-track" style="width: 900%; left: -100%;">
-        <div tabindex="-1" data-index="0" class="slick-slide slick-active slick-current" style="outline: none; width: 11.11111111111111%; position: relative; left: 0px; opacity: 1; transition: opacity 500ms ease, visibility 500ms ease;">
+      <div class="slick-track" style="opacity: 1;">
+        <div tabindex="-1" data-index="0" class="slick-slide slick-active slick-current" style="outline: none; width: 0px; position: relative; left: 0px; opacity: 1; transition: opacity 500ms ease, visibility 500ms ease;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>1</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%; position: relative; left: -11px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;">
+        <div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px; position: relative; left: 0px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>2</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%; position: relative; left: -22px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;">
+        <div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px; position: relative; left: 0px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>3</h3>
             </div>
           </div>
         </div>
-        <div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%; position: relative; left: -33px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;">
+        <div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px; position: relative; left: 0px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;">
           <div>
             <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
               <h3>4</h3>
@@ -369,64 +369,64 @@ exports[`renders ./antdv-demo/docs/carousel/demo/position.md correctly 1`] = `
   <div class="ant-carousel">
     <div class="slick-slider slick-initialized">
       <div class="slick-list">
-        <div class="slick-track" style="width: 900%; left: -100%;">
-          <div tabindex="-1" data-index="-1" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+        <div class="slick-track" style="opacity: 1; transform: translate3d(0px, 0px, 0px);">
+          <div tabindex="-1" data-index="-1" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
             <div>
               <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
                 <h3>4</h3>
               </div>
             </div>
           </div>
-          <div tabindex="-1" data-index="0" class="slick-slide slick-active slick-current" style="outline: none; width: 11.11111111111111%;">
+          <div tabindex="-1" data-index="0" class="slick-slide slick-active slick-current" style="outline: none; width: 0px;">
             <div>
               <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
                 <h3>1</h3>
               </div>
             </div>
           </div>
-          <div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+          <div tabindex="-1" data-index="1" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
             <div>
               <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
                 <h3>2</h3>
               </div>
             </div>
           </div>
-          <div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+          <div tabindex="-1" data-index="2" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
             <div>
               <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
                 <h3>3</h3>
               </div>
             </div>
           </div>
-          <div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 11.11111111111111%;">
+          <div tabindex="-1" data-index="3" aria-hidden="true" class="slick-slide" style="outline: none; width: 0px;">
             <div>
               <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
                 <h3>4</h3>
               </div>
             </div>
           </div>
-          <div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+          <div tabindex="-1" data-index="4" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
             <div>
               <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
                 <h3>1</h3>
               </div>
             </div>
           </div>
-          <div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+          <div tabindex="-1" data-index="5" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
             <div>
               <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
                 <h3>2</h3>
               </div>
             </div>
           </div>
-          <div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+          <div tabindex="-1" data-index="6" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
             <div>
               <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
                 <h3>3</h3>
               </div>
             </div>
           </div>
-          <div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 11.11111111111111%;">
+          <div tabindex="-1" data-index="7" aria-hidden="true" class="slick-slide slick-cloned" style="width: 0px;">
             <div>
               <div tabindex="-1" class="" style="width: 100%; display: inline-block;">
                 <h3>4</h3>
diff --git a/components/form/__tests__/__snapshots__/demo.test.js.snap b/components/form/__tests__/__snapshots__/demo.test.js.snap
index 404d3c4a5..6c5a74b38 100644
--- a/components/form/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/form/__tests__/__snapshots__/demo.test.js.snap
@@ -268,7 +268,7 @@ exports[`renders ./antdv-demo/docs/form/demo/horizontal-login.vue correctly 1`]
   </div>
   <div class="ant-row ant-form-item">
     <div class="ant-col ant-form-item-control-wrapper">
-      <div class="ant-form-item-control"><span class="ant-form-item-children"><button type="submit" class="ant-btn ant-btn-primary"><span>Log in</span></button></span>
+      <div class="ant-form-item-control"><span class="ant-form-item-children"><button type="submit" class="ant-btn ant-btn-primary" disabled="disabled"><span>Log in</span></button></span>
         <!---->
       </div>
     </div>
@@ -643,18 +643,25 @@ exports[`renders ./antdv-demo/docs/form/demo/validate-other.vue correctly 1`] =
   <div class="ant-row ant-form-item">
     <div class="ant-col ant-col-6 ant-form-item-label"><label for="validate_other_upload" title="Upload" class="">Upload</label></div>
     <div class="ant-col ant-col-14 ant-form-item-control-wrapper">
-      <div class="ant-form-item-control"><span class="ant-form-item-children"><span class=""><div class="ant-upload ant-upload-select ant-upload-select-picture"><!----></div><div class="ant-upload-list ant-upload-list-picture"></div></span></span>
-        <!---->
-        <div class="ant-form-extra">longgggggggggggggggggggggggggggggggggg</div>
-      </div>
+      <div class="ant-form-item-control"><span class="ant-form-item-children"><span class=""><div class="ant-upload ant-upload-select ant-upload-select-picture"><span role="button" tabindex="0" class="ant-upload"><input id="validate_other_upload" type="file" accept="" style="display: none;"><button type="button" class="ant-btn"><i aria-label="icon: upload" class="anticon anticon-upload"><svg viewBox="64 64 896 896" data-icon="upload" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M400 317.7h73.9V656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V317.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 163a8 8 0 0 0-12.6 0l-112 141.7c-4.1 5.3-.4 13 6.3 13zM878 626h-60c-4.4 0-8 3.6-8 8v154H214V634c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v198c0 17.7 14.3 32 32 32h684c17.7 0 32-14.3 32-32V634c0-4.4-3.6-8-8-8z"></path></svg></i><span>Click to upload</span></button></span></div>
+      <div class="ant-upload-list ant-upload-list-picture"></div></span></span>
+      <!---->
+      <div class="ant-form-extra">longgggggggggggggggggggggggggggggggggg</div>
     </div>
   </div>
+  </div>
   <div class="ant-row ant-form-item">
     <div class="ant-col ant-col-6 ant-form-item-label"><label for="validate_other_dragger" title="Dragger" class="">Dragger</label></div>
     <div class="ant-col ant-col-14 ant-form-item-control-wrapper">
-      <div class="ant-form-item-control"><span class="ant-form-item-children"><div class="dropbox"><span data-__meta="[object Object]" data-__field="[object Object]" id="validate_other_dragger" class=""><div class="ant-upload ant-upload-drag"><!----></div><div class="ant-upload-list ant-upload-list-text"></div></span></div></span>
-      <!---->
-    </div>
+      <div class="ant-form-item-control"><span class="ant-form-item-children"><div class="dropbox"><span data-__meta="[object Object]" data-__field="[object Object]" id="validate_other_dragger" class=""><div class="ant-upload ant-upload-drag"><span role="button" tabindex="0" class="ant-upload ant-upload-btn"><input type="file" accept="" style="display: none;"><div class="ant-upload-drag-container"><p class="ant-upload-drag-icon"><i aria-label="icon: inbox" class="anticon anticon-inbox"><svg viewBox="0 0 1024 1024" data-icon="inbox" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M885.2 446.3l-.2-.8-112.2-285.1c-5-16.1-19.9-27.2-36.8-27.2H281.2c-17 0-32.1 11.3-36.9 27.6L139.4 443l-.3.7-.2.8c-1.3 4.9-1.7 9.9-1 14.8-.1 1.6-.2 3.2-.2 4.8V830a60.9 60.9 0 0 0 60.8 60.8h627.2c33.5 0 60.8-27.3 60.9-60.8V464.1c0-1.3 0-2.6-.1-3.7.4-4.9 0-9.6-1.3-14.1zm-295.8-43l-.3 15.7c-.8 44.9-31.8 75.1-77.1 75.1-22.1 0-41.1-7.1-54.8-20.6S436 441.2 435.6 419l-.3-15.7H229.5L309 210h399.2l81.7 193.3H589.4zm-375 76.8h157.3c24.3 57.1 76 90.8 140.4 90.8 33.7 0 65-9.4 90.3-27.2 22.2-15.6 39.5-37.4 50.7-63.6h156.5V814H214.4V480.1z"></path></svg></i></p> <p class="ant-upload-text">
+          Click or drag file to this area to upload
+        </p> <p class="ant-upload-hint">
+          Support for a single or bulk upload.
+        </p></div></span></div>
+      <div class="ant-upload-list ant-upload-list-text"></div></span>
+    </div></span>
+    <!---->
+  </div>
   </div>
   </div>
   <div class="ant-row ant-form-item">
@@ -673,7 +680,7 @@ exports[`renders ./antdv-demo/docs/form/demo/validate-static.vue correctly 1`] =
     <div class="ant-col ant-col-xs-24 ant-col-sm-5 ant-form-item-label"><label title="Fail" class="">Fail</label></div>
     <div class="ant-col ant-col-xs-24 ant-col-sm-12 ant-form-item-control-wrapper">
       <div class="ant-form-item-control has-error"><span class="ant-form-item-children"><input placeholder="unavailable choice" type="text" id="error" class="ant-input"></span>
-        <div class="ant-form-explain show-help-enter">Should be combination of numbers &amp; alphabets</div>
+        <div class="ant-form-explain">Should be combination of numbers &amp; alphabets</div>
       </div>
     </div>
   </div>
@@ -689,7 +696,7 @@ exports[`renders ./antdv-demo/docs/form/demo/validate-static.vue correctly 1`] =
     <div class="ant-col ant-col-xs-24 ant-col-sm-5 ant-form-item-label"><label title="Validating" class="">Validating</label></div>
     <div class="ant-col ant-col-xs-24 ant-col-sm-12 ant-form-item-control-wrapper">
       <div class="ant-form-item-control has-feedback is-validating"><span class="ant-form-item-children"><input placeholder="I'm the content is being validated" type="text" id="validating" class="ant-input"><span class="ant-form-item-children-icon"><i aria-label="icon: loading" class="anticon anticon-loading"><svg viewBox="0 0 1024 1024" data-icon="loading" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class="anticon-spin"><path d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 0 0-94.3-139.9 437.71 437.71 0 0 0-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"></path></svg></i></span></span>
-        <div class="ant-form-explain show-help-enter">The information is being validated...</div>
+        <div class="ant-form-explain">The information is being validated...</div>
       </div>
     </div>
   </div>
@@ -713,7 +720,7 @@ exports[`renders ./antdv-demo/docs/form/demo/validate-static.vue correctly 1`] =
     <div class="ant-col ant-col-xs-24 ant-col-sm-5 ant-form-item-label"><label title="Fail" class="">Fail</label></div>
     <div class="ant-col ant-col-xs-24 ant-col-sm-12 ant-form-item-control-wrapper">
       <div class="ant-form-item-control has-feedback has-error"><span class="ant-form-item-children"><input placeholder="unavailable choice" type="text" id="error2" class="ant-input"><span class="ant-form-item-children-icon"><i aria-label="icon: close-circle" class="anticon anticon-close-circle"><svg viewBox="64 64 896 896" data-icon="close-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"></path></svg></i></span></span>
-        <div class="ant-form-explain show-help-enter">Should be combination of numbers &amp; alphabets</div>
+        <div class="ant-form-explain">Should be combination of numbers &amp; alphabets</div>
       </div>
     </div>
   </div>
@@ -752,7 +759,7 @@ exports[`renders ./antdv-demo/docs/form/demo/validate-static.vue correctly 1`] =
           </svg></i><i aria-label="icon: down" class="anticon anticon-down ant-cascader-picker-arrow"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class="">
             <path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path>
           </svg></i></span><span class="ant-form-item-children-icon"><i aria-label="icon: loading" class="anticon anticon-loading"><svg viewBox="0 0 1024 1024" data-icon="loading" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class="anticon-spin"><path d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 0 0-94.3-139.9 437.71 437.71 0 0 0-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"></path></svg></i></span></span>
-        <div class="ant-form-explain show-help-enter">The information is being validated...</div>
+        <div class="ant-form-explain">The information is being validated...</div>
       </div>
     </div>
   </div>
@@ -760,7 +767,7 @@ exports[`renders ./antdv-demo/docs/form/demo/validate-static.vue correctly 1`] =
     <div class="ant-col ant-col-xs-24 ant-col-sm-5 ant-form-item-label"><label title="inline" class="">inline</label></div>
     <div class="ant-col ant-col-xs-24 ant-col-sm-12 ant-form-item-control-wrapper">
       <div class="ant-form-item-control"><span class="ant-form-item-children"><div class="ant-row ant-form-item ant-form-item-with-help" style="display: inline-block;"><div class="ant-col ant-form-item-control-wrapper"><div class="ant-form-item-control has-error"><span class="ant-form-item-children"><span class="ant-calendar-picker" style="width: 100%;"><div class=""><input readonly="true" placeholder="Select date" class="ant-calendar-picker-input ant-input"><i aria-label="icon: calendar" class="anticon anticon-calendar ant-calendar-picker-icon"><svg viewBox="64 64 896 896" data-icon="calendar" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path></svg></i></div></span></span>
-        <div class="ant-form-explain show-help-enter">Please select the correct date</div>
+        <div class="ant-form-explain">Please select the correct date</div>
       </div>
     </div>
   </div><span style="display: inline-block; width: 24px; text-align: center;">
@@ -822,7 +829,7 @@ exports[`renders ./antdv-demo/docs/form/demo/without-form-create.vue correctly 1
       <div class="ant-form-item-control"><span class="ant-form-item-children"><div class="ant-input-number"><div class="ant-input-number-handler-wrap"><span class="ant-input-number-handler ant-input-number-handler-up " unselectable="unselectable" role="button" aria-label="Increase Value"><i aria-label="icon: up" class="anticon anticon-up ant-input-number-handler-up-inner"><svg viewBox="64 64 896 896" data-icon="up" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 0 0 140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"></path></svg></i></span><span class="ant-input-number-handler ant-input-number-handler-down " unselectable="unselectable" role="button" aria-label="Decrease Value"><i aria-label="icon: down" class="anticon anticon-down ant-input-number-handler-down-inner"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
       <div class="ant-input-number-input-wrap"><input role="spinbutton" aria-valuemin="8" aria-valuemax="12" aria-valuenow="11" autocomplete="off" max="12" min="8" step="1" class="ant-input-number-input"></div>
     </div></span>
-    <div class="ant-form-explain show-help-enter">A prime is a natural number greater than 1 that has no positive divisors other than 1 and itself.</div>
+    <div class="ant-form-explain">A prime is a natural number greater than 1 that has no positive divisors other than 1 and itself.</div>
   </div>
   </div>
   </div>
diff --git a/components/input/__tests__/index.test.js b/components/input/__tests__/index.test.js
index 3ca8f6d82..d60fc7381 100644
--- a/components/input/__tests__/index.test.js
+++ b/components/input/__tests__/index.test.js
@@ -39,20 +39,21 @@ describe('TextArea', () => {
       propsData: { value: '', readOnly: true, autoSize: true },
       sync: false,
     });
-
     const mockFunc = jest.spyOn(wrapper.vm.$refs.resizableTextArea, 'resizeTextarea');
+
     await asyncExpect(() => {
+      expect(mockFunc).toHaveBeenCalledTimes(1);
       wrapper.setProps({ value: '1111\n2222\n3333' });
     });
     await asyncExpect(() => {
-      expect(mockFunc).toHaveBeenCalledTimes(1);
+      expect(mockFunc).toHaveBeenCalledTimes(2);
     });
     await asyncExpect(() => {
       wrapper.setProps({ value: '1111' });
     });
 
     await asyncExpect(() => {
-      expect(mockFunc).toHaveBeenCalledTimes(2);
+      expect(mockFunc).toHaveBeenCalledTimes(3);
     }, 100);
   });
 
diff --git a/components/layout/__tests__/__snapshots__/demo.test.js.snap b/components/layout/__tests__/__snapshots__/demo.test.js.snap
index 576bca6d8..d514e06b1 100644
--- a/components/layout/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/layout/__tests__/__snapshots__/demo.test.js.snap
@@ -9,7 +9,7 @@ exports[`renders ./antdv-demo/docs/layout/demo/basic.md correctly 1`] = `
   </section>
   <section class="ant-layout">
     <header class="ant-layout-header">Header</header>
-    <section class="ant-layout">
+    <section class="ant-layout ant-layout-has-sider">
       <aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
         <div class="ant-layout-sider-children">Sider</div>
       </aside>
@@ -19,7 +19,7 @@ exports[`renders ./antdv-demo/docs/layout/demo/basic.md correctly 1`] = `
   </section>
   <section class="ant-layout">
     <header class="ant-layout-header">Header</header>
-    <section class="ant-layout">
+    <section class="ant-layout ant-layout-has-sider">
       <main class="ant-layout-content">Content</main>
       <aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
         <div class="ant-layout-sider-children">Sider</div>
@@ -27,7 +27,7 @@ exports[`renders ./antdv-demo/docs/layout/demo/basic.md correctly 1`] = `
     </section>
     <footer class="ant-layout-footer">Footer</footer>
   </section>
-  <section class="ant-layout">
+  <section class="ant-layout ant-layout-has-sider">
     <aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
       <div class="ant-layout-sider-children">Sider</div>
     </aside>
@@ -41,7 +41,7 @@ exports[`renders ./antdv-demo/docs/layout/demo/basic.md correctly 1`] = `
 `;
 
 exports[`renders ./antdv-demo/docs/layout/demo/custom-trigger.md correctly 1`] = `
-<section class="ant-layout" id="components-layout-demo-custom-trigger">
+<section class="ant-layout ant-layout-has-sider" id="components-layout-demo-custom-trigger">
   <aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
     <div class="ant-layout-sider-children">
       <div class="logo"></div>
@@ -110,7 +110,7 @@ exports[`renders ./antdv-demo/docs/layout/demo/fixed.md correctly 1`] = `
 `;
 
 exports[`renders ./antdv-demo/docs/layout/demo/fixed-sider.md correctly 1`] = `
-<section class="ant-layout" id="components-layout-demo-fixed-sider">
+<section class="ant-layout ant-layout-has-sider" id="components-layout-demo-fixed-sider">
   <aside class="ant-layout-sider ant-layout-sider-dark" style="max-width: 200px; min-width: 200px; width: 200px; overflow: auto; height: 100vh; position: fixed; left: 0px; flex: 0 0 200px;">
     <div class="ant-layout-sider-children">
       <div class="logo"></div>
@@ -169,7 +169,7 @@ exports[`renders ./antdv-demo/docs/layout/demo/fixed-sider.md correctly 1`] = `
 `;
 
 exports[`renders ./antdv-demo/docs/layout/demo/responsive.md correctly 1`] = `
-<section class="ant-layout" id="components-layout-demo-responsive">
+<section class="ant-layout ant-layout-has-sider" id="components-layout-demo-responsive">
   <aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
     <div class="ant-layout-sider-children">
       <div class="logo"></div>
@@ -204,7 +204,7 @@ exports[`renders ./antdv-demo/docs/layout/demo/responsive.md correctly 1`] = `
 `;
 
 exports[`renders ./antdv-demo/docs/layout/demo/side.md correctly 1`] = `
-<section class="ant-layout" id="components-layout-demo-side" style="min-height: 100vh;">
+<section class="ant-layout ant-layout-has-sider" id="components-layout-demo-side" style="min-height: 100vh;">
   <aside class="ant-layout-sider ant-layout-sider-dark ant-layout-sider-has-trigger" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
     <div class="ant-layout-sider-children">
       <div class="logo"></div>
@@ -317,7 +317,7 @@ exports[`renders ./antdv-demo/docs/layout/demo/top-side.md correctly 1`] = `
   </header>
   <main class="ant-layout-content" style="padding: 0px 50px;">
     <div class="ant-breadcrumb" style="margin: 16px 0px;"><span class=""><span class="ant-breadcrumb-link">Home</span><span class="ant-breadcrumb-separator">/</span></span><span class=""><span class="ant-breadcrumb-link">List</span><span class="ant-breadcrumb-separator">/</span></span><span class=""><span class="ant-breadcrumb-link">App</span><span class="ant-breadcrumb-separator">/</span></span></div>
-    <section class="ant-layout" style="padding: 24px 0px; background: rgb(255, 255, 255);">
+    <section class="ant-layout ant-layout-has-sider" style="padding: 24px 0px; background: rgb(255, 255, 255);">
       <aside class="ant-layout-sider ant-layout-sider-dark" style="max-width: 200px; min-width: 200px; width: 200px; flex: 0 0 200px; background: rgb(255, 255, 255);">
         <div class="ant-layout-sider-children">
           <ul role="menu" class="ant-menu ant-menu-inline ant-menu-root ant-menu-light" style="height: 100%;">
@@ -388,7 +388,7 @@ exports[`renders ./antdv-demo/docs/layout/demo/top-side-2.md correctly 1`] = `
       </li>
     </ul>
   </header>
-  <section class="ant-layout">
+  <section class="ant-layout ant-layout-has-sider">
     <aside class="ant-layout-sider ant-layout-sider-dark" style="max-width: 200px; min-width: 200px; width: 200px; flex: 0 0 200px; background: rgb(255, 255, 255);">
       <div class="ant-layout-sider-children">
         <ul role="menu" class="ant-menu ant-menu-inline ant-menu-root ant-menu-light" style="height: 100%; border-right: 0;">
diff --git a/components/space/__tests__/__snapshots__/demo.test.js.snap b/components/space/__tests__/__snapshots__/demo.test.js.snap
index e0c520885..1d61de96c 100644
--- a/components/space/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/space/__tests__/__snapshots__/demo.test.js.snap
@@ -47,8 +47,10 @@ exports[`renders ./antdv-demo/docs/space/demo/base.md correctly 1`] = `
     Space
   </div>
   <div class="ant-space-item" style="margin-right: 8px;"><button type="button" class="ant-btn ant-btn-primary"><span>Button</span></button></div>
-  <div class="ant-space-item" style="margin-right: 8px;"><span><div class="ant-upload ant-upload-select ant-upload-select-text"><!----></div><div class="ant-upload-list ant-upload-list-text"></div></span></div>
-  <div class="ant-space-item"><button type="button" class="ant-btn"><span>Confirm</span></button></div>
+  <div class="ant-space-item" style="margin-right: 8px;"><span><div class="ant-upload ant-upload-select ant-upload-select-text"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" style="display: none;"><button type="button" class="ant-btn"><i aria-label="icon: upload" class="anticon anticon-upload"><svg viewBox="64 64 896 896" data-icon="upload" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M400 317.7h73.9V656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V317.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 163a8 8 0 0 0-12.6 0l-112 141.7c-4.1 5.3-.4 13 6.3 13zM878 626h-60c-4.4 0-8 3.6-8 8v154H214V634c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v198c0 17.7 14.3 32 32 32h684c17.7 0 32-14.3 32-32V634c0-4.4-3.6-8-8-8z"></path></svg></i><span>Click to Upload</span></button></span></div>
+  <div class="ant-upload-list ant-upload-list-text"></div></span>
+</div>
+<div class="ant-space-item"><button type="button" class="ant-btn"><span>Confirm</span></button></div>
 </div>
 `;
 
diff --git a/components/table/__tests__/__snapshots__/demo.test.js.snap b/components/table/__tests__/__snapshots__/demo.test.js.snap
index e3229ca39..fc94105af 100644
--- a/components/table/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/table/__tests__/__snapshots__/demo.test.js.snap
@@ -3,7 +3,10 @@
 exports[`renders ./antdv-demo/docs/table/demo/ajax.md correctly 1`] = `
 <div class="ant-table-wrapper">
   <div class="ant-spin-nested-loading ant-table-without-pagination ant-table-spin-holder">
-    <div class="ant-spin-container">
+    <div>
+      <div class="ant-spin ant-spin-spinning"><span class="ant-spin-dot ant-spin-dot-spin"><i class="ant-spin-dot-item"></i><i class="ant-spin-dot-item"></i><i class="ant-spin-dot-item"></i><i class="ant-spin-dot-item"></i></span></div>
+    </div>
+    <div class="ant-spin-container ant-spin-blur">
       <div class="ant-table ant-table-scroll-position-left ant-table-default ant-table-empty">
         <div class="ant-table-content">
           <!---->
diff --git a/components/upload/__tests__/__snapshots__/demo.test.js.snap b/components/upload/__tests__/__snapshots__/demo.test.js.snap
index 56083e2ef..8f05dfdbb 100644
--- a/components/upload/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/upload/__tests__/__snapshots__/demo.test.js.snap
@@ -1,14 +1,26 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`renders ./antdv-demo/docs/upload/demo/avatar.md correctly 1`] = `<span class="avatar-uploader ant-upload-picture-card-wrapper"><div class="ant-upload ant-upload-select ant-upload-select-picture-card"><!----></div></span>`;
+exports[`renders ./antdv-demo/docs/upload/demo/avatar.md correctly 1`] = `
+<span class="avatar-uploader ant-upload-picture-card-wrapper"><div class="ant-upload ant-upload-select ant-upload-select-picture-card"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" style="display: none;"><div><i aria-label="icon: plus" class="anticon anticon-plus"><svg viewBox="64 64 896 896" data-icon="plus" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M482 152h60q8 0 8 8v704q0 8-8 8h-60q-8 0-8-8V160q0-8 8-8z"></path><path d="M176 474h672q8 0 8 8v60q0 8-8 8H176q-8 0-8-8v-60q0-8 8-8z"></path></svg></i> <div class="ant-upload-text">
+      Upload
+    </div></div></span></div></span>
+`;
 
-exports[`renders ./antdv-demo/docs/upload/demo/basic copy 3.md correctly 1`] = `<span><div class="ant-upload ant-upload-select ant-upload-select-text"><!----></div><div class="ant-upload-list ant-upload-list-text"></div></span>`;
+exports[`renders ./antdv-demo/docs/upload/demo/basic copy 3.md correctly 1`] = `
+<span><div class="ant-upload ant-upload-select ant-upload-select-text"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" multiple="multiple" style="display: none;"><button type="button" class="ant-btn"><i aria-label="icon: upload" class="anticon anticon-upload"><svg viewBox="64 64 896 896" data-icon="upload" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M400 317.7h73.9V656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V317.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 163a8 8 0 0 0-12.6 0l-112 141.7c-4.1 5.3-.4 13 6.3 13zM878 626h-60c-4.4 0-8 3.6-8 8v154H214V634c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v198c0 17.7 14.3 32 32 32h684c17.7 0 32-14.3 32-32V634c0-4.4-3.6-8-8-8z"></path></svg></i><span>Click to Upload</span></button></span></div>
+<div class="ant-upload-list ant-upload-list-text"></div></span>
+`;
 
-exports[`renders ./antdv-demo/docs/upload/demo/basic.md correctly 1`] = `<span><div class="ant-upload ant-upload-select ant-upload-select-text"><!----></div><div class="ant-upload-list ant-upload-list-text"></div></span>`;
+exports[`renders ./antdv-demo/docs/upload/demo/basic.md correctly 1`] = `
+<span><div class="ant-upload ant-upload-select ant-upload-select-text"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" multiple="multiple" style="display: none;"><button type="button" class="ant-btn"><i aria-label="icon: upload" class="anticon anticon-upload"><svg viewBox="64 64 896 896" data-icon="upload" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M400 317.7h73.9V656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V317.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 163a8 8 0 0 0-12.6 0l-112 141.7c-4.1 5.3-.4 13 6.3 13zM878 626h-60c-4.4 0-8 3.6-8 8v154H214V634c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v198c0 17.7 14.3 32 32 32h684c17.7 0 32-14.3 32-32V634c0-4.4-3.6-8-8-8z"></path></svg></i><span>Click to Upload</span></button></span></div>
+<div class="ant-upload-list ant-upload-list-text"></div></span>
+`;
 
 exports[`renders ./antdv-demo/docs/upload/demo/defaultFileList.md correctly 1`] = `
-<span><div class="ant-upload ant-upload-select ant-upload-select-text"><!----></div><div class="ant-upload-list ant-upload-list-text"><div class=""><span><div class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"><div class="ant-upload-list-item-info"><span><i aria-label="icon: paper-clip" class="anticon anticon-paper-clip"><svg viewBox="64 64 896 896" data-icon="paper-clip" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M779.3 196.6c-94.2-94.2-247.6-94.2-341.7 0l-261 260.8c-1.7 1.7-2.6 4-2.6 6.4s.9 4.7 2.6 6.4l36.9 36.9a9 9 0 0 0 12.7 0l261-260.8c32.4-32.4 75.5-50.2 121.3-50.2s88.9 17.8 121.2 50.2c32.4 32.4 50.2 75.5 50.2 121.2 0 45.8-17.8 88.8-50.2 121.2l-266 265.9-43.1 43.1c-40.3 40.3-105.8 40.3-146.1 0-19.5-19.5-30.2-45.4-30.2-73s10.7-53.5 30.2-73l263.9-263.8c6.7-6.6 15.5-10.3 24.9-10.3h.1c9.4 0 18.1 3.7 24.7 10.3 6.7 6.7 10.3 15.5 10.3 24.9 0 9.3-3.7 18.1-10.3 24.7L372.4 653c-1.7 1.7-2.6 4-2.6 6.4s.9 4.7 2.6 6.4l36.9 36.9a9 9 0 0 0 12.7 0l215.6-215.6c19.9-19.9 30.8-46.3 30.8-74.4s-11-54.6-30.8-74.4c-41.1-41.1-107.9-41-149 0L463 364 224.8 602.1A172.22 172.22 0 0 0 174 724.8c0 46.3 18.1 89.8 50.8 122.5 33.9 33.8 78.3 50.7 122.7 50.7 44.4 0 88.8-16.9 122.6-50.7l309.2-309C824.8 492.7 850 432 850 367.5c.1-64.6-25.1-125.3-70.7-170.9z"></path></svg></i><a target="_blank" rel="noopener noreferrer" title="xxx.png" href="http://www.baidu.com/xxx.png" class="ant-upload-list-item-name ant-upload-list-item-name-icon-count-1">xxx.png</a><span class="ant-upload-list-item-card-actions "><a title="Remove file"><i aria-label="icon: delete" tabindex="-1" class="anticon anticon-delete" title="Remove file"><svg viewBox="64 64 896 896" data-icon="delete" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"></path></svg></i></a></span></span></div>
-<!---->
+<span><div class="ant-upload ant-upload-select ant-upload-select-text"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" style="display: none;"><button type="button" class="ant-btn"><i aria-label="icon: upload" class="anticon anticon-upload"><svg viewBox="64 64 896 896" data-icon="upload" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M400 317.7h73.9V656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V317.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 163a8 8 0 0 0-12.6 0l-112 141.7c-4.1 5.3-.4 13 6.3 13zM878 626h-60c-4.4 0-8 3.6-8 8v154H214V634c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v198c0 17.7 14.3 32 32 32h684c17.7 0 32-14.3 32-32V634c0-4.4-3.6-8-8-8z"></path></svg></i><span>Upload</span></button></span></div>
+<div class="ant-upload-list ant-upload-list-text">
+  <div class=""><span><div class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"><div class="ant-upload-list-item-info"><span><i aria-label="icon: paper-clip" class="anticon anticon-paper-clip"><svg viewBox="64 64 896 896" data-icon="paper-clip" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M779.3 196.6c-94.2-94.2-247.6-94.2-341.7 0l-261 260.8c-1.7 1.7-2.6 4-2.6 6.4s.9 4.7 2.6 6.4l36.9 36.9a9 9 0 0 0 12.7 0l261-260.8c32.4-32.4 75.5-50.2 121.3-50.2s88.9 17.8 121.2 50.2c32.4 32.4 50.2 75.5 50.2 121.2 0 45.8-17.8 88.8-50.2 121.2l-266 265.9-43.1 43.1c-40.3 40.3-105.8 40.3-146.1 0-19.5-19.5-30.2-45.4-30.2-73s10.7-53.5 30.2-73l263.9-263.8c6.7-6.6 15.5-10.3 24.9-10.3h.1c9.4 0 18.1 3.7 24.7 10.3 6.7 6.7 10.3 15.5 10.3 24.9 0 9.3-3.7 18.1-10.3 24.7L372.4 653c-1.7 1.7-2.6 4-2.6 6.4s.9 4.7 2.6 6.4l36.9 36.9a9 9 0 0 0 12.7 0l215.6-215.6c19.9-19.9 30.8-46.3 30.8-74.4s-11-54.6-30.8-74.4c-41.1-41.1-107.9-41-149 0L463 364 224.8 602.1A172.22 172.22 0 0 0 174 724.8c0 46.3 18.1 89.8 50.8 122.5 33.9 33.8 78.3 50.7 122.7 50.7 44.4 0 88.8-16.9 122.6-50.7l309.2-309C824.8 492.7 850 432 850 367.5c.1-64.6-25.1-125.3-70.7-170.9z"></path></svg></i><a target="_blank" rel="noopener noreferrer" title="xxx.png" href="http://www.baidu.com/xxx.png" class="ant-upload-list-item-name ant-upload-list-item-name-icon-count-1">xxx.png</a><span class="ant-upload-list-item-card-actions "><a title="Remove file"><i aria-label="icon: delete" tabindex="-1" class="anticon anticon-delete" title="Remove file"><svg viewBox="64 64 896 896" data-icon="delete" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"></path></svg></i></a></span></span></div>
+  <!---->
 </div></span></div>
 <div class=""><span><div class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"><div class="ant-upload-list-item-info"><span><i aria-label="icon: paper-clip" class="anticon anticon-paper-clip"><svg viewBox="64 64 896 896" data-icon="paper-clip" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M779.3 196.6c-94.2-94.2-247.6-94.2-341.7 0l-261 260.8c-1.7 1.7-2.6 4-2.6 6.4s.9 4.7 2.6 6.4l36.9 36.9a9 9 0 0 0 12.7 0l261-260.8c32.4-32.4 75.5-50.2 121.3-50.2s88.9 17.8 121.2 50.2c32.4 32.4 50.2 75.5 50.2 121.2 0 45.8-17.8 88.8-50.2 121.2l-266 265.9-43.1 43.1c-40.3 40.3-105.8 40.3-146.1 0-19.5-19.5-30.2-45.4-30.2-73s10.7-53.5 30.2-73l263.9-263.8c6.7-6.6 15.5-10.3 24.9-10.3h.1c9.4 0 18.1 3.7 24.7 10.3 6.7 6.7 10.3 15.5 10.3 24.9 0 9.3-3.7 18.1-10.3 24.7L372.4 653c-1.7 1.7-2.6 4-2.6 6.4s.9 4.7 2.6 6.4l36.9 36.9a9 9 0 0 0 12.7 0l215.6-215.6c19.9-19.9 30.8-46.3 30.8-74.4s-11-54.6-30.8-74.4c-41.1-41.1-107.9-41-149 0L463 364 224.8 602.1A172.22 172.22 0 0 0 174 724.8c0 46.3 18.1 89.8 50.8 122.5 33.9 33.8 78.3 50.7 122.7 50.7 44.4 0 88.8-16.9 122.6-50.7l309.2-309C824.8 492.7 850 432 850 367.5c.1-64.6-25.1-125.3-70.7-170.9z"></path></svg></i><a target="_blank" rel="noopener noreferrer" title="yyy.png" href="http://www.baidu.com/yyy.png" class="ant-upload-list-item-name ant-upload-list-item-name-icon-count-1">yyy.png</a><span class="ant-upload-list-item-card-actions "><a title="Remove file"><i aria-label="icon: delete" tabindex="-1" class="anticon anticon-delete" title="Remove file"><svg viewBox="64 64 896 896" data-icon="delete" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"></path></svg></i></a></span></span></div>
 <!---->
@@ -22,13 +34,26 @@ exports[`renders ./antdv-demo/docs/upload/demo/defaultFileList.md correctly 1`]
 </div></span>
 `;
 
-exports[`renders ./antdv-demo/docs/upload/demo/directory.md correctly 1`] = `<span><div class="ant-upload ant-upload-select ant-upload-select-text"><!----></div><div class="ant-upload-list ant-upload-list-text"></div></span>`;
+exports[`renders ./antdv-demo/docs/upload/demo/directory.md correctly 1`] = `
+<span><div class="ant-upload ant-upload-select ant-upload-select-text"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" directory="directory" webkitdirectory="webkitdirectory" style="display: none;"><button type="button" class="ant-btn"><i aria-label="icon: upload" class="anticon anticon-upload"><svg viewBox="64 64 896 896" data-icon="upload" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M400 317.7h73.9V656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V317.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 163a8 8 0 0 0-12.6 0l-112 141.7c-4.1 5.3-.4 13 6.3 13zM878 626h-60c-4.4 0-8 3.6-8 8v154H214V634c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v198c0 17.7 14.3 32 32 32h684c17.7 0 32-14.3 32-32V634c0-4.4-3.6-8-8-8z"></path></svg></i><span>Upload Directory</span></button></span></div>
+<div class="ant-upload-list ant-upload-list-text"></div></span>
+`;
 
-exports[`renders ./antdv-demo/docs/upload/demo/drag.md correctly 1`] = `<span><div class="ant-upload ant-upload-drag"><!----></div><div class="ant-upload-list ant-upload-list-text"></div></span>`;
+exports[`renders ./antdv-demo/docs/upload/demo/drag.md correctly 1`] = `
+<span><div class="ant-upload ant-upload-drag"><span role="button" tabindex="0" class="ant-upload ant-upload-btn"><input type="file" accept="" multiple="multiple" style="display: none;"><div class="ant-upload-drag-container"><p class="ant-upload-drag-icon"><i aria-label="icon: inbox" class="anticon anticon-inbox"><svg viewBox="0 0 1024 1024" data-icon="inbox" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M885.2 446.3l-.2-.8-112.2-285.1c-5-16.1-19.9-27.2-36.8-27.2H281.2c-17 0-32.1 11.3-36.9 27.6L139.4 443l-.3.7-.2.8c-1.3 4.9-1.7 9.9-1 14.8-.1 1.6-.2 3.2-.2 4.8V830a60.9 60.9 0 0 0 60.8 60.8h627.2c33.5 0 60.8-27.3 60.9-60.8V464.1c0-1.3 0-2.6-.1-3.7.4-4.9 0-9.6-1.3-14.1zm-295.8-43l-.3 15.7c-.8 44.9-31.8 75.1-77.1 75.1-22.1 0-41.1-7.1-54.8-20.6S436 441.2 435.6 419l-.3-15.7H229.5L309 210h399.2l81.7 193.3H589.4zm-375 76.8h157.3c24.3 57.1 76 90.8 140.4 90.8 33.7 0 65-9.4 90.3-27.2 22.2-15.6 39.5-37.4 50.7-63.6h156.5V814H214.4V480.1z"></path></svg></i></p> <p class="ant-upload-text">
+    Click or drag file to this area to upload
+  </p> <p class="ant-upload-hint">
+    Support for a single or bulk upload. Strictly prohibit from uploading company data or other
+    band files
+  </p></div></span></div>
+<div class="ant-upload-list ant-upload-list-text"></div></span>
+`;
 
 exports[`renders ./antdv-demo/docs/upload/demo/fileList.md correctly 1`] = `
-<span><div class="ant-upload ant-upload-select ant-upload-select-text"><!----></div><div class="ant-upload-list ant-upload-list-text"><div class=""><span><div class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"><div class="ant-upload-list-item-info"><span><i aria-label="icon: paper-clip" class="anticon anticon-paper-clip"><svg viewBox="64 64 896 896" data-icon="paper-clip" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M779.3 196.6c-94.2-94.2-247.6-94.2-341.7 0l-261 260.8c-1.7 1.7-2.6 4-2.6 6.4s.9 4.7 2.6 6.4l36.9 36.9a9 9 0 0 0 12.7 0l261-260.8c32.4-32.4 75.5-50.2 121.3-50.2s88.9 17.8 121.2 50.2c32.4 32.4 50.2 75.5 50.2 121.2 0 45.8-17.8 88.8-50.2 121.2l-266 265.9-43.1 43.1c-40.3 40.3-105.8 40.3-146.1 0-19.5-19.5-30.2-45.4-30.2-73s10.7-53.5 30.2-73l263.9-263.8c6.7-6.6 15.5-10.3 24.9-10.3h.1c9.4 0 18.1 3.7 24.7 10.3 6.7 6.7 10.3 15.5 10.3 24.9 0 9.3-3.7 18.1-10.3 24.7L372.4 653c-1.7 1.7-2.6 4-2.6 6.4s.9 4.7 2.6 6.4l36.9 36.9a9 9 0 0 0 12.7 0l215.6-215.6c19.9-19.9 30.8-46.3 30.8-74.4s-11-54.6-30.8-74.4c-41.1-41.1-107.9-41-149 0L463 364 224.8 602.1A172.22 172.22 0 0 0 174 724.8c0 46.3 18.1 89.8 50.8 122.5 33.9 33.8 78.3 50.7 122.7 50.7 44.4 0 88.8-16.9 122.6-50.7l309.2-309C824.8 492.7 850 432 850 367.5c.1-64.6-25.1-125.3-70.7-170.9z"></path></svg></i><a target="_blank" rel="noopener noreferrer" title="xxx.png" href="http://www.baidu.com/xxx.png" class="ant-upload-list-item-name ant-upload-list-item-name-icon-count-1">xxx.png</a><span class="ant-upload-list-item-card-actions "><a title="Remove file"><i aria-label="icon: delete" tabindex="-1" class="anticon anticon-delete" title="Remove file"><svg viewBox="64 64 896 896" data-icon="delete" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"></path></svg></i></a></span></span></div>
-<!---->
+<span><div class="ant-upload ant-upload-select ant-upload-select-text"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" multiple="multiple" style="display: none;"><button type="button" class="ant-btn"><i aria-label="icon: upload" class="anticon anticon-upload"><svg viewBox="64 64 896 896" data-icon="upload" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M400 317.7h73.9V656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V317.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 163a8 8 0 0 0-12.6 0l-112 141.7c-4.1 5.3-.4 13 6.3 13zM878 626h-60c-4.4 0-8 3.6-8 8v154H214V634c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v198c0 17.7 14.3 32 32 32h684c17.7 0 32-14.3 32-32V634c0-4.4-3.6-8-8-8z"></path></svg></i><span>Upload</span></button></span></div>
+<div class="ant-upload-list ant-upload-list-text">
+  <div class=""><span><div class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"><div class="ant-upload-list-item-info"><span><i aria-label="icon: paper-clip" class="anticon anticon-paper-clip"><svg viewBox="64 64 896 896" data-icon="paper-clip" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M779.3 196.6c-94.2-94.2-247.6-94.2-341.7 0l-261 260.8c-1.7 1.7-2.6 4-2.6 6.4s.9 4.7 2.6 6.4l36.9 36.9a9 9 0 0 0 12.7 0l261-260.8c32.4-32.4 75.5-50.2 121.3-50.2s88.9 17.8 121.2 50.2c32.4 32.4 50.2 75.5 50.2 121.2 0 45.8-17.8 88.8-50.2 121.2l-266 265.9-43.1 43.1c-40.3 40.3-105.8 40.3-146.1 0-19.5-19.5-30.2-45.4-30.2-73s10.7-53.5 30.2-73l263.9-263.8c6.7-6.6 15.5-10.3 24.9-10.3h.1c9.4 0 18.1 3.7 24.7 10.3 6.7 6.7 10.3 15.5 10.3 24.9 0 9.3-3.7 18.1-10.3 24.7L372.4 653c-1.7 1.7-2.6 4-2.6 6.4s.9 4.7 2.6 6.4l36.9 36.9a9 9 0 0 0 12.7 0l215.6-215.6c19.9-19.9 30.8-46.3 30.8-74.4s-11-54.6-30.8-74.4c-41.1-41.1-107.9-41-149 0L463 364 224.8 602.1A172.22 172.22 0 0 0 174 724.8c0 46.3 18.1 89.8 50.8 122.5 33.9 33.8 78.3 50.7 122.7 50.7 44.4 0 88.8-16.9 122.6-50.7l309.2-309C824.8 492.7 850 432 850 367.5c.1-64.6-25.1-125.3-70.7-170.9z"></path></svg></i><a target="_blank" rel="noopener noreferrer" title="xxx.png" href="http://www.baidu.com/xxx.png" class="ant-upload-list-item-name ant-upload-list-item-name-icon-count-1">xxx.png</a><span class="ant-upload-list-item-card-actions "><a title="Remove file"><i aria-label="icon: delete" tabindex="-1" class="anticon anticon-delete" title="Remove file"><svg viewBox="64 64 896 896" data-icon="delete" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"></path></svg></i></a></span></span></div>
+  <!---->
 </div></span></div>
 </div></span>
 `;
@@ -53,22 +78,26 @@ exports[`renders ./antdv-demo/docs/upload/demo/picture-card.md correctly 1`] = `
   </div>
 </div>
 </div>
-<div class="ant-upload ant-upload-select ant-upload-select-picture-card">
-  <!---->
-</div></span>
+<div class="ant-upload ant-upload-select ant-upload-select-picture-card"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" style="display: none;"><div><i aria-label="icon: plus" class="anticon anticon-plus"><svg viewBox="64 64 896 896" data-icon="plus" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M482 152h60q8 0 8 8v704q0 8-8 8h-60q-8 0-8-8V160q0-8 8-8z"></path><path d="M176 474h672q8 0 8 8v60q0 8-8 8H176q-8 0-8-8v-60q0-8 8-8z"></path></svg></i> <div class="ant-upload-text">
+        Upload
+      </div></div></span></div></span>
 <!---->
 </div>
 `;
 
 exports[`renders ./antdv-demo/docs/upload/demo/picture-style.md correctly 1`] = `
-<div><span><div class="ant-upload ant-upload-select ant-upload-select-picture"><!----></div><div class="ant-upload-list ant-upload-list-picture"><div class=""><span><div class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"><div class="ant-upload-list-item-info"><span><a href="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" target="_blank" rel="noopener noreferrer" class="ant-upload-list-item-thumbnail"><img src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" alt="xxx.png" class="ant-upload-list-item-image"></a><a target="_blank" rel="noopener noreferrer" title="xxx.png" href="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" class="ant-upload-list-item-name ant-upload-list-item-name-icon-count-1">xxx.png</a><span class="ant-upload-list-item-card-actions picture"><a title="Remove file"><i aria-label="icon: delete" tabindex="-1" class="anticon anticon-delete" title="Remove file"><svg viewBox="64 64 896 896" data-icon="delete" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"></path></svg></i></a></span></span></div>
-<!---->
+<div><span><div class="ant-upload ant-upload-select ant-upload-select-picture"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" style="display: none;"><button type="button" class="ant-btn"><i aria-label="icon: upload" class="anticon anticon-upload"><svg viewBox="64 64 896 896" data-icon="upload" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M400 317.7h73.9V656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V317.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 163a8 8 0 0 0-12.6 0l-112 141.7c-4.1 5.3-.4 13 6.3 13zM878 626h-60c-4.4 0-8 3.6-8 8v154H214V634c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v198c0 17.7 14.3 32 32 32h684c17.7 0 32-14.3 32-32V634c0-4.4-3.6-8-8-8z"></path></svg></i><span>upload</span></button></span></div>
+<div class="ant-upload-list ant-upload-list-picture">
+  <div class=""><span><div class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"><div class="ant-upload-list-item-info"><span><a href="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" target="_blank" rel="noopener noreferrer" class="ant-upload-list-item-thumbnail"><img src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" alt="xxx.png" class="ant-upload-list-item-image"></a><a target="_blank" rel="noopener noreferrer" title="xxx.png" href="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" class="ant-upload-list-item-name ant-upload-list-item-name-icon-count-1">xxx.png</a><span class="ant-upload-list-item-card-actions picture"><a title="Remove file"><i aria-label="icon: delete" tabindex="-1" class="anticon anticon-delete" title="Remove file"><svg viewBox="64 64 896 896" data-icon="delete" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"></path></svg></i></a></span></span></div>
+  <!---->
 </div></span></div>
 <div class=""><span><div class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"><div class="ant-upload-list-item-info"><span><a href="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" target="_blank" rel="noopener noreferrer" class="ant-upload-list-item-thumbnail"><img src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" alt="yyy.png" class="ant-upload-list-item-image"></a><a target="_blank" rel="noopener noreferrer" title="yyy.png" href="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" class="ant-upload-list-item-name ant-upload-list-item-name-icon-count-1">yyy.png</a><span class="ant-upload-list-item-card-actions picture"><a title="Remove file"><i aria-label="icon: delete" tabindex="-1" class="anticon anticon-delete" title="Remove file"><svg viewBox="64 64 896 896" data-icon="delete" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"></path></svg></i></a></span></span></div>
 <!---->
 </div></span></div>
-</div></span> <br> <br> <span class="upload-list-inline"><div class="ant-upload ant-upload-select ant-upload-select-picture"><!----></div><div class="ant-upload-list ant-upload-list-picture"><div class=""><span><div class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"><div class="ant-upload-list-item-info"><span><a href="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" target="_blank" rel="noopener noreferrer" class="ant-upload-list-item-thumbnail"><img src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" alt="xxx.png" class="ant-upload-list-item-image"></a><a target="_blank" rel="noopener noreferrer" title="xxx.png" href="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" class="ant-upload-list-item-name ant-upload-list-item-name-icon-count-1">xxx.png</a><span class="ant-upload-list-item-card-actions picture"><a title="Remove file"><i aria-label="icon: delete" tabindex="-1" class="anticon anticon-delete" title="Remove file"><svg viewBox="64 64 896 896" data-icon="delete" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"></path></svg></i></a></span></span></div>
-<!---->
+</div></span> <br> <br> <span class="upload-list-inline"><div class="ant-upload ant-upload-select ant-upload-select-picture"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" style="display: none;"><button type="button" class="ant-btn"><i aria-label="icon: upload" class="anticon anticon-upload"><svg viewBox="64 64 896 896" data-icon="upload" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M400 317.7h73.9V656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V317.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 163a8 8 0 0 0-12.6 0l-112 141.7c-4.1 5.3-.4 13 6.3 13zM878 626h-60c-4.4 0-8 3.6-8 8v154H214V634c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v198c0 17.7 14.3 32 32 32h684c17.7 0 32-14.3 32-32V634c0-4.4-3.6-8-8-8z"></path></svg></i><span>upload</span></button></span></div>
+<div class="ant-upload-list ant-upload-list-picture">
+  <div class=""><span><div class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"><div class="ant-upload-list-item-info"><span><a href="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" target="_blank" rel="noopener noreferrer" class="ant-upload-list-item-thumbnail"><img src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" alt="xxx.png" class="ant-upload-list-item-image"></a><a target="_blank" rel="noopener noreferrer" title="xxx.png" href="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" class="ant-upload-list-item-name ant-upload-list-item-name-icon-count-1">xxx.png</a><span class="ant-upload-list-item-card-actions picture"><a title="Remove file"><i aria-label="icon: delete" tabindex="-1" class="anticon anticon-delete" title="Remove file"><svg viewBox="64 64 896 896" data-icon="delete" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"></path></svg></i></a></span></span></div>
+  <!---->
 </div></span></div>
 <div class=""><span><div class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"><div class="ant-upload-list-item-info"><span><a href="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" target="_blank" rel="noopener noreferrer" class="ant-upload-list-item-thumbnail"><img src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" alt="yyy.png" class="ant-upload-list-item-image"></a><a target="_blank" rel="noopener noreferrer" title="yyy.png" href="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" class="ant-upload-list-item-name ant-upload-list-item-name-icon-count-1">yyy.png</a><span class="ant-upload-list-item-card-actions picture"><a title="Remove file"><i aria-label="icon: delete" tabindex="-1" class="anticon anticon-delete" title="Remove file"><svg viewBox="64 64 896 896" data-icon="delete" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"></path></svg></i></a></span></span></div>
 <!---->
@@ -76,8 +105,17 @@ exports[`renders ./antdv-demo/docs/upload/demo/picture-style.md correctly 1`] =
 </div></span></div>
 `;
 
-exports[`renders ./antdv-demo/docs/upload/demo/preview-file.md correctly 1`] = `<div><span><div class="ant-upload ant-upload-select ant-upload-select-picture"><!----></div><div class="ant-upload-list ant-upload-list-picture"></div></span></div>`;
+exports[`renders ./antdv-demo/docs/upload/demo/preview-file.md correctly 1`] = `
+<div><span><div class="ant-upload ant-upload-select ant-upload-select-picture"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" style="display: none;"><button type="button" class="ant-btn"><i aria-label="icon: upload" class="anticon anticon-upload"><svg viewBox="64 64 896 896" data-icon="upload" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M400 317.7h73.9V656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V317.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 163a8 8 0 0 0-12.6 0l-112 141.7c-4.1 5.3-.4 13 6.3 13zM878 626h-60c-4.4 0-8 3.6-8 8v154H214V634c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v198c0 17.7 14.3 32 32 32h684c17.7 0 32-14.3 32-32V634c0-4.4-3.6-8-8-8z"></path></svg></i><span>Upload</span></button></span></div>
+<div class="ant-upload-list ant-upload-list-picture"></div></span></div>
+`;
 
-exports[`renders ./antdv-demo/docs/upload/demo/transform-file.md correctly 1`] = `<div><span><div class="ant-upload ant-upload-select ant-upload-select-text"><!----></div><div class="ant-upload-list ant-upload-list-text"></div></span></div>`;
+exports[`renders ./antdv-demo/docs/upload/demo/transform-file.md correctly 1`] = `
+<div><span><div class="ant-upload ant-upload-select ant-upload-select-text"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" style="display: none;"><button type="button" class="ant-btn"><i aria-label="icon: upload" class="anticon anticon-upload"><svg viewBox="64 64 896 896" data-icon="upload" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M400 317.7h73.9V656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V317.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 163a8 8 0 0 0-12.6 0l-112 141.7c-4.1 5.3-.4 13 6.3 13zM878 626h-60c-4.4 0-8 3.6-8 8v154H214V634c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v198c0 17.7 14.3 32 32 32h684c17.7 0 32-14.3 32-32V634c0-4.4-3.6-8-8-8z"></path></svg></i><span>Upload</span></button></span></div>
+<div class="ant-upload-list ant-upload-list-text"></div></span></div>
+`;
 
-exports[`renders ./antdv-demo/docs/upload/demo/upload-manually.md correctly 1`] = `<div class="clearfix"><span><div class="ant-upload ant-upload-select ant-upload-select-text"><!----></div><div class="ant-upload-list ant-upload-list-text"></div></span> <button disabled="disabled" type="button" class="ant-btn ant-btn-primary" style="margin-top: 16px;"><span>Start Upload</span></button></div>`;
+exports[`renders ./antdv-demo/docs/upload/demo/upload-manually.md correctly 1`] = `
+<div class="clearfix"><span><div class="ant-upload ant-upload-select ant-upload-select-text"><span role="button" tabindex="0" class="ant-upload"><input type="file" accept="" style="display: none;"><button type="button" class="ant-btn"><i aria-label="icon: upload" class="anticon anticon-upload"><svg viewBox="64 64 896 896" data-icon="upload" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M400 317.7h73.9V656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V317.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 163a8 8 0 0 0-12.6 0l-112 141.7c-4.1 5.3-.4 13 6.3 13zM878 626h-60c-4.4 0-8 3.6-8 8v154H214V634c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v198c0 17.7 14.3 32 32 32h684c17.7 0 32-14.3 32-32V634c0-4.4-3.6-8-8-8z"></path></svg></i><span>Select File</span></button></span></div>
+<div class="ant-upload-list ant-upload-list-text"></div></span> <button disabled="disabled" type="button" class="ant-btn ant-btn-primary" style="margin-top: 16px;"><span>Start Upload</span></button></div>
+`;
diff --git a/tests/shared/demoTest.js b/tests/shared/demoTest.js
index c3ddbdb6e..0453d1bc8 100644
--- a/tests/shared/demoTest.js
+++ b/tests/shared/demoTest.js
@@ -4,6 +4,7 @@ import MockDate from 'mockdate';
 import moment from 'moment';
 import Vue from 'vue';
 import antd from 'ant-design-vue';
+import { sleep } from '../utils';
 Vue.use(antd);
 
 export default function demoTest(component, options = {}) {
@@ -15,22 +16,20 @@ export default function demoTest(component, options = {}) {
     if (Array.isArray(options.skip) && options.skip.some(c => file.includes(c))) {
       testMethod = test.skip;
     }
-    testMethod(`renders ${file} correctly`, done => {
+    testMethod(`renders ${file} correctly`, async () => {
       MockDate.set(moment('2016-11-22'));
       const demo = require(`../.${file}`).default || require(`../.${file}`);
       document.body.innerHTML = '';
       const wrapper = mount(demo, { sync: false, attachToDocument: true });
-      Vue.nextTick(() => {
-        // should get dom from element
-        // snap files copy from antd does not need to change
-        // or just change a little
-        const dom = options.getDomFromElement ? wrapper.element : wrapper.html();
-        expect(dom).toMatchSnapshot();
-        MockDate.reset();
-        wrapper.destroy();
-        document.body.innerHTML = '';
-        done();
-      });
+      await sleep();
+      // should get dom from element
+      // snap files copy from antd does not need to change
+      // or just change a little
+      const dom = options.getDomFromElement ? wrapper.element : wrapper.html();
+      expect(dom).toMatchSnapshot();
+      MockDate.reset();
+      wrapper.destroy();
+      document.body.innerHTML = '';
     });
   });
 }