From f0e336cb4fb8cfe431f182f48590979486786482 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= <chenjiahan@youzan.com>
Date: Wed, 8 May 2019 16:42:19 +0800
Subject: [PATCH] fix swipe snapshot
---
.../test/__snapshots__/demo.spec.js.snap | 50 +++++++++----------
packages/swipe/test/demo.spec.js | 8 +++
2 files changed, 33 insertions(+), 25 deletions(-)
diff --git a/packages/swipe/test/__snapshots__/demo.spec.js.snap b/packages/swipe/test/__snapshots__/demo.spec.js.snap
index 52a5fe297..06ad9df91 100644
--- a/packages/swipe/test/__snapshots__/demo.spec.js.snap
+++ b/packages/swipe/test/__snapshots__/demo.spec.js.snap
@@ -4,44 +4,44 @@ exports[`renders demo correctly 1`] = `
<div>
<div>
<div class="van-swipe">
- <div class="van-swipe__track" style="width: 0px; transition-duration: 0ms; transform: translateX(0px);">
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);">1</div>
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);">2</div>
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);">3</div>
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);">4</div>
+ <div class="van-swipe__track" style="width: 400px; transition-duration: 0ms; transform: translateX(0px);">
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);">1</div>
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);">2</div>
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);">3</div>
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);">4</div>
</div>
<div class="van-swipe__indicators"><i class="van-swipe__indicator van-swipe__indicator--active" style="background-color: white;"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i></div>
</div>
</div>
<div>
<div class="van-swipe">
- <div class="van-swipe__track" style="width: 0px; transition-duration: 0ms; transform: translateX(0px);">
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);"><img data-src="https://img.yzcdn.cn/public_files/2017/09/05/3bd347e44233a868c99cf0fe560232be.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);"><img data-src="https://img.yzcdn.cn/public_files/2017/09/05/c0dab461920687911536621b345a0bc9.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);"><img data-src="https://img.yzcdn.cn/public_files/2017/09/05/4e3ea0898b1c2c416eec8c11c5360833.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);"><img data-src="https://img.yzcdn.cn/public_files/2017/09/05/fd08f07665ed67d50e11b32a21ce0682.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
+ <div class="van-swipe__track" style="width: 400px; transition-duration: 0ms; transform: translateX(0px);">
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);"><img data-src="https://img.yzcdn.cn/public_files/2017/09/05/3bd347e44233a868c99cf0fe560232be.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);"><img data-src="https://img.yzcdn.cn/public_files/2017/09/05/c0dab461920687911536621b345a0bc9.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);"><img data-src="https://img.yzcdn.cn/public_files/2017/09/05/4e3ea0898b1c2c416eec8c11c5360833.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);"><img data-src="https://img.yzcdn.cn/public_files/2017/09/05/fd08f07665ed67d50e11b32a21ce0682.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
</div>
<div class="van-swipe__indicators"><i class="van-swipe__indicator van-swipe__indicator--active"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i></div>
</div>
</div>
<div>
<div class="van-swipe">
- <div class="van-swipe__track" style="width: 0px; transition-duration: 0ms; transform: translateX(0px);">
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);">1</div>
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);">2</div>
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);">3</div>
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);">4</div>
+ <div class="van-swipe__track" style="width: 400px; transition-duration: 0ms; transform: translateX(0px);">
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);">1</div>
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);">2</div>
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);">3</div>
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);">4</div>
</div>
<div class="van-swipe__indicators"><i class="van-swipe__indicator van-swipe__indicator--active" style="background-color: white;"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i></div>
</div>
</div>
<div>
<div class="demo-swipe--vertical van-swipe">
- <div class="van-swipe__track" style="height: 0px; transition-duration: 0ms; transform: translateY(0px);">
- <div class="van-swipe-item" style="width: 0px; height: 0px; transform: translateY(0px);">1</div>
- <div class="van-swipe-item" style="width: 0px; height: 0px; transform: translateY(0px);">2</div>
- <div class="van-swipe-item" style="width: 0px; height: 0px; transform: translateY(0px);">3</div>
- <div class="van-swipe-item" style="width: 0px; height: 0px; transform: translateY(0px);">4</div>
+ <div class="van-swipe__track" style="height: 400px; transition-duration: 0ms; transform: translateY(0px);">
+ <div class="van-swipe-item" style="width: 100px; height: 100px; transform: translateY(0px);">1</div>
+ <div class="van-swipe-item" style="width: 100px; height: 100px; transform: translateY(0px);">2</div>
+ <div class="van-swipe-item" style="width: 100px; height: 100px; transform: translateY(0px);">3</div>
+ <div class="van-swipe-item" style="width: 100px; height: 100px; transform: translateY(0px);">4</div>
</div>
<div class="van-swipe__indicators van-swipe__indicators--vertical"><i class="van-swipe__indicator van-swipe__indicator--active" style="background-color: white;"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i></div>
</div>
@@ -59,11 +59,11 @@ exports[`renders demo correctly 1`] = `
</div>
<div>
<div class="van-swipe">
- <div class="van-swipe__track" style="width: 0px; transition-duration: 0ms; transform: translateX(0px);">
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);">1</div>
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);">2</div>
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);">3</div>
- <div class="van-swipe-item" style="width: 0px; height: 100%; transform: translateX(0px);">4</div>
+ <div class="van-swipe__track" style="width: 400px; transition-duration: 0ms; transform: translateX(0px);">
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);">1</div>
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);">2</div>
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);">3</div>
+ <div class="van-swipe-item" style="width: 100px; height: 100%; transform: translateX(0px);">4</div>
</div>
<div class="custom-indicator">
1/4
diff --git a/packages/swipe/test/demo.spec.js b/packages/swipe/test/demo.spec.js
index d647cfabc..e3c3b120a 100644
--- a/packages/swipe/test/demo.spec.js
+++ b/packages/swipe/test/demo.spec.js
@@ -1,4 +1,12 @@
import Demo from '../demo';
import demoTest from '../../../test/demo-test';
+function mockGetBoundingClientRect(vertical) {
+ Element.prototype.getBoundingClientRect = jest.fn(() => ({
+ width: 100,
+ height: 100
+ }));
+}
+
+mockGetBoundingClientRect();
demoTest(Demo);