From 7be198906bb8cce6a7044c72c1e60173f2712e30 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=A9=89=E7=8E=89?= Date: Thu, 3 Sep 2020 13:12:44 +0800 Subject: [PATCH] fix: address pr comments --- packages/dropdown/__tests__/dropdown.spec.ts | 32 ++++++++--------- .../scrollbar/__tests__/scrollbar.spec.ts | 14 ++++---- packages/test-utils/define-getter.ts | 36 +++++++++++++++++-- 3 files changed, 57 insertions(+), 25 deletions(-) diff --git a/packages/dropdown/__tests__/dropdown.spec.ts b/packages/dropdown/__tests__/dropdown.spec.ts index 528a89a31a..464f850d09 100644 --- a/packages/dropdown/__tests__/dropdown.spec.ts +++ b/packages/dropdown/__tests__/dropdown.spec.ts @@ -5,11 +5,11 @@ import Dropdown from '../src/dropdown.vue' import DropdownItem from '../src/dropdown-item.vue' import DropdownMenu from '../src/dropdown-menu.vue' +const TIMEOUT = 250 const MOUSE_ENTER_EVENT = 'mouseenter' const MOUSE_LEAVE_EVENT = 'mouseleave' const CLICK = 'click' -const _sleep = () => sleep(250) const _mount = (template: string, data, otherObj?) => mount({ components: { [Dropdown.name]: Dropdown, @@ -46,10 +46,10 @@ describe('Dropdown', () => { const triggerElm = wrapper.find('.el-dropdown-link') expect(content.value).toBe(false) await triggerElm.trigger(MOUSE_ENTER_EVENT) - await _sleep() + await sleep(TIMEOUT) expect(content.value).toBe(true) await triggerElm.trigger(MOUSE_LEAVE_EVENT) - await _sleep() + await sleep(TIMEOUT) expect(content.value).toBe(false) }) @@ -86,9 +86,9 @@ describe('Dropdown', () => { // const content = wrapper.findComponent({ ref: 'b' }).vm.$refs.popper as any const triggerElm = wrapper.find('.el-dropdown-link') await triggerElm.trigger(MOUSE_ENTER_EVENT) - await _sleep() + await sleep(TIMEOUT) await wrapper.findComponent({ ref: 'c' }).trigger('click') - await _sleep() + await sleep(TIMEOUT) expect((wrapper.vm as any).name).toBe('CommandC') }) @@ -119,10 +119,10 @@ describe('Dropdown', () => { const triggerElm = wrapper.find('.el-dropdown-link') expect(content.value).toBe(false) await triggerElm.trigger(MOUSE_ENTER_EVENT) - await _sleep() + await sleep(TIMEOUT) expect(content.value).toBe(false) await triggerElm.trigger(CLICK) - await _sleep() + await sleep(TIMEOUT) expect(content.value).toBe(true) }) @@ -161,7 +161,7 @@ describe('Dropdown', () => { await button.trigger('click') expect((wrapper.vm as any).name).toBe('click') await triggerElm.trigger(MOUSE_ENTER_EVENT) - await _sleep() + await sleep(TIMEOUT) expect(content.value).toBe(true) }) @@ -189,9 +189,9 @@ describe('Dropdown', () => { const content = wrapper.findComponent({ ref: 'b' }).vm.$refs.popper as any const triggerElm = wrapper.find('.el-dropdown-link') await triggerElm.trigger(MOUSE_ENTER_EVENT) - await _sleep() + await sleep(TIMEOUT) await wrapper.findComponent({ ref: 'c' }).trigger('click') - await _sleep() + await sleep(TIMEOUT) expect(content.value).toBe(true) }) @@ -219,19 +219,19 @@ describe('Dropdown', () => { const content = wrapper.findComponent({ ref: 'b' }).vm.$refs.popper as any const triggerElm = wrapper.find('.el-dropdown-link') await triggerElm.trigger(MOUSE_ENTER_EVENT) - await _sleep() + await sleep(TIMEOUT) await triggerElm.trigger('keydown', { keyCode: eventKeys.enter, }) - await _sleep() + await sleep(TIMEOUT) expect(content.value).toBe(false) await triggerElm.trigger(MOUSE_ENTER_EVENT) - await _sleep() + await sleep(TIMEOUT) await triggerElm.trigger('keydown', { keyCode: eventKeys.tab, }) - await _sleep() + await sleep(TIMEOUT) expect(content.value).toBe(false) }) @@ -259,11 +259,11 @@ describe('Dropdown', () => { const content = wrapper.findComponent({ ref: 'a' }) const triggerElm = wrapper.find('.el-dropdown-link') await triggerElm.trigger(MOUSE_ENTER_EVENT) - await _sleep() + await sleep(TIMEOUT) await content.trigger('keydown', { keyCode: eventKeys.down, }) - await _sleep() + await sleep(TIMEOUT) expect(wrapper.findComponent({ ref: 'd' }).attributes('tabindex')).toBe('0') }) diff --git a/packages/scrollbar/__tests__/scrollbar.spec.ts b/packages/scrollbar/__tests__/scrollbar.spec.ts index 6d4ceab7b4..d065efdc2d 100644 --- a/packages/scrollbar/__tests__/scrollbar.spec.ts +++ b/packages/scrollbar/__tests__/scrollbar.spec.ts @@ -19,10 +19,11 @@ describe('ScrollBar', () => { `) - defineGetter(window.HTMLElement.prototype, 'clientHeight', outerHeight) - defineGetter(window.HTMLElement.prototype, 'scrollHeight', innerHeight) - const scrollDom = wrapper.find('.el-scrollbar__wrap').element + + defineGetter(scrollDom, 'clientHeight', outerHeight) + defineGetter(scrollDom, 'scrollHeight', innerHeight) + await makeScroll(scrollDom, 'scrollTop', 100) expect(wrapper.find('.is-vertical div').attributes('style')).toContain('height: 40%; transform: translateY(50%); webkit-transform: translateY(50%)') await makeScroll(scrollDom, 'scrollTop', 300) @@ -38,10 +39,11 @@ describe('ScrollBar', () => { `) - defineGetter(window.HTMLElement.prototype, 'clientWidth', outerWidth) - defineGetter(window.HTMLElement.prototype, 'scrollWidth', innerWidth) - const scrollDom = wrapper.find('.el-scrollbar__wrap').element + + defineGetter(scrollDom, 'clientWidth', outerWidth) + defineGetter(scrollDom, 'scrollWidth', innerWidth) + await makeScroll(scrollDom, 'scrollLeft', 100) expect(wrapper.find('.is-horizontal div').attributes('style')).toContain('width: 40%; transform: translateX(50%); webkit-transform: translateX(50%)') await makeScroll(scrollDom, 'scrollLeft', 300) diff --git a/packages/test-utils/define-getter.ts b/packages/test-utils/define-getter.ts index a17afac60d..72407d1a33 100644 --- a/packages/test-utils/define-getter.ts +++ b/packages/test-utils/define-getter.ts @@ -1,8 +1,38 @@ -import { isFunction } from 'lodash' +import { isFunction, isUndefined } from 'lodash' -const defineGetter = (obj: Record, prop: string, value: any) => { +/** + * + * @param obj Object on which to add or modify the property. + * @param prop The property name + * @param value The value of `obj[prop]` or a getter + * @returns A restore function which can reset `obj[prop]`'s value or getter + */ +const defineGetter = (obj: Record, prop: string, value: any, defaultValue?: any) => { + let oldValue = defaultValue + const { get, configurable } = Object.getOwnPropertyDescriptor(obj, prop) || {} + + if (isUndefined(defaultValue) && isUndefined(get)) { + try { + oldValue = obj[prop] + } catch { + throw Error(`TypeError: Illegal invocation. Cannot read ${prop} of \'${obj}\', \'${obj}\' might be a prototype, please specify default value instead.`) + } + } + + const oldGetter = get ?? (() => oldValue) const getter = isFunction(value) ? value : () => value - Object.defineProperty(obj, prop, { get: getter }) + + Object.defineProperty(obj, prop, { + configurable: true, + get: getter, + }) + + return () => { + Object.defineProperty(obj, prop, { + configurable, + get: oldGetter, + }) + } } export default defineGetter