From cc36334625c385913f112813a0dc93cc448d87b6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= Date: Thu, 30 May 2019 20:44:05 +0800 Subject: [PATCH] [improvement] IndexBar: add test cases --- .../test/__snapshots__/index.spec.js.snap | 36 +++++++++++++ packages/index-bar/test/index.spec.js | 51 ++++++++++++++++++- 2 files changed, 86 insertions(+), 1 deletion(-) diff --git a/packages/index-bar/test/__snapshots__/index.spec.js.snap b/packages/index-bar/test/__snapshots__/index.spec.js.snap index 875e11e66..d18f1cdea 100644 --- a/packages/index-bar/test/__snapshots__/index.spec.js.snap +++ b/packages/index-bar/test/__snapshots__/index.spec.js.snap @@ -11,3 +11,39 @@ exports[`custom anchor text 1`] = ` `; + +exports[`scroll and update active anchor 1`] = ` +
+
ABCDEFGHIJKLMNOPQRSTUVWXYZ
+
+
1
+
+
+
2
+
+
+
3
+
+
+
4
+
+
+`; + +exports[`scroll and update active anchor 2`] = ` +
+
ABCDEFGHIJKLMNOPQRSTUVWXYZ
+
+
1
+
+
+
2
+
+
+
3
+
+
+
4
+
+
+`; diff --git a/packages/index-bar/test/index.spec.js b/packages/index-bar/test/index.spec.js index 94015c986..dde3fddf9 100644 --- a/packages/index-bar/test/index.spec.js +++ b/packages/index-bar/test/index.spec.js @@ -1,7 +1,7 @@ -import { mount, trigger, triggerDrag } from '../../../test/utils'; import Vue from 'vue'; import IndexBar from '..'; import IndexAnchor from '../../index-anchor'; +import { mount, trigger, triggerDrag } from '../../../test/utils'; Vue.use(IndexBar); Vue.use(IndexAnchor); @@ -12,6 +12,14 @@ function mockScrollIntoView() { return fn; } +function mockOffsetHeight(offsetHeight) { + Object.defineProperty(HTMLElement.prototype, 'offsetHeight', { + get() { + return offsetHeight; + } + }); +} + test('custom anchor text', () => { const wrapper = mount({ template: ` @@ -94,3 +102,44 @@ test('touch and scroll to anchor', () => { expect(fn).toHaveBeenCalledTimes(1); expect(onSelect).toHaveBeenCalledWith('B'); }); + +test('scroll and update active anchor', () => { + const nativeRect = Element.prototype.getBoundingClientRect; + Element.prototype.getBoundingClientRect = function () { + const { index } = this.dataset; + return { + top: index ? index * 10 : 0 + }; + }; + + mockOffsetHeight(10); + + const wrapper = mount({ + template: ` + + + + `, + data() { + return { + sticky: false + }; + } + }); + + window.scrollTop = 0; + trigger(window, 'scroll'); + expect(wrapper).toMatchSnapshot(); + + wrapper.setData({ sticky: true }); + trigger(window, 'scroll'); + expect(wrapper).toMatchSnapshot(); + wrapper.vm.$destroy(); + + Element.prototype.getBoundingClientRect = nativeRect; +});