Generate better display names for timer and event Timeline records.

Also support AnimationFrameRequested and AnimationFrameCanceled.

https://bugs.webkit.org/show_bug.cgi?id=127258

Reviewed by Joseph Pecoraro.

* Localizations/en.lproj/localizedStrings.js: Updated.

* UserInterface/LayoutTimelineRecord.js:
(WebInspector.LayoutTimelineRecord.EventType.displayName):
Generate past tense names that better match other names.

* UserInterface/ScriptTimelineDataGridNode.js:
(WebInspector.ScriptTimelineDataGridNode.prototype.createCellContent):
Pass the details to displayName.

* UserInterface/ScriptTimelineRecord.js:
(WebInspector.ScriptTimelineRecord.EventType.displayName):
Generate better names for timer and event records. Also add missing animation frame types.

* UserInterface/ScriptTimelineView.js:
(WebInspector.ScriptTimelineView.prototype._processPendingRecords):
Pass true to WebInspector.TimelineRecordTreeElement to include timer identifiers in the title.

* UserInterface/SourceCodeTimelineTreeElement.js:
(WebInspector.SourceCodeTimelineTreeElement):
Pass includeTimerIdentifierInMainTitle through to TimelineRecordTreeElement.

* UserInterface/TimelineManager.js:
(WebInspector.TimelineManager.prototype.eventRecorded.processRecord):
Include AnimationFrameRequested and AnimationFrameCanceled.

* UserInterface/TimelineRecordTreeElement.js:
(WebInspector.TimelineRecordTreeElement):
Use displayName functions instead and support includeTimerIdentifierInMainTitle.

git-svn-id: http://svn.webkit.org/repository/webkit/trunk@162420 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog

+2014-01-19  Timothy Hatcher  <timothy@apple.com>
+
+        Generate better display names for timer and event Timeline records.
+
+        Also support AnimationFrameRequested and AnimationFrameCanceled.
+
+        https://bugs.webkit.org/show_bug.cgi?id=127258
+
+        Reviewed by Joseph Pecoraro.
+
+        * Localizations/en.lproj/localizedStrings.js: Updated.
+
+        * UserInterface/LayoutTimelineRecord.js:
+        (WebInspector.LayoutTimelineRecord.EventType.displayName):
+        Generate past tense names that better match other names.
+
+        * UserInterface/ScriptTimelineDataGridNode.js:
+        (WebInspector.ScriptTimelineDataGridNode.prototype.createCellContent):
+        Pass the details to displayName.
+
+        * UserInterface/ScriptTimelineRecord.js:
+        (WebInspector.ScriptTimelineRecord.EventType.displayName):
+        Generate better names for timer and event records. Also add missing animation frame types.
+
+        * UserInterface/ScriptTimelineView.js:
+        (WebInspector.ScriptTimelineView.prototype._processPendingRecords):
+        Pass true to WebInspector.TimelineRecordTreeElement to include timer identifiers in the title.
+
+        * UserInterface/SourceCodeTimelineTreeElement.js:
+        (WebInspector.SourceCodeTimelineTreeElement):
+        Pass includeTimerIdentifierInMainTitle through to TimelineRecordTreeElement.
+
+        * UserInterface/TimelineManager.js:
+        (WebInspector.TimelineManager.prototype.eventRecorded.processRecord):
+        Include AnimationFrameRequested and AnimationFrameCanceled.
+
+        * UserInterface/TimelineRecordTreeElement.js:
+        (WebInspector.TimelineRecordTreeElement):
+        Use displayName functions instead and support includeTimerIdentifierInMainTitle.
+
 2014-01-19  Timothy Hatcher  <timothy@apple.com>
 
         Implement basic versions of the TimelineOverview graphs.

Source/WebInspectorUI/UserInterface/LayoutTimelineRecord.js

