Changeset 143000 in webkit

Timestamp:

Feb 15, 2013 7:56:51 AM (11 years ago)

Author:

aandrey@chromium.org

Message:

Web Inspector: [Canvas] show replay log grouped by draw calls
​https://bugs.webkit.org/show_bug.cgi?id=109592

Reviewed by Pavel Feldman.

Source/WebCore:

Show canvas capturing log grouped by drawing calls.
Drive-by: extended Array.prototype with a handy peekLast function.
Drive-by: removed code dups in few places.

• inspector/front-end/CanvasProfileView.js:

(WebInspector.CanvasProfileView):
(WebInspector.CanvasProfileView.prototype.dispose):
(WebInspector.CanvasProfileView.prototype._onReplayStepClick):
(WebInspector.CanvasProfileView.prototype._onReplayDrawingCallClick):
(WebInspector.CanvasProfileView.prototype._onReplayLastStepClick):
(WebInspector.CanvasProfileView.prototype._replayTraceLog.didReplayTraceLog):
(WebInspector.CanvasProfileView.prototype._replayTraceLog):
(WebInspector.CanvasProfileView.prototype._didReceiveTraceLog):
(WebInspector.CanvasProfileView.prototype._selectedCallIndex):
(WebInspector.CanvasProfileView.prototype._selectedDrawCallGroupIndex):
(WebInspector.CanvasProfileView.prototype._appendCallNode):

• inspector/front-end/DataGrid.js:

(WebInspector.DataGrid.prototype.setColumnVisible):
(WebInspector.DataGridNode.prototype.set hasChildren):
(WebInspector.DataGridNode.prototype.set revealed):
(WebInspector.DataGridNode.prototype.get leftPadding):

• inspector/front-end/externs.js:

(Array.prototype.peekLast):

• inspector/front-end/utilities.js:

LayoutTests:

A test to dump canvas replay log.

• inspector/profiler/canvas2d/canvas-replay-log-grid-expected.txt: Added.
• inspector/profiler/canvas2d/canvas-replay-log-grid.html: Added.

Location:

trunk

Files:

• LayoutTests/ChangeLog (modified) (1 diff)
• LayoutTests/inspector/profiler/canvas2d/canvas-replay-log-grid-expected.txt (added)
• LayoutTests/inspector/profiler/canvas2d/canvas-replay-log-grid.html (added)
• LayoutTests/platform/efl/TestExpectations (modified) (1 diff)
• LayoutTests/platform/gtk/TestExpectations (modified) (1 diff)
• LayoutTests/platform/mac/TestExpectations (modified) (1 diff)
• LayoutTests/platform/qt/TestExpectations (modified) (1 diff)
• LayoutTests/platform/win/TestExpectations (modified) (1 diff)
• LayoutTests/platform/wincairo/TestExpectations (modified) (1 diff)
• Source/WebCore/ChangeLog (modified) (1 diff)
• Source/WebCore/inspector/front-end/CanvasProfileView.js (modified) (12 diffs)
• Source/WebCore/inspector/front-end/DataGrid.js (modified) (5 diffs)
• Source/WebCore/inspector/front-end/externs.js (modified) (1 diff)
• Source/WebCore/inspector/front-end/utilities.js (modified) (1 diff)

trunk/LayoutTests/ChangeLog

@@ +1 @@
+2013-02-15  Andrey Adaikin  <aandrey@chromium.org>
+
+        Web Inspector: [Canvas] show replay log grouped by draw calls
+        https://bugs.webkit.org/show_bug.cgi?id=109592
+
+        Reviewed by Pavel Feldman.
+
+        A test to dump canvas replay log.
+
+        * inspector/profiler/canvas2d/canvas-replay-log-grid-expected.txt: Added.
+        * inspector/profiler/canvas2d/canvas-replay-log-grid.html: Added.
+
 2013-02-15  Vsevolod Vlasov  <vsevik@chromium.org>
 

trunk/LayoutTests/platform/efl/TestExpectations

@@ -1609 +1609 @@
 webkit.org/b/73936 inspector/profiler/canvas2d/canvas-has-uninstrumented-canvases.html
 webkit.org/b/73936 inspector/profiler/canvas2d/canvas-stack-trace.html
+webkit.org/b/73936 inspector/profiler/canvas2d/canvas-replay-log-grid.html
 
 # EFL port does not support Emacs commands.

trunk/LayoutTests/platform/gtk/TestExpectations

@@ -1040 +1040 @@
 webkit.org/b/73936 inspector/profiler/canvas2d/canvas-has-uninstrumented-canvases.html [ Failure ]
 webkit.org/b/73936 inspector/profiler/canvas2d/canvas-stack-trace.html [ Failure ]
+webkit.org/b/73936 inspector/profiler/canvas2d/canvas-replay-log-grid.html [ Failure ]
 
 webkit.org/b/37613 webkit.org/b/20011 printing [ Skip ]

trunk/LayoutTests/platform/mac/TestExpectations

@@ -289 +289 @@
 webkit.org/b/73936 inspector/profiler/canvas2d/canvas-has-uninstrumented-canvases.html
 webkit.org/b/73936 inspector/profiler/canvas2d/canvas-stack-trace.html
+webkit.org/b/73936 inspector/profiler/canvas2d/canvas-replay-log-grid.html
 
 # Skipping newly added tests while I'm finding out what is wrong.

trunk/LayoutTests/platform/qt/TestExpectations

@@ -2507 +2507 @@
 webkit.org/b/73936 inspector/profiler/canvas2d/canvas-has-uninstrumented-canvases.html
 webkit.org/b/73936 inspector/profiler/canvas2d/canvas-stack-trace.html
+webkit.org/b/73936 inspector/profiler/canvas2d/canvas-replay-log-grid.html
 
 # [Qt] Unidentified pixel failures

trunk/LayoutTests/platform/win/TestExpectations

@@ -1314 +1314 @@
 webkit.org/b/73936 inspector/profiler/canvas2d/canvas-has-uninstrumented-canvases.html
 webkit.org/b/73936 inspector/profiler/canvas2d/canvas-stack-trace.html
+webkit.org/b/73936 inspector/profiler/canvas2d/canvas-replay-log-grid.html
 
 # https://bugs.webkit.org/show_bug.cgi?id=40300

trunk/LayoutTests/platform/wincairo/TestExpectations

@@ -1832 +1832 @@
 webkit.org/b/73936 inspector/profiler/canvas2d/canvas-has-uninstrumented-canvases.html
 webkit.org/b/73936 inspector/profiler/canvas2d/canvas-stack-trace.html
+webkit.org/b/73936 inspector/profiler/canvas2d/canvas-replay-log-grid.html
 
 # https://bugs.webkit.org/show_bug.cgi?id=40300

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2013-02-15  Andrey Adaikin  <aandrey@chromium.org>
+
+        Web Inspector: [Canvas] show replay log grouped by draw calls
+        https://bugs.webkit.org/show_bug.cgi?id=109592
+
+        Reviewed by Pavel Feldman.
+
+        Show canvas capturing log grouped by drawing calls.
+        Drive-by: extended Array.prototype with a handy peekLast function.
+        Drive-by: removed code dups in few places.
+
+        * inspector/front-end/CanvasProfileView.js:
+        (WebInspector.CanvasProfileView):
+        (WebInspector.CanvasProfileView.prototype.dispose):
+        (WebInspector.CanvasProfileView.prototype._onReplayStepClick):
+        (WebInspector.CanvasProfileView.prototype._onReplayDrawingCallClick):
+        (WebInspector.CanvasProfileView.prototype._onReplayLastStepClick):
+        (WebInspector.CanvasProfileView.prototype._replayTraceLog.didReplayTraceLog):
+        (WebInspector.CanvasProfileView.prototype._replayTraceLog):
+        (WebInspector.CanvasProfileView.prototype._didReceiveTraceLog):
+        (WebInspector.CanvasProfileView.prototype._selectedCallIndex):
+        (WebInspector.CanvasProfileView.prototype._selectedDrawCallGroupIndex):
+        (WebInspector.CanvasProfileView.prototype._appendCallNode):
+        * inspector/front-end/DataGrid.js:
+        (WebInspector.DataGrid.prototype.setColumnVisible):
+        (WebInspector.DataGridNode.prototype.set hasChildren):
+        (WebInspector.DataGridNode.prototype.set revealed):
+        (WebInspector.DataGridNode.prototype.get leftPadding):
+        * inspector/front-end/externs.js:
+        (Array.prototype.peekLast):
+        * inspector/front-end/utilities.js:
+
 2013-02-15  Yury Semikhatsky  <yurys@chromium.org>
 

