Attachment 348116 Details for Bug 188960 – Patch

[patch] Patch

bug-188960-20180826204326.patch (text/plain), 4.23 KB, created by Devin Rousso on 2018-08-26 20:43:27 PDT

(hide)

Description:

Filename:

MIME Type:

Creator: Devin Rousso

Created: 2018-08-26 20:43:27 PDT

Size: 4.23 KB

patch

obsolete

>diff --git a/Source/WebInspectorUI/ChangeLog b/Source/WebInspectorUI/ChangeLog
>index 434d03e3d059b79b866563566c9d695c244a7a2d..1f429cac97e7d48421cd63eedaecced4a1cb9cb4 100644
>--- a/Source/WebInspectorUI/ChangeLog
>+++ b/Source/WebInspectorUI/ChangeLog
>@@ -1,3 +1,16 @@
>+2018-08-26  Devin Rousso  <drousso@apple.com>
>+
>+        Web Inspector: when scrolling a virtualized TreeOutline, only update the DOM periodically
>+        https://bugs.webkit.org/show_bug.cgi?id=188960
>+
>+        Reviewed by NOBODY (OOPS!).
>+
>+        * UserInterface/Views/TreeOutline.js:
>+        (WI.TreeOutline):
>+        (WI.TreeOutline.prototype.registerScrollVirtualizer):
>+        (WI.TreeOutline.prototype.updateVirtualizedElements):
>+        (WI.TreeOutline.prototype._calculateVirtualizedValues): Added.
>+
> 2018-08-23  Devin Rousso  <drousso@apple.com>
> 
>         Web Inspector: Color picker: can't enter decimal numbers for opacity
>diff --git a/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js b/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js
>index cad8ad885f9d07483f277bf5d7e6d3a7e4585710..349c7202bb791e2520a9bcbf420a399c31d88109 100644
>--- a/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js
>+++ b/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js
>@@ -55,6 +55,7 @@ WI.TreeOutline = class TreeOutline extends WI.Object
>         this._customIndent = false;
>         this._selectable = selectable;
> 
>+        this._vritualizedPreviousFirstItem = NaN;
>         this._virtualizedScrollContainer = null;
>         this._virtualizedTreeItemHeight = NaN;
>         this._virtualizedTopSpacer = null;
>@@ -659,7 +660,10 @@ WI.TreeOutline = class TreeOutline extends WI.Object
>         this._virtualizedBottomSpacer = document.createElement("div");
> 
>         this._virtualizedScrollContainer.addEventListener("scroll", (event) => {
>-            this.updateVirtualizedElements();
>+            let {extraRows, firstItem} = this._calculateVirtualizedValues();
>+
>+            if (Math.abs(firstItem - this._vritualizedPreviousFirstItem) >= extraRows)
>+                this.updateVirtualizedElements();
>         });
>     }
> 
>@@ -693,10 +697,7 @@ WI.TreeOutline = class TreeOutline extends WI.Object
>             return {count, shouldReturn};
>         }
> 
>-        let numberVisible = Math.ceil(this._virtualizedScrollContainer.offsetHeight / this._virtualizedTreeItemHeight);
>-        let extraRows = Math.max(numberVisible * 5, 50);
>-        let firstItem = Math.floor(this._virtualizedScrollContainer.scrollTop / this._virtualizedTreeItemHeight) - extraRows;
>-        let lastItem = firstItem + numberVisible + (extraRows * 2);
>+        let {numberVisible, extraRows, firstItem, lastItem} = this._calculateVirtualizedValues();
> 
>         let shouldScroll = false;
>         if (focusedTreeElement && focusedTreeElement.revealed(false)) {
>@@ -709,7 +710,7 @@ WI.TreeOutline = class TreeOutline extends WI.Object
>                 lastItem = index + extraRows;
>             }
> 
>-            shouldScroll = index < firstItem || index > lastItem;
>+            shouldScroll = (index < firstItem + extraRows) || (index > lastItem - extraRows);
>         }
> 
>         let totalItems = walk(this, ({parent, treeElement, count}) => {
>@@ -731,6 +732,8 @@ WI.TreeOutline = class TreeOutline extends WI.Object
> 
>         if (shouldScroll)
>             this._virtualizedScrollContainer.scrollTop = (firstItem + extraRows) * this._virtualizedTreeItemHeight;
>+
>+        this._vritualizedPreviousFirstItem = firstItem;
>     }
> 
>     // Protected
>@@ -808,6 +811,20 @@ WI.TreeOutline = class TreeOutline extends WI.Object
>         document.head.appendChild(WI.TreeOutline._styleElement);
>     }
> 
>+    _calculateVirtualizedValues()
>+    {
>+        let numberVisible = Math.ceil(this._virtualizedScrollContainer.offsetHeight / this._virtualizedTreeItemHeight);
>+        let extraRows = Math.max(numberVisible * 5, 50);
>+        let firstItem = Math.floor(this._virtualizedScrollContainer.scrollTop / this._virtualizedTreeItemHeight) - extraRows;
>+        let lastItem = firstItem + numberVisible + (extraRows * 2);
>+        return {
>+            numberVisible,
>+            extraRows,
>+            firstItem,
>+            lastItem,
>+        };
>+    }
>+
>     _handleContextmenu(event)
>     {
>         let treeElement = this.treeElementFromEvent(event);

Actions: View | Formatted Diff | Diff

Attachments on bug 188960: 348116 | 348193