viz: Hit-test debug visualization linked to devtools.

Example: https://screenshot.googleplex.com/tHOgDdVn6aj

R=riajiang@chromium.org

Bug: 895600
Cq-Include-Trybots: luci.chromium.try:android_optional_gpu_tests_rel;master.tryserver.blink:linux_trusty_blink_rel
Change-Id: I41affc1da88425ae8284bc0eef7d54aeefa124c9
Reviewed-on: https://chromium-review.googlesource.com/c/1289072
Commit-Queue: Alexander Shah <zandershah@google.com>
Reviewed-by: Sadrul Chowdhury <sadrul@chromium.org>
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Reviewed-by: Ria Jiang <riajiang@chromium.org>
Cr-Commit-Position: refs/heads/master@{#607448}

content/renderer/gpu/layer_tree_view.cc

@@ -562,6 +562,12 @@ void LayerTreeView::SetShowScrollBottleneckRects(bool show) {
   layer_tree_host_->SetDebugState(debug_state);
 }
 
+void LayerTreeView::SetShowHitTestBorders(bool show) {
+  cc::LayerTreeDebugState debug_state = layer_tree_host_->GetDebugState();
+  debug_state.show_hit_test_borders = show;
+  layer_tree_host_->SetDebugState(debug_state);
+}
+
 void LayerTreeView::UpdateBrowserControlsState(
     cc::BrowserControlsState constraints,
     cc::BrowserControlsState current,

content/renderer/gpu/layer_tree_view.h

@@ -168,6 +168,7 @@ class CONTENT_EXPORT LayerTreeView
   void SetShowPaintRects(bool show) override;
   void SetShowDebugBorders(bool show) override;
   void SetShowScrollBottleneckRects(bool show) override;
+  void SetShowHitTestBorders(bool show) override;
   void NotifySwapTime(ReportTimeCallback callback) override;
 
   void UpdateBrowserControlsState(cc::BrowserControlsState constraints,

third_party/blink/public/platform/web_layer_tree_view.h

@@ -212,6 +212,9 @@ class WebLayerTreeView {
   // Toggles scroll bottleneck rects on the HUD layer
   virtual void SetShowScrollBottleneckRects(bool) {}
 
+  // Toggles the hit-test borders on layers
+  virtual void SetShowHitTestBorders(bool) {}
+
   // ReportTimeCallback is a callback that should be fired when the
   // corresponding Swap completes (either with DidSwap or DidNotSwap).
   virtual void NotifySwapTime(ReportTimeCallback callback) {}

third_party/blink/renderer/core/exported/web_view_impl.cc

@@ -728,6 +728,11 @@ void WebViewImpl::SetShowScrollBottleneckRects(bool show) {
     layer_tree_view_->SetShowScrollBottleneckRects(show);
 }
 
+void WebViewImpl::SetShowHitTestBorders(bool show) {
+  if (layer_tree_view_)
+    layer_tree_view_->SetShowHitTestBorders(show);
+}
+
 void WebViewImpl::AcceptLanguagesChanged() {
   if (client_)
     FontCache::AcceptLanguagesChanged(client_->AcceptLanguages());

third_party/blink/renderer/core/exported/web_view_impl.h

@@ -230,6 +230,7 @@ class CORE_EXPORT WebViewImpl final : public WebView,
   void SetShowDebugBorders(bool);
   void SetShowFPSCounter(bool) override;
   void SetShowScrollBottleneckRects(bool) override;
+  void SetShowHitTestBorders(bool);
   void AcceptLanguagesChanged() override;
   void SetPageFrozen(bool frozen) override;
   WebWidget* MainFrameWidget() override;

third_party/blink/renderer/core/inspector/browser_protocol.pdl

@@ -4651,6 +4651,12 @@ experimental domain Overlay
       # True for showing scroll bottleneck rects
       boolean show
 
+  # Requests that backend shows hit-test borders on layers
+  command setShowHitTestBorders
+    parameters
+      # True for showing hit-test borders
+      boolean show
+
   # Paints viewport size upon main frame resize.
   command setShowViewportSizeOnResize
     parameters

third_party/blink/renderer/core/inspector/inspector_overlay_agent.cc

@@ -229,6 +229,7 @@ InspectorOverlayAgent::InspectorOverlayAgent(
       show_fps_counter_(&agent_state_, /*default_value=*/false),
       show_paint_rects_(&agent_state_, /*default_value=*/false),
       show_scroll_bottleneck_rects_(&agent_state_, /*default_value=*/false),
+      show_hit_test_borders_(&agent_state_, /*default_value=*/false),
       show_size_on_resize_(&agent_state_, /*default_value=*/false),
       paused_in_debugger_message_(&agent_state_, /*default_value=*/String()) {}
 
@@ -254,6 +255,7 @@ void InspectorOverlayAgent::Restore() {
   setShowFPSCounter(show_fps_counter_.Get());
   setShowPaintRects(show_paint_rects_.Get());
   setShowScrollBottleneckRects(show_scroll_bottleneck_rects_.Get());
+  setShowHitTestBorders(show_hit_test_borders_.Get());
   setShowViewportSizeOnResize(show_size_on_resize_.Get());
   if (paused_in_debugger_message_.Get().IsNull())
     setPausedInDebuggerMessage(paused_in_debugger_message_.Get());
@@ -284,6 +286,7 @@ Response InspectorOverlayAgent::disable() {
   setShowFPSCounter(false);
   setShowPaintRects(false);
   setShowScrollBottleneckRects(false);
+  setShowHitTestBorders(false);
   setShowViewportSizeOnResize(false);
   setPausedInDebuggerMessage(String());
   setSuspended(false);
@@ -338,6 +341,17 @@ Response InspectorOverlayAgent::setShowScrollBottleneckRects(bool show) {
   return Response::OK();
 }
 
+Response InspectorOverlayAgent::setShowHitTestBorders(bool show) {
+  show_hit_test_borders_.Set(show);
+  if (show) {
+    Response response = CompositingEnabled();
+    if (!response.isSuccess())
+      return response;
+  }
+  frame_impl_->ViewImpl()->SetShowHitTestBorders(show);
+  return Response::OK();
+}
+
 Response InspectorOverlayAgent::setShowViewportSizeOnResize(bool show) {
   show_size_on_resize_.Set(show);
   return Response::OK();

third_party/blink/renderer/core/inspector/inspector_overlay_agent.h

@@ -82,6 +82,7 @@ class CORE_EXPORT InspectorOverlayAgent final
   protocol::Response setShowDebugBorders(bool) override;
   protocol::Response setShowFPSCounter(bool) override;
   protocol::Response setShowScrollBottleneckRects(bool) override;
+  protocol::Response setShowHitTestBorders(bool) override;
   protocol::Response setShowViewportSizeOnResize(bool) override;
   protocol::Response setPausedInDebuggerMessage(
       protocol::Maybe<String>) override;
@@ -224,6 +225,7 @@ class CORE_EXPORT InspectorOverlayAgent final
   InspectorAgentState::Boolean show_fps_counter_;
   InspectorAgentState::Boolean show_paint_rects_;
   InspectorAgentState::Boolean show_scroll_bottleneck_rects_;
+  InspectorAgentState::Boolean show_hit_test_borders_;
   InspectorAgentState::Boolean show_size_on_resize_;
   InspectorAgentState::String paused_in_debugger_message_;
   DISALLOW_COPY_AND_ASSIGN(InspectorOverlayAgent);

third_party/blink/renderer/devtools/front_end/inspector_main/RenderingOptions.js

@@ -49,6 +49,9 @@ InspectorMain.RenderingOptionsView = class extends UI.VBox {
         Common.UIString(
             'Highlights elements (teal) that can slow down scrolling, including touch & wheel event handlers and other main-thread scrolling situations.'),
         Common.moduleSetting('showScrollBottleneckRects'));
+    this._appendCheckbox(
+        Common.UIString('Hit-test borders'), Common.UIString('Shows borders around hit-test regions'),
+        Common.moduleSetting('showHitTestBorders'));
     this.contentElement.createChild('div').classList.add('panel-section-separator');
 
     const mediaSetting = Common.moduleSetting('emulatedCSSMedia');

third_party/blink/renderer/devtools/front_end/sdk/OverlayModel.js

@@ -58,6 +58,13 @@ SDK.OverlayModel = class extends SDK.SDKModel {
         () => this._overlayAgent.setShowScrollBottleneckRects(this._showScrollBottleneckRectsSetting.get()));
     if (this._showScrollBottleneckRectsSetting.get())
       this._overlayAgent.setShowScrollBottleneckRects(true);
+
+    this._showHitTestBordersSetting = Common.moduleSetting('showHitTestBorders');
+    this._showHitTestBordersSetting.addChangeListener(
+        () => this._overlayAgent.setShowHitTestBorders(this._showHitTestBordersSetting.get()));
+    if (this._showHitTestBordersSetting.get())
+      this._overlayAgent.setShowHitTestBorders(true);
+
     if (target.suspended())
       this._overlayAgent.setSuspended(true);
   }

third_party/blink/renderer/devtools/front_end/sdk/module.json

@@ -186,6 +186,24 @@
             ],
             "defaultValue": false
         },
+        {
+            "type": "setting",
+            "category": "Rendering",
+            "settingName": "showHitTestBorders",
+            "settingType": "boolean",
+            "storageType": "session",
+            "options": [
+                {
+                    "value": true,
+                    "title": "Show hit-test borders"
+                },
+                {
+                    "value": false,
+                    "title": "Hide hit-test borders"
+                }
+            ],
+            "defaultValue": false
+        },
         {
             "type": "setting",
             "category": "Rendering",