From c391330d1170c90714a2e6f04ca5e395226c396b Mon Sep 17 00:00:00 2001 From: Alain Dumesny Date: Fri, 7 May 2021 08:42:33 -0700 Subject: [PATCH] Util getScrollParent() -> getScrollElement() * doc and rename to match actual functionality --- doc/CHANGES.md | 6 ++++++ spec/utils-spec.ts | 2 +- src/h5/dd-resizable.ts | 2 +- src/utils.ts | 12 ++++++------ 4 files changed, 14 insertions(+), 8 deletions(-) diff --git a/doc/CHANGES.md b/doc/CHANGES.md index 0bb004fba..57536aa9a 100644 --- a/doc/CHANGES.md +++ b/doc/CHANGES.md @@ -5,6 +5,7 @@ Change log **Table of Contents** *generated with [DocToc](http://doctoc.herokuapp.com/)* +- [4.2.2-dev](#422-dev) - [4.2.2 (2021-4-23)](#422-2021-4-23) - [4.2.1 (2021-4-18)](#421-2021-4-18) - [4.2.0 (2021-4-11)](#420-2021-4-11) @@ -55,6 +56,11 @@ Change log - [v0.1.0 (2014-11-18)](#v010-2014-11-18) +## 4.2.2-dev + +- `Utils.getScrollParent()` -> `getScrollElement()` rename +- fix [#1745](https://github.com/gridstack/gridstack.js/issues/1745) digression on scrolling in v4.2.1. Thanks [@Manfred-on-github](https://github.com/Manfred-on-github) for fixing your prev change. + ## 4.2.2 (2021-4-23) - fix [#1684](https://github.com/gridstack/gridstack.js/issues/1684) [#1550](https://github.com/gridstack/gridstack.js/issues/1550) mac Safari H5 draggable broken in 4.0.1. Thanks [@wurambo](https://github.com/wurambo) diff --git a/spec/utils-spec.ts b/spec/utils-spec.ts index 7826ca17e..5cd2687fc 100644 --- a/spec/utils-spec.ts +++ b/spec/utils-spec.ts @@ -123,7 +123,7 @@ describe('gridstack utils', function() { expect(el.style.position).toEqual(''); // bogus test - expect(Utils.getScrollParent(el)).not.toBe(null); + expect(Utils.getScrollElement(el)).not.toBe(null); // bogus test Utils.updateScrollPosition(el, {top: 20}, 10); }); diff --git a/src/h5/dd-resizable.ts b/src/h5/dd-resizable.ts index be80ae072..0f34e526e 100644 --- a/src/h5/dd-resizable.ts +++ b/src/h5/dd-resizable.ts @@ -154,7 +154,7 @@ export class DDResizable extends DDBaseImplement implements HTMLElementExtendOpt /** @internal */ private _resizeStart(event: MouseEvent): DDResizable { this.originalRect = this.el.getBoundingClientRect(); - this.scrollEl = Utils.getScrollParent(this.el); + this.scrollEl = Utils.getScrollElement(this.el); this.scrollY = this.scrollEl.scrollTop; this.startEvent = event; this._setupHelper(); diff --git a/src/utils.ts b/src/utils.ts index 7023dd58b..295c58ae6 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -291,16 +291,16 @@ export class Utils { } } - /** @internal */ - static getScrollParent(el: HTMLElement): HTMLElement { - if (el === null) return document.scrollingElement as HTMLElement; + /** @internal returns the passed element if scrollable, else the closest parent that will, up to the entire document scrolling element */ + static getScrollElement(el?: HTMLElement): HTMLElement { + if (!el) return document.scrollingElement as HTMLElement; const style = getComputedStyle(el); const overflowRegex = /(auto|scroll)/; if (overflowRegex.test(style.overflow + style.overflowY)) { return el; } else { - return this.getScrollParent(el.parentElement); + return this.getScrollElement(el.parentElement); } } @@ -317,7 +317,7 @@ export class Utils { // to get entire widget on screen let offsetDiffDown = rect.bottom - innerHeightOrClientHeight; let offsetDiffUp = rect.top; - let scrollEl = this.getScrollParent(el); + let scrollEl = this.getScrollElement(el); if (scrollEl !== null) { let prevScroll = scrollEl.scrollTop; if (rect.top < 0 && distance < 0) { @@ -349,7 +349,7 @@ export class Utils { * @param distance Distance from the V edges to start scrolling */ static updateScrollResize(event: MouseEvent, el: HTMLElement, distance: number): void { - const scrollEl = this.getScrollParent(el); + const scrollEl = this.getScrollElement(el); const height = scrollEl.clientHeight; const offsetTop = scrollEl.getBoundingClientRect().top; const pointerPosY = event.clientY - offsetTop;