DevTools: teach DOM.getBoxModel to work with SVG nodes

SVG nodes require special handling to compute quads.

BUG=800636
R=dgozman

Change-Id: Ie9014ea54bdbae4685ce3ea7aef725c786079ae8
Reviewed-on: https://chromium-review.googlesource.com/1114342Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Commit-Queue: Andrey Lushnikov <lushnikov@chromium.org>
Cr-Commit-Position: refs/heads/master@{#570566}

third_party/WebKit/LayoutTests/inspector-protocol/dom/dom-getBoxModel-expected.txt

@@ -39,4 +39,14 @@ DIV style,width:100px;height:100px;background:orange [
     [6] : 210
     [7] : 310
 ]
+rect id,theRect,x,30,y,50,width,100,height,100 [
+    [0] : 432
+    [1] : 452
+    [2] : 532
+    [3] : 452
+    [4] : 532
+    [5] : 552
+    [6] : 432
+    [7] : 552
+]
 

third_party/WebKit/LayoutTests/inspector-protocol/dom/dom-getBoxModel.js

@@ -9,23 +9,32 @@
     <div style='position:absolute;top:150;left:50;width:100;height:100;background:blue;transform:rotate(45deg);'></div>
   `, 'Tests DOM.getBoxModel method.');
 
-  await session.evaluate(`
+  await session.evaluate(() => {
     var iframe = document.createElement('iframe');
     iframe.style.position = 'absolute';
     iframe.style.top = '200px';
     iframe.style.left = '200px';
+    iframe.style.width = '500px';
+    iframe.style.height = '500px';
     document.body.appendChild(iframe);
-    iframe.contentWindow.document.body.innerHTML = '<div style="width:100px;height:100px;background:orange"></div>';`);
+    iframe.contentWindow.document.body.innerHTML = `
+      <div style="width:100px;height:100px;background:orange"></div>
+      <svg xmlns="http://www.w3.org/2000/svg" width="500" height="500" style="position:absolute;top:200px;left:200px;">
+        <rect id="theRect" x="30" y="50" width="100" height="100"></rect>
+      </svg>
+    `;
+  });
 
   var NodeTracker = await testRunner.loadScript('../resources/node-tracker.js');
   var nodeTracker = new NodeTracker(dp);
   dp.DOM.enable();
   await dp.DOM.getNodeForLocation({x: 100, y: 200});
   await dp.DOM.getNodeForLocation({x: 250, y: 250});
+  await dp.DOM.getNodeForLocation({x: 500, y: 500});
 
   for (var nodeId of nodeTracker.nodeIds()) {
     var node = nodeTracker.nodeForId(nodeId);
-    if (node.nodeName !== 'DIV')
+    if (node.nodeName !== 'DIV' && node.nodeName !== 'rect')
       continue;
 
     await dp.Emulation.clearDeviceMetricsOverride();

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

@@ -388,17 +388,10 @@ void InspectorHighlight::AppendNodeHighlight(
   if (!layout_object)
     return;
 
-  // LayoutSVGRoot should be highlighted through the isBox() code path, all
-  // other SVG elements should just dump their absoluteQuads().
-  if (layout_object->GetNode() && layout_object->GetNode()->IsSVGElement() &&
-      !layout_object->IsSVGRoot()) {
-    Vector<FloatQuad> quads;
-    layout_object->AbsoluteQuads(quads);
-    LocalFrameView* containing_view = layout_object->GetFrameView();
-    for (size_t i = 0; i < quads.size(); ++i) {
-      if (containing_view)
-        FrameQuadToViewport(containing_view, quads[i]);
-      AppendQuad(quads[i], highlight_config.content,
+  Vector<FloatQuad> svg_quads;
+  if (BuildSVGQuads(node, svg_quads)) {
+    for (size_t i = 0; i < svg_quads.size(); ++i) {
+      AppendQuad(svg_quads[i], highlight_config.content,
                  highlight_config.content_outline);
     }
     return;
@@ -457,8 +450,17 @@ bool InspectorHighlight::GetBoxModel(
     return false;
 
   FloatQuad content, padding, border, margin;
-  if (!BuildNodeQuads(node, &content, &padding, &border, &margin))
+  Vector<FloatQuad> svg_quads;
+  if (BuildSVGQuads(node, svg_quads)) {
+    if (!svg_quads.size())
+      return false;
+    content = svg_quads[0];
+    padding = svg_quads[0];
+    border = svg_quads[0];
+    margin = svg_quads[0];
+  } else if (!BuildNodeQuads(node, &content, &padding, &border, &margin)) {
     return false;
+  }
 
   AdjustForAbsoluteZoom::AdjustFloatQuad(content, *layout_object);
   AdjustForAbsoluteZoom::AdjustFloatQuad(padding, *layout_object);
@@ -521,6 +523,24 @@ bool InspectorHighlight::GetBoxModel(
   return true;
 }
 
+// static
+bool InspectorHighlight::BuildSVGQuads(Node* node, Vector<FloatQuad>& quads) {
+  LayoutObject* layout_object = node->GetLayoutObject();
+  if (!layout_object)
+    return false;
+  if (!layout_object->GetNode() || !layout_object->GetNode()->IsSVGElement() ||
+      layout_object->IsSVGRoot())
+    return false;
+  layout_object->AbsoluteQuads(quads);
+  LocalFrameView* containing_view = layout_object->GetFrameView();
+  if (containing_view) {
+    for (size_t i = 0; i < quads.size(); ++i)
+      FrameQuadToViewport(containing_view, quads[i]);
+  }
+  return true;
+}
+
+// static
 bool InspectorHighlight::BuildNodeQuads(Node* node,
                                         FloatQuad* content,
                                         FloatQuad* padding,

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

@@ -52,11 +52,6 @@ class CORE_EXPORT InspectorHighlight {
 
   static bool GetBoxModel(Node*, std::unique_ptr<protocol::DOM::BoxModel>*);
   static InspectorHighlightConfig DefaultConfig();
-  static bool BuildNodeQuads(Node*,
-                             FloatQuad* content,
-                             FloatQuad* padding,
-                             FloatQuad* border,
-                             FloatQuad* margin);
 
   void AppendPath(std::unique_ptr<protocol::ListValue> path,
                   const Color& fill_color,
@@ -71,6 +66,12 @@ class CORE_EXPORT InspectorHighlight {
   std::unique_ptr<protocol::DictionaryValue> AsProtocolValue() const;
 
  private:
+  static bool BuildSVGQuads(Node*, Vector<FloatQuad>& quads);
+  static bool BuildNodeQuads(Node*,
+                             FloatQuad* content,
+                             FloatQuad* padding,
+                             FloatQuad* border,
+                             FloatQuad* margin);
   void AppendNodeHighlight(Node*, const InspectorHighlightConfig&);
   void AppendPathsForShapeOutside(Node*, const InspectorHighlightConfig&);