trunk/Source/WebCore/inspector/front-end/CanvasProfileView.js

@@ -77 +77 @@
     columns[1].sortable = true;
     columns[1].width = "75%";
+    columns[1].disclosure = true;
     columns[2].title = WebInspector.UIString("Location");
     columns[2].sortable = true;
@@ -88 +89 @@
     /** @type {!Array.<WebInspector.DataGridNode>} */
     this._logGridNodes = [];
+    /** @type {!Array.<WebInspector.DataGridNode>} */
+    this._drawCallGroups = [];
 
     this._splitView.show(this.element);
@@ -103 +106 @@
     {
         this._logGridNodes = [];
+        this._drawCallGroupNodes = [];
         this._linkifier.reset();
     },
@@ -175 +179 @@
     _onReplayStepClick: function(forward)
     {
-        var selectedNode = this._logGrid.selectedNode;
-        if (!selectedNode)
+        var index = this._selectedCallIndex();
+        if (index === -1)
             return;
-        var nextNode = forward ? selectedNode.traverseNextNode(false) : selectedNode.traversePreviousNode(false);
-        if (nextNode)
-            nextNode.revealAndSelect();
-        else
-            selectedNode.reveal();
+        var nextNode = this._logGridNodes[forward ? index + 1 : index - 1] || this._logGridNodes[index];
+        nextNode.revealAndSelect();
     },
 
@@ -190 +191 @@
     _onReplayDrawingCallClick: function(forward)
     {
-        var callNode = this._logGrid.selectedNode;
-        if (!callNode)
+        var index = this._selectedDrawCallGroupIndex();
+        if (index === -1)
             return;
-        var index = callNode.index;
-        do {
-            var nextIndex = forward ? index + 1 : index - 1;
-            var nextCallNode = this._logGridNodes[nextIndex];
-            if (!nextCallNode)
-                break;
-            index = nextIndex;
-            callNode = nextCallNode;
-        } while (!callNode.call.isDrawingCall);
-        callNode.revealAndSelect();
+        var nextNode = this._drawCallGroups[forward ? index + 1 : index - 1] || this._drawCallGroups[index];
+        nextNode.revealAndSelect();
     },
 
