DevTools: fix stick to bottom in console viewport

third_party/WebKit/Source/devtools/front_end/console/ConsoleView.js

Index: third_party/WebKit/Source/devtools/front_end/console/ConsoleView.js
diff --git a/third_party/WebKit/Source/devtools/front_end/console/ConsoleView.js b/third_party/WebKit/Source/devtools/front_end/console/ConsoleView.js
index f41672c9b35a9187a1f414a30b8484b5c94d47c0..fecd7cf43ce5380d3b1e7d5747dc3a019f8d8145 100644
--- a/third_party/WebKit/Source/devtools/front_end/console/ConsoleView.js
+++ b/third_party/WebKit/Source/devtools/front_end/console/ConsoleView.js
@@ -154,6 +154,12 @@ WebInspector.ConsoleView = function()
     this._initConsoleMessages();
 
     WebInspector.context.addFlavorChangeListener(WebInspector.ExecutionContext, this._executionContextChanged, this);
+
+    this._messagesElement.addEventListener("mousedown", this._updateStickToBottomOnMouseDown.bind(this), false);
+    this._messagesElement.addEventListener("mousewheel", this._updateStickToBottomOnMouseWheel.bind(this), false);
+    this._messagesElement.addEventListener("mouseup", this._updateStickToBottomOnMouseUp.bind(this), false);
+    this._messagesElement.addEventListener("mouseleave", this._updateStickToBottomOnMouseUp.bind(this), false);
+    this._messagesElement.addEventListener("keydown", this._updateStickToBottomOnKeyDown.bind(this), true);
 }
 
 WebInspector.ConsoleView.persistedHistorySize = 300;
@@ -353,7 +359,7 @@ WebInspector.ConsoleView.prototype = {
 
     restoreScrollPositions: function()
     {
-        if (this._viewport.scrolledToBottom())
+        if (this._viewport.stickToBottom())
             this._immediatelyScrollToBottom();
         else
             WebInspector.Widget.prototype.restoreScrollPositions.call(this);
@@ -363,7 +369,7 @@ WebInspector.ConsoleView.prototype = {
     {
         this._scheduleViewportRefresh();
         this._hidePromptSuggestBox();
-        if (this._viewport.scrolledToBottom())
+        if (this._viewport.stickToBottom())
             this._immediatelyScrollToBottom();
         for (var i = 0; i < this._visibleViewMessages.length; ++i)
             this._visibleViewMessages[i].onResize();
@@ -383,6 +389,8 @@ WebInspector.ConsoleView.prototype = {
          */
         function invalidateViewport()
         {
+            if (this._muteViewportUpdates)
+                return Promise.resolve();
             if (this._needsFullUpdate) {
                 this._updateMessageList();
                 delete this._needsFullUpdate;
@@ -391,12 +399,15 @@ WebInspector.ConsoleView.prototype = {
             }
             return Promise.resolve();
         }
+        if (this._muteViewportUpdates)
+            return;
         this._viewportThrottler.schedule(invalidateViewport.bind(this));
     },
 
     _immediatelyScrollToBottom: function()
     {
         // This will scroll viewport and trigger its refresh.
+        this._viewport.setStickToBottom(true);
         this._promptElement.scrollIntoView(true);
     },
 
@@ -1003,6 +1014,68 @@ WebInspector.ConsoleView.prototype = {
         highlightNode.scrollIntoViewIfNeeded();
     },
 
+    _updateStickToBottomOnMouseDown: function()
+    {
+        this._muteViewportUpdates = true;
+        this._viewport.setStickToBottom(false);
+        this._wasScrolledToBottom = this._messagesElement.isScrolledToBottom();
+    },
+
+    _updateStickToBottomOnMouseUp: function()
+    {

[lushnikov, 2016/08/02 00:10:48]

if (!this._muteViewportUpdates)
    return;

So that we don't run anything for innocent mouseleave events.

[luoe, 2016/08/02 19:17:15]

Done.

+        this._muteViewportUpdates = false;
+        if (this._wasScrolledToBottom) {

[lushnikov, 2016/08/02 00:10:48]

instead of having this logic, can we have a passive scroll listener which
updates the stickToBottom?
This will eliminate the timeout

[luoe, 2016/08/02 19:17:15]

I think it's still necessary to wait.

Even when the listener is passive and scroll events aren't blocked, in a fast
scrollbar click, the order of events is still mousedown > mouseup > scroll. 
When the mouseup fires updateViewportState() before any scroll events, it will
make us stick to the bottom when the user wants to un-stick.

+            // When stuck to the bottom, clicking the gray area above the scroll
+            // thumb should scroll upwards and stop sticking. Smooth scroll
+            // events triggered by the click need to finish before querying
+            // isScrolledToBottom. The timeout value used is the longest smooth
+            // scroll duration, a value retrieved from crbug.com/575409.
+            setTimeout(updateViewportState.bind(this, true), 200);
+        } else {
+            // In another case, when users drag the scroll thumb to the bottom,
+            // the viewport should stick. Checking whether the mouse is released
+            // at the bottom of the viewport is not verifiable after an async
+            // timeout, so we do it immediately.
+            updateViewportState.call(this);
+        }
+        delete this._wasScrolledToBottom;
+
+        /**
+         * @this {!WebInspector.ConsoleView}
+         * @param {boolean=} fromTimeout
+         */
+        function updateViewportState(fromTimeout)
+        {
+            this._viewport.setStickToBottom(this._messagesElement.isScrolledToBottom());
+            this._scheduleViewportRefresh();
+            if (fromTimeout)

[lushnikov, 2016/08/02 00:10:48]

can we call this unconditionally?

[luoe, 2016/08/02 19:17:15]

Done.

+                this._updateViewportFromTimeoutForTest();
+        }
+    },
+
+    _updateViewportFromTimeoutForTest: function()
+    {
+        // This method is sniffed in tests.
+    },
+
+    _updateStickToBottomOnMouseWheel: function()
+    {
+        this._updateStickToBottomOnMouseDown();
+        this._updateStickToBottomOnMouseUp();
+    },
+
+    _updateStickToBottomOnKeyDown: function(event)
+    {
+        var isPageUpDown = event.keyCode === WebInspector.KeyboardShortcut.Keys.PageDown.code || event.keyCode === WebInspector.KeyboardShortcut.Keys.PageUp.code;
+        var isEsc = event.keyCode === WebInspector.KeyboardShortcut.Keys.Esc.code;
+        if (isEsc)

[lushnikov, 2016/08/02 00:10:48]

let's bail out in the very beginning of the function

[luoe, 2016/08/02 19:17:15]

Done.

+            return;
+        if (isPageUpDown)
+            this._updateStickToBottomOnMouseWheel();
+        else
+            this._viewport.setStickToBottom(true);
+    },
+
     __proto__: WebInspector.VBox.prototype
 }