DevTools: Add popover for snapshot canvas log.

Source/devtools/front_end/layers/PaintProfilerView.js

 /*
  * Copyright (C) 2013 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 187 matching lines @@
  * @constructor
  * @extends {WebInspector.VBox}
  */
 WebInspector.PaintProfilerCommandLogView = function()
 {
     WebInspector.VBox.call(this);
     this.setMinimumSize(100, 25);
     this.element.classList.add("outline-disclosure");
     var sidebarTreeElement = this.element.createChild("ol", "sidebar-tree");
     this.sidebarTree = new TreeOutline(sidebarTreeElement);
+    this._popoverHelper = new WebInspector.ObjectPopoverHelper(this.element, this._getHoverAnchor.bind(this), this._resolveObjectForPopover.bind(this), undefined, true);
 
     this._log = [];
 }
 
 WebInspector.PaintProfilerCommandLogView.prototype = {
     setLog: function(log)
     {
         this._log = log;
     },
 
     /**
      * @param {number=} stepLeft
      * @param {number=} stepRight
      */
     updateLog: function(stepLeft, stepRight)
     {
         var log = this._log;
         stepLeft = stepLeft || 0;
         stepRight = stepRight || log.length - 1;
         this.sidebarTree.removeChildren();
         for (var i = stepLeft; i <= stepRight; ++i) {
             var node = new WebInspector.LogTreeElement(log[i]);
             this.sidebarTree.appendChild(node);
         }
     },
 
+    /**
+     * @param {!Element} target
+     * @return {!Element}
+     */
+    _getHoverAnchor: function(target)
+    {
+        return target.enclosingNodeOrSelfWithNodeName("span");
+    },
+
+    /**
+     * @param {!Element} element
+     * @param {function(!WebInspector.RemoteObject, boolean, !Element=):undefined} showCallback
+     */
+    _resolveObjectForPopover: function(element, showCallback)
+    {
+        var liElement = element.enclosingNodeOrSelfWithNodeName("li");
+        var logItem = liElement.treeElement.representedObject;
+        var obj = {"method": logItem.method};
+        if (logItem.params)
+            obj.params = logItem.params;
+        showCallback(WebInspector.RemoteObject.fromLocalObject(obj), false);
+    },
+
     __proto__: WebInspector.VBox.prototype
 };
 
 /**
   * @constructor
   * @param {!Object} logItem
   * @extends {TreeElement}
   */
 WebInspector.LogTreeElement = function(logItem)
 {
@@ skipping 36 matching lines @@
             str += this._paramToString(params[key], key);
         }
         return str;
     },
 
     _update: function()
     {
         var logItem = this.representedObject;
         var title = document.createDocumentFragment();
         title.createChild("div", "selection");
+        var span = title.createChild("span");

[caseq, 2014/06/11 16:48:36]

This change is probably redundant now.

[malch, 2014/06/11 16:50:44]

We need this to properly show the popover.
On 2014/06/11 16:48:36, caseq wrote:

         var textContent = logItem.method;
         if (logItem.params)
             textContent += "(" + this._paramsToString(logItem.params) + ")";
-        title.appendChild(document.createTextNode(textContent));
+        span.textContent = textContent;
         this.title = title;
     },
 
     /**
      * @param {boolean} hovered
      */
     setHovered: function(hovered)
     {
         this.listItemElement.classList.toggle("hovered", hovered);
     },
 
     __proto__: TreeElement.prototype
 };