@@ -214 +207 @@
     _onReplayLastStepClick: function()
     {
-        var children = this._logGrid.rootNode().children;
-        var lastNode = children[children.length - 1];
+        var lastNode = this._logGrid.rootNode().children.peekLast();
         if (lastNode)
             lastNode.revealAndSelect();
@@ -246 +238 @@
     _replayTraceLog: function()
     {
-        var callNode = this._logGrid.selectedNode;
-        if (!callNode)
+        var index = this._selectedCallIndex();
+        if (index === -1 || index === this._lastReplayCallIndex)
             return;
+        this._lastReplayCallIndex = index;
         var time = Date.now();
         /**
@@ -256 +249 @@
         function didReplayTraceLog(error, resourceState)
         {
-            if (callNode !== this._logGrid.selectedNode)
+            if (index !== this._selectedCallIndex())
                 return;
 
@@ -271 +264 @@
         }
         this._enableWaitIcon(true);
-        CanvasAgent.replayTraceLog(this._traceLogId, callNode.index, didReplayTraceLog.bind(this));
+        CanvasAgent.replayTraceLog(this._traceLogId, index, didReplayTraceLog.bind(this));
     },
 
@@ -283 +276 @@
         if (error || !traceLog)
             return;
-        var lastNode = null;
         var calls = traceLog.calls;
         for (var i = 0, n = calls.length; i < n; ++i) {
@@ -290 +282 @@
             var index = traceLog.startOffset + i;
             var gridNode = this._createCallNode(index, call);
-            this._logGrid.rootNode().appendChild(gridNode);
-            lastNode = gridNode;
-        }
-        if (lastNode)
-            lastNode.revealAndSelect();
+            this._appendCallNode(gridNode);
+        }
         if (traceLog.alive)
             setTimeout(this._requestTraceLog.bind(this), WebInspector.CanvasProfileView.TraceLogPollingInterval);
         this._profile._updateCapturingStatus(traceLog);
+        this._onReplayLastStepClick(); // Automatically replay the last step.
     },
 
@@ -327 +317 @@
         }
         CanvasAgent.getResourceInfo(contextId, didReceiveResourceInfo.bind(this));
+    },
+
+    /**
+     * @return {number}
+     */
+    _selectedCallIndex: function()
+    {
+        var node = this._logGrid.selectedNode;
+        while (node) {
+            if (typeof node.index === "number")
+                return node.index;
+            node = node.children.peekLast();
+        }
+        return -1;
+    },
+
+    /**
+     * @return {number}
+     */
+    _selectedDrawCallGroupIndex: function()
+    {
+        for (var node = this._logGrid.selectedNode; node; node = node.children.peekLast()) {
+            if (typeof node.drawCallGroupIndex === "number")
+                return node.drawCallGroupIndex;
+        }
+        for (var node = this._logGrid.selectedNode; node; node = node.parent) {
+            if (typeof node.drawCallGroupIndex === "number")
+                return node.drawCallGroupIndex;
+        }
+        return -1;
+    },
+
+    /**
+     * @param {!WebInspector.DataGridNode} gridNode
+     */
+    _appendCallNode: function(gridNode)
+    {
+        var drawCallGroup = this._drawCallGroups.peekLast();
+        if (drawCallGroup) {
+            var lastNode = drawCallGroup.children.peekLast();
+            if (lastNode && lastNode.call.isDrawingCall)
+                drawCallGroup = null;
+        }
+        if (!drawCallGroup) {
+            var index = this._drawCallGroups.length;
+            var data = {};
+            data[0] = "";
+            data[1] = "Draw call group #" + (index + 1);
+            data[2] = "";
+            drawCallGroup = new WebInspector.DataGridNode(data);
+            drawCallGroup.selectable = true;
+            drawCallGroup.drawCallGroupIndex = index;
+            this._drawCallGroups.push(drawCallGroup);
+            this._logGrid.rootNode().appendChild(drawCallGroup);
+        }
+        drawCallGroup.appendChild(gridNode);
     },
 

trunk/Source/WebCore/inspector/front-end/DataGrid.js

@@ -629 +629 @@
 
         this.columns[columnIdentifier].hidden = !visible;
-        if (visible)
-            this.element.removeStyleClass("hide-" + columnIdentifier + "-column");
-        else
-            this.element.addStyleClass("hide-" + columnIdentifier + "-column");
+        this.element.enableStyleClass("hide-" + columnIdentifier + "-column", !visible);
     },
 
@@ -1150 +1147 @@
             return;
 
-        if (this._hasChildren)
-        {
-            this._element.addStyleClass("parent");
-            if (this.expanded)
-                this._element.addStyleClass("expanded");
-        }
-        else
-        {
-            this._element.removeStyleClass("parent");
-            this._element.removeStyleClass("expanded");
-        }
+        this._element.enableStyleClass("parent", this._hasChildren);
+        this._element.enableStyleClass("expanded", this._hasChildren && this.expanded);
     },
 
@@ -1175 +1163 @@
         this._revealed = x;
 
-        if (this._element) {
-            if (this._revealed)
-                this._element.addStyleClass("revealed");
-            else
-                this._element.removeStyleClass("revealed");
-        }
+        if (this._element)
+            this._element.enableStyleClass("revealed", this._revealed);
 
         for (var i = 0; i < this.children.length; ++i)
@@ -1199 +1183 @@
     get leftPadding()
     {
-        if (typeof(this._leftPadding) === "number")
+        if (typeof this._leftPadding === "number")
             return this._leftPadding;
         
@@ -1635 +1619 @@
     },
 
+    /**
+     * @return {boolean}
+     */
     isEventWithinDisclosureTriangle: function(event)
     {

trunk/Source/WebCore/inspector/front-end/externs.js

@@ -129 +129 @@
  */
 Array.prototype.select = function(field) {}
+
+/**
+ * @this {Array.<*>}
+ * @return {*}
+ */
+Array.prototype.peekLast = function() {}
 
 DOMApplicationCache.prototype.UNCACHED = 0;

trunk/Source/WebCore/inspector/front-end/utilities.js

@@ -428 +428 @@
 });
 
+Object.defineProperty(Array.prototype, "peekLast",
+{
+    /**
+     * @this {Array.<*>}
+     * @return {*}
+     */
+    value: function()
+    {
+        return this[this.length - 1];
+    }
+});
+
 /**
  * @param {*} anObject