[bugfix] ImagePreview: wrong index (#1961)

packages/image-preview/test/__snapshots__/index.spec.js.snap

@@ -19,3 +19,23 @@ exports[`render image 1`] = `
   </div>
 </div>
 `;
+
+exports[`zoom 1`] = `
+<div class="van-image-preview">
+  <div class="van-image-preview__index">1/3</div>
+  <div class="van-swipe">
+    <div class="van-swipe__track" style="width: 300px;">
+      <div class="van-swipe-item" style="width: 100px; height: 100%;">
+        <img src="https://img.yzcdn.cn/1.png" class="van-image-preview__image">
+      </div>
+      <div class="van-swipe-item" style="width: 100px; height: 100%;">
+        <img src="https://img.yzcdn.cn/2.png" class="van-image-preview__image">
+      </div>
+      <div class="van-swipe-item" style="width: 100px; height: 100%;">
+        <img src="https://img.yzcdn.cn/3.png" class="van-image-preview__image">
+      </div>
+    </div>
+    <!---->
+  </div>
+</div>
+`;

packages/image-preview/test/index.spec.js

@@ -1,7 +1,16 @@
 import Vue from 'vue';
 import ImagePreview from '..';
 import ImagePreviewVue from '../ImagePreview';
-import { mount, triggerDrag } from '../../../test/utils';
+import { mount, trigger, triggerDrag } from '../../../test/utils';
+
+function triggerZoom(el, x, y) {
+  trigger(el, 'touchstart', 0, 0, { x, y });
+  trigger(el, 'touchmove', -x / 4, -y / 4, { x, y });
+  trigger(el, 'touchmove', -x / 3, -y / 3, { x, y });
+  trigger(el, 'touchmove', -x / 2, -y / 2, { x, y });
+  trigger(el, 'touchmove', -x, -y, { x, y });
+  trigger(el, 'touchend', 0, 0, { touchList: [] });
+}
 
 const images = [
   'https://img.yzcdn.cn/1.png',
@@ -60,3 +69,18 @@ test('register component', () => {
   Vue.use(ImagePreview);
   expect(Vue.component(ImagePreviewVue.name)).toBeTruthy();
 });
+
+test('zoom', async() => {
+  const getBoundingClientRect = Element.prototype.getBoundingClientRect;
+  Element.prototype.getBoundingClientRect = jest.fn(() => ({ width: 100 }));
+
+  const wrapper = mount(ImagePreviewVue, {
+    propsData: { images, value: true }
+  });
+
+  const image = wrapper.find('img');
+  triggerZoom(image, 300, 300);
+  triggerDrag(image, 300, 300);
+  expect(wrapper).toMatchSnapshot();
+  Element.prototype.getBoundingClientRect = getBoundingClientRect;
+});