@@ -52,11 +52,11 @@ WebInspector.LayoutTimelineRecord.EventType.displayName = function(eventType)
 {
     switch(eventType) {
     case WebInspector.LayoutTimelineRecord.EventType.InvalidateStyles:
-        return WebInspector.UIString("Invalidate Styles");
+        return WebInspector.UIString("Styles Invalidated");
     case WebInspector.LayoutTimelineRecord.EventType.RecalculateStyles:
-        return WebInspector.UIString("Recalculate Styles");
+        return WebInspector.UIString("Styles Recalculated");
     case WebInspector.LayoutTimelineRecord.EventType.InvalidateLayout:
-        return WebInspector.UIString("Invalidate Layout");
+        return WebInspector.UIString("Layout Invalidated");
     case WebInspector.LayoutTimelineRecord.EventType.Layout:
         return WebInspector.UIString("Layout");
     case WebInspector.LayoutTimelineRecord.EventType.Paint:

Source/WebInspectorUI/UserInterface/ScriptTimelineDataGridNode.js

@@ -64,7 +64,7 @@ WebInspector.ScriptTimelineDataGridNode.prototype = {
 
         switch (columnIdentifier) {
         case "eventType":
-            return WebInspector.ScriptTimelineRecord.EventType.displayName(value);
+            return WebInspector.ScriptTimelineRecord.EventType.displayName(value, this._record.details);
 
         case "details":
             return value ? value : emptyValuePlaceholderString;

Source/WebInspectorUI/UserInterface/ScriptTimelineView.js

@@ -31,7 +31,7 @@ WebInspector.ScriptTimelineView = function(recording)
     this.navigationSidebarTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName);
     this.navigationSidebarTreeOutline.element.classList.add(WebInspector.ScriptTimelineView.TreeOutlineStyleClassName);
 
-    var columns = {eventType: {}, location: {}, details: {}, startTime: {}, duration: {}};
+    var columns = {eventType: {}, location: {}, startTime: {}, duration: {}};
 
     columns.eventType.title = WebInspector.UIString("Type");
     columns.eventType.width = "15%";
@@ -41,9 +41,6 @@ WebInspector.ScriptTimelineView = function(recording)
     columns.location.title = WebInspector.UIString("Location");
     columns.location.width = "15%";
 
-    columns.details.title = WebInspector.UIString("Details");
-    columns.details.width = "15%";
-
     columns.startTime.title = WebInspector.UIString("Start Time");
     columns.startTime.width = "10%";
     columns.startTime.aligned = "right";
@@ -125,7 +122,7 @@ WebInspector.ScriptTimelineView.prototype = {
             return;
 
         for (var scriptTimelineRecord of this._pendingRecords) {
-            var treeElement = new WebInspector.TimelineRecordTreeElement(scriptTimelineRecord, true);
+            var treeElement = new WebInspector.TimelineRecordTreeElement(scriptTimelineRecord, true, true);
             var dataGridNode = new WebInspector.ScriptTimelineDataGridNode(scriptTimelineRecord, this.zeroTime);
 
             this._dataGrid.addRowInSortOrder(treeElement, dataGridNode);

Source/WebInspectorUI/UserInterface/SourceCodeTimelineTreeElement.js

@@ -23,13 +23,13 @@
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.SourceCodeTimelineTreeElement = function(sourceCodeTimeline, showFullLocationSubtitle)
+WebInspector.SourceCodeTimelineTreeElement = function(sourceCodeTimeline, showFullLocationSubtitle, includeTimerIdentifierInMainTitle)
 {
     console.assert(sourceCodeTimeline);
 
     this._sourceCodeTimeline = sourceCodeTimeline;
 
-    WebInspector.TimelineRecordTreeElement.call(this, sourceCodeTimeline.records[0], showFullLocationSubtitle, sourceCodeTimeline.sourceCodeLocation, sourceCodeTimeline);
+    WebInspector.TimelineRecordTreeElement.call(this, sourceCodeTimeline.records[0], showFullLocationSubtitle, includeTimerIdentifierInMainTitle, sourceCodeTimeline.sourceCodeLocation, sourceCodeTimeline);
 };
 
 WebInspector.SourceCodeTimelineTreeElement.prototype = {

Source/WebInspectorUI/UserInterface/TimelineManager.js

@@ -274,6 +274,20 @@ WebInspector.TimelineManager.prototype = {
                 // Pass the startTime as the endTime since this record type has no duration.
                 this._addRecord(new WebInspector.ScriptTimelineRecord(WebInspector.ScriptTimelineRecord.EventType.TimerRemoved, startTime, startTime, callFrames, sourceCodeLocation, recordPayload.data.timerId));
                 break;
+
+            case TimelineAgent.EventType.RequestAnimationFrame:
+                console.assert(isNaN(endTime));
+
+                // Pass the startTime as the endTime since this record type has no duration.
+                this._addRecord(new WebInspector.ScriptTimelineRecord(WebInspector.ScriptTimelineRecord.EventType.AnimationFrameRequested, startTime, startTime, callFrames, sourceCodeLocation, recordPayload.data.timerId));
+                break;
+
+            case TimelineAgent.EventType.CancelAnimationFrame:
+                console.assert(isNaN(endTime));
+
+                // Pass the startTime as the endTime since this record type has no duration.
+                this._addRecord(new WebInspector.ScriptTimelineRecord(WebInspector.ScriptTimelineRecord.EventType.AnimationFrameCanceled, startTime, startTime, callFrames, sourceCodeLocation, recordPayload.data.timerId));
+                break;
             }
         }
 

Source/WebInspectorUI/UserInterface/TimelineRecordTreeElement.js

@@ -23,12 +23,12 @@
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.TimelineRecordTreeElement = function(timelineRecord, showFullLocationSubtitle, sourceCodeLocation, representedObject)
+WebInspector.TimelineRecordTreeElement = function(timelineRecord, showFullLocationSubtitle, includeTimerIdentifierInMainTitle, sourceCodeLocation, representedObject)
 {
     console.assert(timelineRecord);
 
     this._record = timelineRecord;
-    this._sourceCodeLocation = sourceCodeLocation || timelineRecord.sourceCodeLocation;
+    this._sourceCodeLocation = sourceCodeLocation || timelineRecord.sourceCodeLocation || null;
 
     var title = "";
     var subtitle = "";
@@ -49,25 +49,18 @@ WebInspector.TimelineRecordTreeElement = function(timelineRecord, showFullLocati
 
     switch (timelineRecord.type) {
     case WebInspector.TimelineRecord.Type.Layout:
+        title = WebInspector.LayoutTimelineRecord.EventType.displayName(timelineRecord.eventType);
+
         switch (timelineRecord.eventType) {
         case WebInspector.LayoutTimelineRecord.EventType.InvalidateStyles:
-            title = WebInspector.UIString("Styles Invalidated");
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.StyleRecordIconStyleClass;
-            break;
         case WebInspector.LayoutTimelineRecord.EventType.RecalculateStyles:
-            title = WebInspector.UIString("Styles Recalculated");
             iconStyleClass = WebInspector.TimelineRecordTreeElement.StyleRecordIconStyleClass;
             break;
         case WebInspector.LayoutTimelineRecord.EventType.InvalidateLayout:
-            title = WebInspector.UIString("Layout Invalidated");
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.LayoutRecordIconStyleClass;
-            break;
         case WebInspector.LayoutTimelineRecord.EventType.Layout:
-            title = WebInspector.UIString("Layout");
             iconStyleClass = WebInspector.TimelineRecordTreeElement.LayoutRecordIconStyleClass;
             break;
         case WebInspector.LayoutTimelineRecord.EventType.Paint:
-            title = WebInspector.UIString("Paint");
             iconStyleClass = WebInspector.TimelineRecordTreeElement.PaintRecordIconStyleClass;
             break;
         default:
@@ -77,31 +70,23 @@ WebInspector.TimelineRecordTreeElement = function(timelineRecord, showFullLocati
         break;
 
     case WebInspector.TimelineRecord.Type.Script:
+        title = WebInspector.ScriptTimelineRecord.EventType.displayName(timelineRecord.eventType, timelineRecord.details, includeTimerIdentifierInMainTitle);
+
         switch (timelineRecord.eventType) {
         case WebInspector.ScriptTimelineRecord.EventType.ScriptEvaluated:
-            title = WebInspector.UIString("Script Evaluated");
             iconStyleClass = WebInspector.TimelineRecordTreeElement.EvaluatedRecordIconStyleClass;
             break;
         case WebInspector.ScriptTimelineRecord.EventType.EventDispatched:
-            title = WebInspector.UIString("Event Dispatched");
-            if (timelineRecord.details)
-                subtitle += " \u2014 " + timelineRecord.details;
             iconStyleClass = WebInspector.TimelineRecordTreeElement.EventRecordIconStyleClass;
             break;
         case WebInspector.ScriptTimelineRecord.EventType.TimerFired:
-            title = WebInspector.UIString("Timer Fired");
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.TimerRecordIconStyleClass;
-            break;
         case WebInspector.ScriptTimelineRecord.EventType.TimerInstalled:
-            title = WebInspector.UIString("Timer Installed");
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.TimerRecordIconStyleClass;
-            break;
         case WebInspector.ScriptTimelineRecord.EventType.TimerRemoved:
-            title = WebInspector.UIString("Timer Removed");
             iconStyleClass = WebInspector.TimelineRecordTreeElement.TimerRecordIconStyleClass;
             break;
         case WebInspector.ScriptTimelineRecord.EventType.AnimationFrameFired:
-            title = WebInspector.UIString("Animation Frame Fired");
+        case WebInspector.ScriptTimelineRecord.EventType.AnimationFrameRequested:
+        case WebInspector.ScriptTimelineRecord.EventType.AnimationFrameCanceled:
             iconStyleClass = WebInspector.TimelineRecordTreeElement.AnimationRecordIconStyleClass;
             break;
         default: