Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(791)

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: third_party/WebKit/Source/devtools/front_end/timeline/TimelineUIUtils.js

Issue 2466123002: DevTools: reformat front-end code to match chromium style. (Closed)
Patch Set: all done Created 4 years, 1 month ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « third_party/WebKit/Source/devtools/front_end/timeline/TimelineTreeView.js ('k') | third_party/WebKit/Source/devtools/front_end/timeline_model/TimelineFrameModel.js » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: third_party/WebKit/Source/devtools/front_end/timeline/TimelineUIUtils.js
diff --git a/third_party/WebKit/Source/devtools/front_end/timeline/TimelineUIUtils.js b/third_party/WebKit/Source/devtools/front_end/timeline/TimelineUIUtils.js
index 107ae0dfbdbfa2e9df7c4cd5c708e2bfebe11969..729c6a150652a76d3e6edb29f01c3dd97365bb11 100644
--- a/third_party/WebKit/Source/devtools/front_end/timeline/TimelineUIUtils.js
+++ b/third_party/WebKit/Source/devtools/front_end/timeline/TimelineUIUtils.js
@@ -28,462 +28,510 @@
* (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
* OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*/
-
-/**
- * @constructor
- */
-WebInspector.TimelineUIUtils = function() { };
-
-/**
- * @constructor
- * @param {string} title
- * @param {!WebInspector.TimelineCategory} category
- * @param {boolean=} hidden
- */
-WebInspector.TimelineRecordStyle = function(title, category, hidden)
-{
- this.title = title;
- this.category = category;
- this.hidden = !!hidden;
-};
-
/**
- * @return {!Object.<string, !WebInspector.TimelineRecordStyle>}
+ * @unrestricted
*/
-WebInspector.TimelineUIUtils._initEventStyles = function()
-{
+WebInspector.TimelineUIUtils = class {
+ /**
+ * @return {!Object.<string, !WebInspector.TimelineRecordStyle>}
+ */
+ static _initEventStyles() {
if (WebInspector.TimelineUIUtils._eventStylesMap)
- return WebInspector.TimelineUIUtils._eventStylesMap;
+ return WebInspector.TimelineUIUtils._eventStylesMap;
var recordTypes = WebInspector.TimelineModel.RecordType;
var categories = WebInspector.TimelineUIUtils.categories();
var eventStyles = {};
- eventStyles[recordTypes.Task] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Task"), categories["other"]);
- eventStyles[recordTypes.Program] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Other"), categories["other"]);
- eventStyles[recordTypes.Animation] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Animation"), categories["rendering"]);
- eventStyles[recordTypes.EventDispatch] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Event"), categories["scripting"]);
- eventStyles[recordTypes.RequestMainThreadFrame] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Request Main Thread Frame"), categories["rendering"], true);
- eventStyles[recordTypes.BeginFrame] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Frame Start"), categories["rendering"], true);
- eventStyles[recordTypes.BeginMainThreadFrame] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Frame Start (main thread)"), categories["rendering"], true);
- eventStyles[recordTypes.DrawFrame] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Draw Frame"), categories["rendering"], true);
- eventStyles[recordTypes.HitTest] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Hit Test"), categories["rendering"]);
- eventStyles[recordTypes.ScheduleStyleRecalculation] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Schedule Style Recalculation"), categories["rendering"], true);
- eventStyles[recordTypes.RecalculateStyles] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Recalculate Style"), categories["rendering"]);
- eventStyles[recordTypes.UpdateLayoutTree] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Recalculate Style"), categories["rendering"]);
- eventStyles[recordTypes.InvalidateLayout] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Invalidate Layout"), categories["rendering"], true);
- eventStyles[recordTypes.Layout] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Layout"), categories["rendering"]);
- eventStyles[recordTypes.PaintSetup] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Paint Setup"), categories["painting"]);
- eventStyles[recordTypes.PaintImage] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Paint Image"), categories["painting"], true);
- eventStyles[recordTypes.UpdateLayer] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Update Layer"), categories["painting"], true);
- eventStyles[recordTypes.UpdateLayerTree] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Update Layer Tree"), categories["rendering"]);
- eventStyles[recordTypes.Paint] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Paint"), categories["painting"]);
- eventStyles[recordTypes.RasterTask] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Rasterize Paint"), categories["painting"]);
- eventStyles[recordTypes.ScrollLayer] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Scroll"), categories["rendering"]);
- eventStyles[recordTypes.CompositeLayers] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Composite Layers"), categories["painting"]);
- eventStyles[recordTypes.ParseHTML] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Parse HTML"), categories["loading"]);
- eventStyles[recordTypes.ParseAuthorStyleSheet] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Parse Stylesheet"), categories["loading"]);
- eventStyles[recordTypes.TimerInstall] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Install Timer"), categories["scripting"]);
- eventStyles[recordTypes.TimerRemove] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Remove Timer"), categories["scripting"]);
- eventStyles[recordTypes.TimerFire] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Timer Fired"), categories["scripting"]);
- eventStyles[recordTypes.XHRReadyStateChange] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("XHR Ready State Change"), categories["scripting"]);
- eventStyles[recordTypes.XHRLoad] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("XHR Load"), categories["scripting"]);
- eventStyles[recordTypes.CompileScript] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Compile Script"), categories["scripting"]);
- eventStyles[recordTypes.EvaluateScript] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Evaluate Script"), categories["scripting"]);
- eventStyles[recordTypes.ParseScriptOnBackground] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Parse Script"), categories["scripting"]);
- eventStyles[recordTypes.MarkLoad] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Load event"), categories["scripting"], true);
- eventStyles[recordTypes.MarkDOMContent] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("DOMContentLoaded event"), categories["scripting"], true);
- eventStyles[recordTypes.MarkFirstPaint] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("First paint"), categories["painting"], true);
- eventStyles[recordTypes.TimeStamp] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Timestamp"), categories["scripting"]);
- eventStyles[recordTypes.ConsoleTime] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Console Time"), categories["scripting"]);
- eventStyles[recordTypes.UserTiming] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("User Timing"), categories["scripting"]);
- eventStyles[recordTypes.ResourceSendRequest] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Send Request"), categories["loading"]);
- eventStyles[recordTypes.ResourceReceiveResponse] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Receive Response"), categories["loading"]);
- eventStyles[recordTypes.ResourceFinish] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Finish Loading"), categories["loading"]);
- eventStyles[recordTypes.ResourceReceivedData] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Receive Data"), categories["loading"]);
- eventStyles[recordTypes.RunMicrotasks] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Run Microtasks"), categories["scripting"]);
- eventStyles[recordTypes.FunctionCall] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Function Call"), categories["scripting"]);
- eventStyles[recordTypes.GCEvent] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("GC Event"), categories["scripting"]);
- eventStyles[recordTypes.MajorGC] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Major GC"), categories["scripting"]);
- eventStyles[recordTypes.MinorGC] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Minor GC"), categories["scripting"]);
- eventStyles[recordTypes.JSFrame] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("JS Frame"), categories["scripting"]);
- eventStyles[recordTypes.RequestAnimationFrame] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Request Animation Frame"), categories["scripting"]);
- eventStyles[recordTypes.CancelAnimationFrame] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Cancel Animation Frame"), categories["scripting"]);
- eventStyles[recordTypes.FireAnimationFrame] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Animation Frame Fired"), categories["scripting"]);
- eventStyles[recordTypes.RequestIdleCallback] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Request Idle Callback"), categories["scripting"]);
- eventStyles[recordTypes.CancelIdleCallback] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Cancel Idle Callback"), categories["scripting"]);
- eventStyles[recordTypes.FireIdleCallback] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Fire Idle Callback"), categories["scripting"]);
- eventStyles[recordTypes.WebSocketCreate] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Create WebSocket"), categories["scripting"]);
- eventStyles[recordTypes.WebSocketSendHandshakeRequest] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Send WebSocket Handshake"), categories["scripting"]);
- eventStyles[recordTypes.WebSocketReceiveHandshakeResponse] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Receive WebSocket Handshake"), categories["scripting"]);
- eventStyles[recordTypes.WebSocketDestroy] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Destroy WebSocket"), categories["scripting"]);
- eventStyles[recordTypes.EmbedderCallback] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Embedder Callback"), categories["scripting"]);
- eventStyles[recordTypes.DecodeImage] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Image Decode"), categories["painting"]);
- eventStyles[recordTypes.ResizeImage] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Image Resize"), categories["painting"]);
- eventStyles[recordTypes.GPUTask] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("GPU"), categories["gpu"]);
- eventStyles[recordTypes.LatencyInfo] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Input Latency"), categories["scripting"]);
-
- eventStyles[recordTypes.GCIdleLazySweep] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("DOM GC"), categories["scripting"]);
- eventStyles[recordTypes.GCCompleteSweep] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("DOM GC"), categories["scripting"]);
- eventStyles[recordTypes.GCCollectGarbage] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("DOM GC"), categories["scripting"]);
+ eventStyles[recordTypes.Task] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Task'), categories['other']);
+ eventStyles[recordTypes.Program] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Other'), categories['other']);
+ eventStyles[recordTypes.Animation] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Animation'), categories['rendering']);
+ eventStyles[recordTypes.EventDispatch] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Event'), categories['scripting']);
+ eventStyles[recordTypes.RequestMainThreadFrame] = new WebInspector.TimelineRecordStyle(
+ WebInspector.UIString('Request Main Thread Frame'), categories['rendering'], true);
+ eventStyles[recordTypes.BeginFrame] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Frame Start'), categories['rendering'], true);
+ eventStyles[recordTypes.BeginMainThreadFrame] = new WebInspector.TimelineRecordStyle(
+ WebInspector.UIString('Frame Start (main thread)'), categories['rendering'], true);
+ eventStyles[recordTypes.DrawFrame] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Draw Frame'), categories['rendering'], true);
+ eventStyles[recordTypes.HitTest] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Hit Test'), categories['rendering']);
+ eventStyles[recordTypes.ScheduleStyleRecalculation] = new WebInspector.TimelineRecordStyle(
+ WebInspector.UIString('Schedule Style Recalculation'), categories['rendering'], true);
+ eventStyles[recordTypes.RecalculateStyles] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Recalculate Style'), categories['rendering']);
+ eventStyles[recordTypes.UpdateLayoutTree] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Recalculate Style'), categories['rendering']);
+ eventStyles[recordTypes.InvalidateLayout] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Invalidate Layout'), categories['rendering'], true);
+ eventStyles[recordTypes.Layout] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Layout'), categories['rendering']);
+ eventStyles[recordTypes.PaintSetup] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Paint Setup'), categories['painting']);
+ eventStyles[recordTypes.PaintImage] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Paint Image'), categories['painting'], true);
+ eventStyles[recordTypes.UpdateLayer] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Update Layer'), categories['painting'], true);
+ eventStyles[recordTypes.UpdateLayerTree] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Update Layer Tree'), categories['rendering']);
+ eventStyles[recordTypes.Paint] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Paint'), categories['painting']);
+ eventStyles[recordTypes.RasterTask] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Rasterize Paint'), categories['painting']);
+ eventStyles[recordTypes.ScrollLayer] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Scroll'), categories['rendering']);
+ eventStyles[recordTypes.CompositeLayers] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Composite Layers'), categories['painting']);
+ eventStyles[recordTypes.ParseHTML] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Parse HTML'), categories['loading']);
+ eventStyles[recordTypes.ParseAuthorStyleSheet] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Parse Stylesheet'), categories['loading']);
+ eventStyles[recordTypes.TimerInstall] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Install Timer'), categories['scripting']);
+ eventStyles[recordTypes.TimerRemove] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Remove Timer'), categories['scripting']);
+ eventStyles[recordTypes.TimerFire] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Timer Fired'), categories['scripting']);
+ eventStyles[recordTypes.XHRReadyStateChange] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('XHR Ready State Change'), categories['scripting']);
+ eventStyles[recordTypes.XHRLoad] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('XHR Load'), categories['scripting']);
+ eventStyles[recordTypes.CompileScript] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Compile Script'), categories['scripting']);
+ eventStyles[recordTypes.EvaluateScript] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Evaluate Script'), categories['scripting']);
+ eventStyles[recordTypes.ParseScriptOnBackground] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Parse Script'), categories['scripting']);
+ eventStyles[recordTypes.MarkLoad] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Load event'), categories['scripting'], true);
+ eventStyles[recordTypes.MarkDOMContent] = new WebInspector.TimelineRecordStyle(
+ WebInspector.UIString('DOMContentLoaded event'), categories['scripting'], true);
+ eventStyles[recordTypes.MarkFirstPaint] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('First paint'), categories['painting'], true);
+ eventStyles[recordTypes.TimeStamp] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Timestamp'), categories['scripting']);
+ eventStyles[recordTypes.ConsoleTime] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Console Time'), categories['scripting']);
+ eventStyles[recordTypes.UserTiming] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('User Timing'), categories['scripting']);
+ eventStyles[recordTypes.ResourceSendRequest] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Send Request'), categories['loading']);
+ eventStyles[recordTypes.ResourceReceiveResponse] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Receive Response'), categories['loading']);
+ eventStyles[recordTypes.ResourceFinish] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Finish Loading'), categories['loading']);
+ eventStyles[recordTypes.ResourceReceivedData] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Receive Data'), categories['loading']);
+ eventStyles[recordTypes.RunMicrotasks] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Run Microtasks'), categories['scripting']);
+ eventStyles[recordTypes.FunctionCall] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Function Call'), categories['scripting']);
+ eventStyles[recordTypes.GCEvent] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('GC Event'), categories['scripting']);
+ eventStyles[recordTypes.MajorGC] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Major GC'), categories['scripting']);
+ eventStyles[recordTypes.MinorGC] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Minor GC'), categories['scripting']);
+ eventStyles[recordTypes.JSFrame] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('JS Frame'), categories['scripting']);
+ eventStyles[recordTypes.RequestAnimationFrame] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Request Animation Frame'), categories['scripting']);
+ eventStyles[recordTypes.CancelAnimationFrame] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Cancel Animation Frame'), categories['scripting']);
+ eventStyles[recordTypes.FireAnimationFrame] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Animation Frame Fired'), categories['scripting']);
+ eventStyles[recordTypes.RequestIdleCallback] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Request Idle Callback'), categories['scripting']);
+ eventStyles[recordTypes.CancelIdleCallback] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Cancel Idle Callback'), categories['scripting']);
+ eventStyles[recordTypes.FireIdleCallback] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Fire Idle Callback'), categories['scripting']);
+ eventStyles[recordTypes.WebSocketCreate] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Create WebSocket'), categories['scripting']);
+ eventStyles[recordTypes.WebSocketSendHandshakeRequest] = new WebInspector.TimelineRecordStyle(
+ WebInspector.UIString('Send WebSocket Handshake'), categories['scripting']);
+ eventStyles[recordTypes.WebSocketReceiveHandshakeResponse] = new WebInspector.TimelineRecordStyle(
+ WebInspector.UIString('Receive WebSocket Handshake'), categories['scripting']);
+ eventStyles[recordTypes.WebSocketDestroy] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Destroy WebSocket'), categories['scripting']);
+ eventStyles[recordTypes.EmbedderCallback] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Embedder Callback'), categories['scripting']);
+ eventStyles[recordTypes.DecodeImage] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Image Decode'), categories['painting']);
+ eventStyles[recordTypes.ResizeImage] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Image Resize'), categories['painting']);
+ eventStyles[recordTypes.GPUTask] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('GPU'), categories['gpu']);
+ eventStyles[recordTypes.LatencyInfo] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('Input Latency'), categories['scripting']);
+
+ eventStyles[recordTypes.GCIdleLazySweep] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('DOM GC'), categories['scripting']);
+ eventStyles[recordTypes.GCCompleteSweep] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('DOM GC'), categories['scripting']);
+ eventStyles[recordTypes.GCCollectGarbage] =
+ new WebInspector.TimelineRecordStyle(WebInspector.UIString('DOM GC'), categories['scripting']);
WebInspector.TimelineUIUtils._eventStylesMap = eventStyles;
return eventStyles;
-};
+ }
-/**
- * @param {!WebInspector.TimelineIRModel.InputEvents} inputEventType
- * @return {?string}
- */
-WebInspector.TimelineUIUtils.inputEventDisplayName = function(inputEventType)
-{
+ /**
+ * @param {!WebInspector.TimelineIRModel.InputEvents} inputEventType
+ * @return {?string}
+ */
+ static inputEventDisplayName(inputEventType) {
if (!WebInspector.TimelineUIUtils._inputEventToDisplayName) {
- var inputEvent = WebInspector.TimelineIRModel.InputEvents;
-
- /** @type {!Map<!WebInspector.TimelineIRModel.InputEvents, string>} */
- WebInspector.TimelineUIUtils._inputEventToDisplayName = new Map([
- [inputEvent.Char, WebInspector.UIString("Key Character")],
- [inputEvent.KeyDown, WebInspector.UIString("Key Down")],
- [inputEvent.KeyDownRaw, WebInspector.UIString("Key Down")],
- [inputEvent.KeyUp, WebInspector.UIString("Key Up")],
- [inputEvent.Click, WebInspector.UIString("Click")],
- [inputEvent.ContextMenu, WebInspector.UIString("Context Menu")],
- [inputEvent.MouseDown, WebInspector.UIString("Mouse Down")],
- [inputEvent.MouseMove, WebInspector.UIString("Mouse Move")],
- [inputEvent.MouseUp, WebInspector.UIString("Mouse Up")],
- [inputEvent.MouseWheel, WebInspector.UIString("Mouse Wheel")],
- [inputEvent.ScrollBegin, WebInspector.UIString("Scroll Begin")],
- [inputEvent.ScrollEnd, WebInspector.UIString("Scroll End")],
- [inputEvent.ScrollUpdate, WebInspector.UIString("Scroll Update")],
- [inputEvent.FlingStart, WebInspector.UIString("Fling Start")],
- [inputEvent.FlingCancel, WebInspector.UIString("Fling Halt")],
- [inputEvent.Tap, WebInspector.UIString("Tap")],
- [inputEvent.TapCancel, WebInspector.UIString("Tap Halt")],
- [inputEvent.ShowPress, WebInspector.UIString("Tap Begin")],
- [inputEvent.TapDown, WebInspector.UIString("Tap Down")],
- [inputEvent.TouchCancel, WebInspector.UIString("Touch Cancel")],
- [inputEvent.TouchEnd, WebInspector.UIString("Touch End")],
- [inputEvent.TouchMove, WebInspector.UIString("Touch Move")],
- [inputEvent.TouchStart, WebInspector.UIString("Touch Start")],
- [inputEvent.PinchBegin, WebInspector.UIString("Pinch Begin")],
- [inputEvent.PinchEnd, WebInspector.UIString("Pinch End")],
- [inputEvent.PinchUpdate, WebInspector.UIString("Pinch Update")]
- ]);
+ var inputEvent = WebInspector.TimelineIRModel.InputEvents;
+
+ /** @type {!Map<!WebInspector.TimelineIRModel.InputEvents, string>} */
+ WebInspector.TimelineUIUtils._inputEventToDisplayName = new Map([
+ [inputEvent.Char, WebInspector.UIString('Key Character')],
+ [inputEvent.KeyDown, WebInspector.UIString('Key Down')],
+ [inputEvent.KeyDownRaw, WebInspector.UIString('Key Down')],
+ [inputEvent.KeyUp, WebInspector.UIString('Key Up')],
+ [inputEvent.Click, WebInspector.UIString('Click')],
+ [inputEvent.ContextMenu, WebInspector.UIString('Context Menu')],
+ [inputEvent.MouseDown, WebInspector.UIString('Mouse Down')],
+ [inputEvent.MouseMove, WebInspector.UIString('Mouse Move')],
+ [inputEvent.MouseUp, WebInspector.UIString('Mouse Up')],
+ [inputEvent.MouseWheel, WebInspector.UIString('Mouse Wheel')],
+ [inputEvent.ScrollBegin, WebInspector.UIString('Scroll Begin')],
+ [inputEvent.ScrollEnd, WebInspector.UIString('Scroll End')],
+ [inputEvent.ScrollUpdate, WebInspector.UIString('Scroll Update')],
+ [inputEvent.FlingStart, WebInspector.UIString('Fling Start')],
+ [inputEvent.FlingCancel, WebInspector.UIString('Fling Halt')],
+ [inputEvent.Tap, WebInspector.UIString('Tap')],
+ [inputEvent.TapCancel, WebInspector.UIString('Tap Halt')],
+ [inputEvent.ShowPress, WebInspector.UIString('Tap Begin')],
+ [inputEvent.TapDown, WebInspector.UIString('Tap Down')],
+ [inputEvent.TouchCancel, WebInspector.UIString('Touch Cancel')],
+ [inputEvent.TouchEnd, WebInspector.UIString('Touch End')],
+ [inputEvent.TouchMove, WebInspector.UIString('Touch Move')],
+ [inputEvent.TouchStart, WebInspector.UIString('Touch Start')],
+ [inputEvent.PinchBegin, WebInspector.UIString('Pinch Begin')],
+ [inputEvent.PinchEnd, WebInspector.UIString('Pinch End')],
+ [inputEvent.PinchUpdate, WebInspector.UIString('Pinch Update')]
+ ]);
}
return WebInspector.TimelineUIUtils._inputEventToDisplayName.get(inputEventType) || null;
-};
-
-/**
- * @param {!WebInspector.TracingModel.Event} traceEvent
- * @param {!RegExp} regExp
- * @return {boolean}
- */
-WebInspector.TimelineUIUtils.testContentMatching = function(traceEvent, regExp)
-{
+ }
+
+ /**
+ * @param {!WebInspector.TracingModel.Event} traceEvent
+ * @param {!RegExp} regExp
+ * @return {boolean}
+ */
+ static testContentMatching(traceEvent, regExp) {
var title = WebInspector.TimelineUIUtils.eventStyle(traceEvent).title;
var tokens = [title];
if (traceEvent.url)
- tokens.push(traceEvent.url);
+ tokens.push(traceEvent.url);
for (var argName in traceEvent.args) {
- var argValue = traceEvent.args[argName];
- for (var key in argValue)
- tokens.push(argValue[key]);
+ var argValue = traceEvent.args[argName];
+ for (var key in argValue)
+ tokens.push(argValue[key]);
}
- return regExp.test(tokens.join("|"));
-};
-
-/**
- * @param {!WebInspector.TimelineModel.Record} record
- * @return {!WebInspector.TimelineCategory}
- */
-WebInspector.TimelineUIUtils.categoryForRecord = function(record)
-{
+ return regExp.test(tokens.join('|'));
+ }
+
+ /**
+ * @param {!WebInspector.TimelineModel.Record} record
+ * @return {!WebInspector.TimelineCategory}
+ */
+ static categoryForRecord(record) {
return WebInspector.TimelineUIUtils.eventStyle(record.traceEvent()).category;
-};
-
+ }
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @return {!{title: string, category: !WebInspector.TimelineCategory}}
- */
-WebInspector.TimelineUIUtils.eventStyle = function(event)
-{
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @return {!{title: string, category: !WebInspector.TimelineCategory}}
+ */
+ static eventStyle(event) {
var eventStyles = WebInspector.TimelineUIUtils._initEventStyles();
- if (event.hasCategory(WebInspector.TimelineModel.Category.Console) || event.hasCategory(WebInspector.TimelineModel.Category.UserTiming))
- return { title: event.name, category: WebInspector.TimelineUIUtils.categories()["scripting"] };
+ if (event.hasCategory(WebInspector.TimelineModel.Category.Console) ||
+ event.hasCategory(WebInspector.TimelineModel.Category.UserTiming))
+ return {title: event.name, category: WebInspector.TimelineUIUtils.categories()['scripting']};
if (event.hasCategory(WebInspector.TimelineModel.Category.LatencyInfo)) {
- /** @const */
- var prefix = "InputLatency::";
- var inputEventType = event.name.startsWith(prefix) ? event.name.substr(prefix.length) : event.name;
- var displayName = WebInspector.TimelineUIUtils.inputEventDisplayName(/** @type {!WebInspector.TimelineIRModel.InputEvents} */ (inputEventType));
- return { title: displayName || inputEventType, category: WebInspector.TimelineUIUtils.categories()["scripting"] };
+ /** @const */
+ var prefix = 'InputLatency::';
+ var inputEventType = event.name.startsWith(prefix) ? event.name.substr(prefix.length) : event.name;
+ var displayName = WebInspector.TimelineUIUtils.inputEventDisplayName(
+ /** @type {!WebInspector.TimelineIRModel.InputEvents} */ (inputEventType));
+ return {title: displayName || inputEventType, category: WebInspector.TimelineUIUtils.categories()['scripting']};
}
var result = eventStyles[event.name];
if (!result) {
- result = new WebInspector.TimelineRecordStyle(event.name, WebInspector.TimelineUIUtils.categories()["other"], true);
- eventStyles[event.name] = result;
+ result =
+ new WebInspector.TimelineRecordStyle(event.name, WebInspector.TimelineUIUtils.categories()['other'], true);
+ eventStyles[event.name] = result;
}
return result;
-};
+ }
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @return {string}
- */
-WebInspector.TimelineUIUtils.eventColor = function(event)
-{
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @return {string}
+ */
+ static eventColor(event) {
if (event.name === WebInspector.TimelineModel.RecordType.JSFrame) {
- var frame = event.args["data"];
- if (WebInspector.TimelineUIUtils.isUserFrame(frame))
- return WebInspector.TimelineUIUtils.colorForURL(frame.url);
+ var frame = event.args['data'];
+ if (WebInspector.TimelineUIUtils.isUserFrame(frame))
+ return WebInspector.TimelineUIUtils.colorForURL(frame.url);
}
return WebInspector.TimelineUIUtils.eventStyle(event).category.color;
-};
+ }
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @return {string}
- */
-WebInspector.TimelineUIUtils.eventTitle = function(event)
-{
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @return {string}
+ */
+ static eventTitle(event) {
var title = WebInspector.TimelineUIUtils.eventStyle(event).title;
if (event.hasCategory(WebInspector.TimelineModel.Category.Console))
- return title;
+ return title;
if (event.name === WebInspector.TimelineModel.RecordType.TimeStamp)
- return WebInspector.UIString("%s: %s", title, event.args["data"]["message"]);
- if (event.name === WebInspector.TimelineModel.RecordType.Animation && event.args["data"] && event.args["data"]["name"])
- return WebInspector.UIString("%s: %s", title, event.args["data"]["name"]);
+ return WebInspector.UIString('%s: %s', title, event.args['data']['message']);
+ if (event.name === WebInspector.TimelineModel.RecordType.Animation && event.args['data'] &&
+ event.args['data']['name'])
+ return WebInspector.UIString('%s: %s', title, event.args['data']['name']);
return title;
-};
+ }
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @return {?string}
- */
-WebInspector.TimelineUIUtils.eventURL = function(event)
-{
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @return {?string}
+ */
+ static eventURL(event) {
if (event.url)
- return event.url;
- var data = event.args["data"] || event.args["beginData"];
+ return event.url;
+ var data = event.args['data'] || event.args['beginData'];
return data && data.url || null;
-};
+ }
-/**
- * !Map<!WebInspector.TimelineIRModel.Phases, !{color: string, label: string}>
- */
-WebInspector.TimelineUIUtils._interactionPhaseStyles = function()
-{
+ /**
+ * !Map<!WebInspector.TimelineIRModel.Phases, !{color: string, label: string}>
+ */
+ static _interactionPhaseStyles() {
var map = WebInspector.TimelineUIUtils._interactionPhaseStylesMap;
if (!map) {
- map = new Map([
- [WebInspector.TimelineIRModel.Phases.Idle, {color: "white", label: "Idle"}],
- [WebInspector.TimelineIRModel.Phases.Response, {color: "hsl(43, 83%, 64%)", label: WebInspector.UIString("Response")}],
- [WebInspector.TimelineIRModel.Phases.Scroll, {color: "hsl(256, 67%, 70%)", label: WebInspector.UIString("Scroll")}],
- [WebInspector.TimelineIRModel.Phases.Fling, {color: "hsl(256, 67%, 70%)", label: WebInspector.UIString("Fling")}],
- [WebInspector.TimelineIRModel.Phases.Drag, {color: "hsl(256, 67%, 70%)", label: WebInspector.UIString("Drag")}],
- [WebInspector.TimelineIRModel.Phases.Animation, {color: "hsl(256, 67%, 70%)", label: WebInspector.UIString("Animation")}],
- [WebInspector.TimelineIRModel.Phases.Uncategorized, {color: "hsl(0, 0%, 87%)", label: WebInspector.UIString("Uncategorized")}]
- ]);
- WebInspector.TimelineUIUtils._interactionPhaseStylesMap = map;
+ map = new Map([
+ [WebInspector.TimelineIRModel.Phases.Idle, {color: 'white', label: 'Idle'}],
+ [
+ WebInspector.TimelineIRModel.Phases.Response,
+ {color: 'hsl(43, 83%, 64%)', label: WebInspector.UIString('Response')}
+ ],
+ [
+ WebInspector.TimelineIRModel.Phases.Scroll,
+ {color: 'hsl(256, 67%, 70%)', label: WebInspector.UIString('Scroll')}
+ ],
+ [
+ WebInspector.TimelineIRModel.Phases.Fling,
+ {color: 'hsl(256, 67%, 70%)', label: WebInspector.UIString('Fling')}
+ ],
+ [WebInspector.TimelineIRModel.Phases.Drag, {color: 'hsl(256, 67%, 70%)', label: WebInspector.UIString('Drag')}],
+ [
+ WebInspector.TimelineIRModel.Phases.Animation,
+ {color: 'hsl(256, 67%, 70%)', label: WebInspector.UIString('Animation')}
+ ],
+ [
+ WebInspector.TimelineIRModel.Phases.Uncategorized,
+ {color: 'hsl(0, 0%, 87%)', label: WebInspector.UIString('Uncategorized')}
+ ]
+ ]);
+ WebInspector.TimelineUIUtils._interactionPhaseStylesMap = map;
}
return map;
-};
+ }
-/**
- * @param {!WebInspector.TimelineIRModel.Phases} phase
- * @return {string}
- */
-WebInspector.TimelineUIUtils.interactionPhaseColor = function(phase)
-{
+ /**
+ * @param {!WebInspector.TimelineIRModel.Phases} phase
+ * @return {string}
+ */
+ static interactionPhaseColor(phase) {
return WebInspector.TimelineUIUtils._interactionPhaseStyles().get(phase).color;
-};
+ }
-/**
- * @param {!WebInspector.TimelineIRModel.Phases} phase
- * @return {string}
- */
-WebInspector.TimelineUIUtils.interactionPhaseLabel = function(phase)
-{
+ /**
+ * @param {!WebInspector.TimelineIRModel.Phases} phase
+ * @return {string}
+ */
+ static interactionPhaseLabel(phase) {
return WebInspector.TimelineUIUtils._interactionPhaseStyles().get(phase).label;
-};
-
-/**
- * @param {!RuntimeAgent.CallFrame} frame
- * @return {boolean}
- */
-WebInspector.TimelineUIUtils.isUserFrame = function(frame)
-{
- return frame.scriptId !== "0" && !(frame.url && frame.url.startsWith("native "));
-};
-
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @return {?RuntimeAgent.CallFrame}
- */
-WebInspector.TimelineUIUtils.topStackFrame = function(event)
-{
+ }
+
+ /**
+ * @param {!RuntimeAgent.CallFrame} frame
+ * @return {boolean}
+ */
+ static isUserFrame(frame) {
+ return frame.scriptId !== '0' && !(frame.url && frame.url.startsWith('native '));
+ }
+
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @return {?RuntimeAgent.CallFrame}
+ */
+ static topStackFrame(event) {
var stackTrace = event.stackTrace || event.initiator && event.initiator.stackTrace;
return stackTrace && stackTrace.length ? stackTrace[0] : null;
-};
+ }
-/**
- * @enum {symbol}
- */
-WebInspector.TimelineUIUtils.NetworkCategory = {
- HTML: Symbol("HTML"),
- Script: Symbol("Script"),
- Style: Symbol("Style"),
- Media: Symbol("Media"),
- Other: Symbol("Other")
-};
-
-/**
- * @param {!WebInspector.TimelineModel.NetworkRequest} request
- * @return {!WebInspector.TimelineUIUtils.NetworkCategory}
- */
-WebInspector.TimelineUIUtils.networkRequestCategory = function(request)
-{
+ /**
+ * @param {!WebInspector.TimelineModel.NetworkRequest} request
+ * @return {!WebInspector.TimelineUIUtils.NetworkCategory}
+ */
+ static networkRequestCategory(request) {
var categories = WebInspector.TimelineUIUtils.NetworkCategory;
switch (request.mimeType) {
- case "text/html":
+ case 'text/html':
return categories.HTML;
- case "application/javascript":
- case "application/x-javascript":
- case "text/javascript":
+ case 'application/javascript':
+ case 'application/x-javascript':
+ case 'text/javascript':
return categories.Script;
- case "text/css":
+ case 'text/css':
return categories.Style;
- case "audio/ogg":
- case "image/gif":
- case "image/jpeg":
- case "image/png":
- case "image/svg+xml":
- case "image/webp":
- case "image/x-icon":
- case "font/opentype":
- case "font/woff2":
- case "application/font-woff":
+ case 'audio/ogg':
+ case 'image/gif':
+ case 'image/jpeg':
+ case 'image/png':
+ case 'image/svg+xml':
+ case 'image/webp':
+ case 'image/x-icon':
+ case 'font/opentype':
+ case 'font/woff2':
+ case 'application/font-woff':
return categories.Media;
- default:
+ default:
return categories.Other;
}
-};
+ }
-/**
- * @param {!WebInspector.TimelineUIUtils.NetworkCategory} category
- * @return {string}
- */
-WebInspector.TimelineUIUtils.networkCategoryColor = function(category)
-{
+ /**
+ * @param {!WebInspector.TimelineUIUtils.NetworkCategory} category
+ * @return {string}
+ */
+ static networkCategoryColor(category) {
var categories = WebInspector.TimelineUIUtils.NetworkCategory;
switch (category) {
- case categories.HTML: return "hsl(214, 67%, 66%)";
- case categories.Script: return "hsl(43, 83%, 64%)";
- case categories.Style: return "hsl(256, 67%, 70%)";
- case categories.Media: return "hsl(109, 33%, 55%)";
- default: return "hsl(0, 0%, 70%)";
+ case categories.HTML:
+ return 'hsl(214, 67%, 66%)';
+ case categories.Script:
+ return 'hsl(43, 83%, 64%)';
+ case categories.Style:
+ return 'hsl(256, 67%, 70%)';
+ case categories.Media:
+ return 'hsl(109, 33%, 55%)';
+ default:
+ return 'hsl(0, 0%, 70%)';
}
-};
-
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @param {?WebInspector.Target} target
- * @return {?string}
- */
-WebInspector.TimelineUIUtils.buildDetailsTextForTraceEvent = function(event, target)
-{
+ }
+
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @param {?WebInspector.Target} target
+ * @return {?string}
+ */
+ static buildDetailsTextForTraceEvent(event, target) {
var recordType = WebInspector.TimelineModel.RecordType;
var detailsText;
- var eventData = event.args["data"];
+ var eventData = event.args['data'];
switch (event.name) {
- case recordType.GCEvent:
- case recordType.MajorGC:
- case recordType.MinorGC:
- var delta = event.args["usedHeapSizeBefore"] - event.args["usedHeapSizeAfter"];
- detailsText = WebInspector.UIString("%s collected", Number.bytesToString(delta));
+ case recordType.GCEvent:
+ case recordType.MajorGC:
+ case recordType.MinorGC:
+ var delta = event.args['usedHeapSizeBefore'] - event.args['usedHeapSizeAfter'];
+ detailsText = WebInspector.UIString('%s collected', Number.bytesToString(delta));
break;
- case recordType.FunctionCall:
+ case recordType.FunctionCall:
// Omit internally generated script names.
if (eventData)
- detailsText = linkifyLocationAsText(eventData["scriptId"], eventData["lineNumber"], 0);
+ detailsText = linkifyLocationAsText(eventData['scriptId'], eventData['lineNumber'], 0);
break;
- case recordType.JSFrame:
- detailsText = WebInspector.beautifyFunctionName(eventData["functionName"]);
+ case recordType.JSFrame:
+ detailsText = WebInspector.beautifyFunctionName(eventData['functionName']);
break;
- case recordType.EventDispatch:
- detailsText = eventData ? eventData["type"] : null;
+ case recordType.EventDispatch:
+ detailsText = eventData ? eventData['type'] : null;
break;
- case recordType.Paint:
+ case recordType.Paint:
var width = WebInspector.TimelineUIUtils.quadWidth(eventData.clip);
var height = WebInspector.TimelineUIUtils.quadHeight(eventData.clip);
if (width && height)
- detailsText = WebInspector.UIString("%d\u2009\u00d7\u2009%d", width, height);
+ detailsText = WebInspector.UIString('%d\u2009\u00d7\u2009%d', width, height);
break;
- case recordType.ParseHTML:
- var endLine = event.args["endData"] && event.args["endData"]["endLine"];
- var url = WebInspector.displayNameForURL(event.args["beginData"]["url"]);
- detailsText = WebInspector.UIString("%s [%s\u2026%s]", url, event.args["beginData"]["startLine"] + 1, endLine >= 0 ? endLine + 1 : "");
+ case recordType.ParseHTML:
+ var endLine = event.args['endData'] && event.args['endData']['endLine'];
+ var url = WebInspector.displayNameForURL(event.args['beginData']['url']);
+ detailsText = WebInspector.UIString(
+ '%s [%s\u2026%s]', url, event.args['beginData']['startLine'] + 1, endLine >= 0 ? endLine + 1 : '');
break;
- case recordType.CompileScript:
- case recordType.EvaluateScript:
- var url = eventData && eventData["url"];
+ case recordType.CompileScript:
+ case recordType.EvaluateScript:
+ var url = eventData && eventData['url'];
if (url)
- detailsText = WebInspector.displayNameForURL(url) + ":" + (eventData["lineNumber"] + 1);
+ detailsText = WebInspector.displayNameForURL(url) + ':' + (eventData['lineNumber'] + 1);
break;
- case recordType.ParseScriptOnBackground:
- case recordType.XHRReadyStateChange:
- case recordType.XHRLoad:
- var url = eventData["url"];
+ case recordType.ParseScriptOnBackground:
+ case recordType.XHRReadyStateChange:
+ case recordType.XHRLoad:
+ var url = eventData['url'];
if (url)
- detailsText = WebInspector.displayNameForURL(url);
+ detailsText = WebInspector.displayNameForURL(url);
break;
- case recordType.TimeStamp:
- detailsText = eventData["message"];
+ case recordType.TimeStamp:
+ detailsText = eventData['message'];
break;
- case recordType.WebSocketCreate:
- case recordType.WebSocketSendHandshakeRequest:
- case recordType.WebSocketReceiveHandshakeResponse:
- case recordType.WebSocketDestroy:
- case recordType.ResourceSendRequest:
- case recordType.ResourceReceivedData:
- case recordType.ResourceReceiveResponse:
- case recordType.ResourceFinish:
- case recordType.PaintImage:
- case recordType.DecodeImage:
- case recordType.ResizeImage:
- case recordType.DecodeLazyPixelRef:
+ case recordType.WebSocketCreate:
+ case recordType.WebSocketSendHandshakeRequest:
+ case recordType.WebSocketReceiveHandshakeResponse:
+ case recordType.WebSocketDestroy:
+ case recordType.ResourceSendRequest:
+ case recordType.ResourceReceivedData:
+ case recordType.ResourceReceiveResponse:
+ case recordType.ResourceFinish:
+ case recordType.PaintImage:
+ case recordType.DecodeImage:
+ case recordType.ResizeImage:
+ case recordType.DecodeLazyPixelRef:
if (event.url)
- detailsText = WebInspector.displayNameForURL(event.url);
+ detailsText = WebInspector.displayNameForURL(event.url);
break;
- case recordType.EmbedderCallback:
- detailsText = eventData["callbackName"];
+ case recordType.EmbedderCallback:
+ detailsText = eventData['callbackName'];
break;
- case recordType.Animation:
- detailsText = eventData && eventData["name"];
+ case recordType.Animation:
+ detailsText = eventData && eventData['name'];
break;
- case recordType.GCIdleLazySweep:
- detailsText = WebInspector.UIString("idle sweep");
+ case recordType.GCIdleLazySweep:
+ detailsText = WebInspector.UIString('idle sweep');
break;
- case recordType.GCCompleteSweep:
- detailsText = WebInspector.UIString("complete sweep");
+ case recordType.GCCompleteSweep:
+ detailsText = WebInspector.UIString('complete sweep');
break;
- case recordType.GCCollectGarbage:
- detailsText = WebInspector.UIString("collect");
+ case recordType.GCCollectGarbage:
+ detailsText = WebInspector.UIString('collect');
break;
- default:
+ default:
if (event.hasCategory(WebInspector.TimelineModel.Category.Console))
- detailsText = null;
+ detailsText = null;
else
- detailsText = linkifyTopCallFrameAsText();
+ detailsText = linkifyTopCallFrameAsText();
break;
}
@@ -495,110 +543,108 @@ WebInspector.TimelineUIUtils.buildDetailsTextForTraceEvent = function(event, tar
* @param {number} columnNumber
* @return {?string}
*/
- function linkifyLocationAsText(scriptId, lineNumber, columnNumber)
- {
- var debuggerModel = WebInspector.DebuggerModel.fromTarget(target);
- if (!target || target.isDisposed() || !scriptId || !debuggerModel)
- return null;
- var rawLocation = debuggerModel.createRawLocationByScriptId(scriptId, lineNumber, columnNumber);
- if (!rawLocation)
- return null;
- var uiLocation = WebInspector.debuggerWorkspaceBinding.rawLocationToUILocation(rawLocation);
- return uiLocation.linkText();
+ function linkifyLocationAsText(scriptId, lineNumber, columnNumber) {
+ var debuggerModel = WebInspector.DebuggerModel.fromTarget(target);
+ if (!target || target.isDisposed() || !scriptId || !debuggerModel)
+ return null;
+ var rawLocation = debuggerModel.createRawLocationByScriptId(scriptId, lineNumber, columnNumber);
+ if (!rawLocation)
+ return null;
+ var uiLocation = WebInspector.debuggerWorkspaceBinding.rawLocationToUILocation(rawLocation);
+ return uiLocation.linkText();
}
/**
* @return {?string}
*/
- function linkifyTopCallFrameAsText()
- {
- var frame = WebInspector.TimelineUIUtils.topStackFrame(event);
- if (!frame)
- return null;
- var text = linkifyLocationAsText(frame.scriptId, frame.lineNumber, frame.columnNumber);
- if (!text) {
- text = frame.url;
- if (typeof frame.lineNumber === "number")
- text += ":" + (frame.lineNumber + 1);
- }
- return text;
+ function linkifyTopCallFrameAsText() {
+ var frame = WebInspector.TimelineUIUtils.topStackFrame(event);
+ if (!frame)
+ return null;
+ var text = linkifyLocationAsText(frame.scriptId, frame.lineNumber, frame.columnNumber);
+ if (!text) {
+ text = frame.url;
+ if (typeof frame.lineNumber === 'number')
+ text += ':' + (frame.lineNumber + 1);
+ }
+ return text;
}
-};
-
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @param {?WebInspector.Target} target
- * @param {!WebInspector.Linkifier} linkifier
- * @return {?Node}
- */
-WebInspector.TimelineUIUtils.buildDetailsNodeForTraceEvent = function(event, target, linkifier)
-{
+ }
+
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @param {?WebInspector.Target} target
+ * @param {!WebInspector.Linkifier} linkifier
+ * @return {?Node}
+ */
+ static buildDetailsNodeForTraceEvent(event, target, linkifier) {
var recordType = WebInspector.TimelineModel.RecordType;
var details = null;
var detailsText;
- var eventData = event.args["data"];
+ var eventData = event.args['data'];
switch (event.name) {
- case recordType.GCEvent:
- case recordType.MajorGC:
- case recordType.MinorGC:
- case recordType.EventDispatch:
- case recordType.Paint:
- case recordType.Animation:
- case recordType.EmbedderCallback:
- case recordType.ParseHTML:
- case recordType.WebSocketCreate:
- case recordType.WebSocketSendHandshakeRequest:
- case recordType.WebSocketReceiveHandshakeResponse:
- case recordType.WebSocketDestroy:
- case recordType.GCIdleLazySweep:
- case recordType.GCCompleteSweep:
- case recordType.GCCollectGarbage:
+ case recordType.GCEvent:
+ case recordType.MajorGC:
+ case recordType.MinorGC:
+ case recordType.EventDispatch:
+ case recordType.Paint:
+ case recordType.Animation:
+ case recordType.EmbedderCallback:
+ case recordType.ParseHTML:
+ case recordType.WebSocketCreate:
+ case recordType.WebSocketSendHandshakeRequest:
+ case recordType.WebSocketReceiveHandshakeResponse:
+ case recordType.WebSocketDestroy:
+ case recordType.GCIdleLazySweep:
+ case recordType.GCCompleteSweep:
+ case recordType.GCCollectGarbage:
detailsText = WebInspector.TimelineUIUtils.buildDetailsTextForTraceEvent(event, target);
break;
- case recordType.PaintImage:
- case recordType.DecodeImage:
- case recordType.ResizeImage:
- case recordType.DecodeLazyPixelRef:
- case recordType.XHRReadyStateChange:
- case recordType.XHRLoad:
- case recordType.ResourceSendRequest:
- case recordType.ResourceReceivedData:
- case recordType.ResourceReceiveResponse:
- case recordType.ResourceFinish:
+ case recordType.PaintImage:
+ case recordType.DecodeImage:
+ case recordType.ResizeImage:
+ case recordType.DecodeLazyPixelRef:
+ case recordType.XHRReadyStateChange:
+ case recordType.XHRLoad:
+ case recordType.ResourceSendRequest:
+ case recordType.ResourceReceivedData:
+ case recordType.ResourceReceiveResponse:
+ case recordType.ResourceFinish:
if (event.url)
- details = WebInspector.linkifyResourceAsNode(event.url);
+ details = WebInspector.linkifyResourceAsNode(event.url);
break;
- case recordType.FunctionCall:
- case recordType.JSFrame:
- details = createElement("span");
- details.createTextChild(WebInspector.beautifyFunctionName(eventData["functionName"]));
- var location = linkifyLocation(eventData["scriptId"], eventData["url"], eventData["lineNumber"], eventData["columnNumber"]);
+ case recordType.FunctionCall:
+ case recordType.JSFrame:
+ details = createElement('span');
+ details.createTextChild(WebInspector.beautifyFunctionName(eventData['functionName']));
+ var location = linkifyLocation(
+ eventData['scriptId'], eventData['url'], eventData['lineNumber'], eventData['columnNumber']);
if (location) {
- details.createTextChild(" @ ");
- details.appendChild(location);
+ details.createTextChild(' @ ');
+ details.appendChild(location);
}
break;
- case recordType.CompileScript:
- case recordType.EvaluateScript:
- var url = eventData["url"];
+ case recordType.CompileScript:
+ case recordType.EvaluateScript:
+ var url = eventData['url'];
if (url)
- details = linkifyLocation("", url, eventData["lineNumber"], 0);
+ details = linkifyLocation('', url, eventData['lineNumber'], 0);
break;
- case recordType.ParseScriptOnBackground:
- var url = eventData["url"];
+ case recordType.ParseScriptOnBackground:
+ var url = eventData['url'];
if (url)
- details = linkifyLocation("", url, 0, 0);
+ details = linkifyLocation('', url, 0, 0);
break;
- default:
+ default:
if (event.hasCategory(WebInspector.TimelineModel.Category.Console))
- detailsText = null;
+ detailsText = null;
else
- details = linkifyTopCallFrame();
+ details = linkifyTopCallFrame();
break;
}
if (!details && detailsText)
- details = createTextNode(detailsText);
+ details = createTextNode(detailsText);
return details;
/**
@@ -608,87 +654,82 @@ WebInspector.TimelineUIUtils.buildDetailsNodeForTraceEvent = function(event, tar
* @param {number=} columnNumber
* @return {?Element}
*/
- function linkifyLocation(scriptId, url, lineNumber, columnNumber)
- {
- return linkifier.linkifyScriptLocation(target, scriptId, url, lineNumber, columnNumber, "timeline-details");
+ function linkifyLocation(scriptId, url, lineNumber, columnNumber) {
+ return linkifier.linkifyScriptLocation(target, scriptId, url, lineNumber, columnNumber, 'timeline-details');
}
/**
* @return {?Element}
*/
- function linkifyTopCallFrame()
- {
- var frame = WebInspector.TimelineUIUtils.topStackFrame(event);
- return frame ? linkifier.maybeLinkifyConsoleCallFrame(target, frame, "timeline-details") : null;
+ function linkifyTopCallFrame() {
+ var frame = WebInspector.TimelineUIUtils.topStackFrame(event);
+ return frame ? linkifier.maybeLinkifyConsoleCallFrame(target, frame, 'timeline-details') : null;
}
-};
-
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @param {!WebInspector.TimelineModel} model
- * @param {!WebInspector.Linkifier} linkifier
- * @param {boolean} detailed
- * @param {function(!DocumentFragment)} callback
- */
-WebInspector.TimelineUIUtils.buildTraceEventDetails = function(event, model, linkifier, detailed, callback)
-{
+ }
+
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @param {!WebInspector.TimelineModel} model
+ * @param {!WebInspector.Linkifier} linkifier
+ * @param {boolean} detailed
+ * @param {function(!DocumentFragment)} callback
+ */
+ static buildTraceEventDetails(event, model, linkifier, detailed, callback) {
var target = model.targetByEvent(event);
if (!target) {
- callbackWrapper();
- return;
+ callbackWrapper();
+ return;
}
var relatedNodes = null;
var barrier = new CallbackBarrier();
if (!event.previewElement) {
- if (event.url)
- WebInspector.DOMPresentationUtils.buildImagePreviewContents(target, event.url, false, barrier.createCallback(saveImage));
- else if (event.picture)
- WebInspector.TimelineUIUtils.buildPicturePreviewContent(event, target, barrier.createCallback(saveImage));
+ if (event.url)
+ WebInspector.DOMPresentationUtils.buildImagePreviewContents(
+ target, event.url, false, barrier.createCallback(saveImage));
+ else if (event.picture)
+ WebInspector.TimelineUIUtils.buildPicturePreviewContent(event, target, barrier.createCallback(saveImage));
}
var nodeIdsToResolve = new Set();
if (event.backendNodeId)
- nodeIdsToResolve.add(event.backendNodeId);
+ nodeIdsToResolve.add(event.backendNodeId);
if (event.invalidationTrackingEvents)
- WebInspector.TimelineUIUtils._collectInvalidationNodeIds(nodeIdsToResolve, event.invalidationTrackingEvents);
+ WebInspector.TimelineUIUtils._collectInvalidationNodeIds(nodeIdsToResolve, event.invalidationTrackingEvents);
if (nodeIdsToResolve.size) {
- var domModel = WebInspector.DOMModel.fromTarget(target);
- if (domModel)
- domModel.pushNodesByBackendIdsToFrontend(nodeIdsToResolve, barrier.createCallback(setRelatedNodeMap));
+ var domModel = WebInspector.DOMModel.fromTarget(target);
+ if (domModel)
+ domModel.pushNodesByBackendIdsToFrontend(nodeIdsToResolve, barrier.createCallback(setRelatedNodeMap));
}
barrier.callWhenDone(callbackWrapper);
/**
* @param {!Element=} element
*/
- function saveImage(element)
- {
- event.previewElement = element || null;
+ function saveImage(element) {
+ event.previewElement = element || null;
}
/**
* @param {?Map<number, ?WebInspector.DOMNode>} nodeMap
*/
- function setRelatedNodeMap(nodeMap)
- {
- relatedNodes = nodeMap;
+ function setRelatedNodeMap(nodeMap) {
+ relatedNodes = nodeMap;
}
- function callbackWrapper()
- {
- callback(WebInspector.TimelineUIUtils._buildTraceEventDetailsSynchronously(event, model, linkifier, detailed, relatedNodes));
+ function callbackWrapper() {
+ callback(WebInspector.TimelineUIUtils._buildTraceEventDetailsSynchronously(
+ event, model, linkifier, detailed, relatedNodes));
}
-};
-
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @param {!WebInspector.TimelineModel} model
- * @param {!WebInspector.Linkifier} linkifier
- * @param {boolean} detailed
- * @param {?Map<number, ?WebInspector.DOMNode>} relatedNodesMap
- * @return {!DocumentFragment}
- */
-WebInspector.TimelineUIUtils._buildTraceEventDetailsSynchronously = function(event, model, linkifier, detailed, relatedNodesMap)
-{
+ }
+
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @param {!WebInspector.TimelineModel} model
+ * @param {!WebInspector.Linkifier} linkifier
+ * @param {boolean} detailed
+ * @param {?Map<number, ?WebInspector.DOMNode>} relatedNodesMap
+ * @return {!DocumentFragment}
+ */
+ static _buildTraceEventDetailsSynchronously(event, model, linkifier, detailed, relatedNodesMap) {
var stats = {};
var recordTypes = WebInspector.TimelineModel.RecordType;
@@ -696,194 +737,211 @@ WebInspector.TimelineUIUtils._buildTraceEventDetailsSynchronously = function(eve
var relatedNodeLabel;
var contentHelper = new WebInspector.TimelineDetailsContentHelper(model.targetByEvent(event), linkifier);
- contentHelper.addSection(WebInspector.TimelineUIUtils.eventTitle(event), WebInspector.TimelineUIUtils.eventStyle(event).category);
+ contentHelper.addSection(
+ WebInspector.TimelineUIUtils.eventTitle(event), WebInspector.TimelineUIUtils.eventStyle(event).category);
- var eventData = event.args["data"];
+ var eventData = event.args['data'];
var initiator = event.initiator;
if (event.warning)
- contentHelper.appendWarningRow(event);
- if (event.name === recordTypes.JSFrame && eventData["deoptReason"])
- contentHelper.appendWarningRow(event, WebInspector.TimelineModel.WarningType.V8Deopt);
+ contentHelper.appendWarningRow(event);
+ if (event.name === recordTypes.JSFrame && eventData['deoptReason'])
+ contentHelper.appendWarningRow(event, WebInspector.TimelineModel.WarningType.V8Deopt);
if (detailed) {
- contentHelper.appendTextRow(WebInspector.UIString("Self Time"), Number.millisToString(event.selfTime, true));
- contentHelper.appendTextRow(WebInspector.UIString("Total Time"), Number.millisToString(event.duration || 0, true));
+ contentHelper.appendTextRow(WebInspector.UIString('Self Time'), Number.millisToString(event.selfTime, true));
+ contentHelper.appendTextRow(
+ WebInspector.UIString('Total Time'), Number.millisToString(event.duration || 0, true));
}
switch (event.name) {
- case recordTypes.GCEvent:
- case recordTypes.MajorGC:
- case recordTypes.MinorGC:
- var delta = event.args["usedHeapSizeBefore"] - event.args["usedHeapSizeAfter"];
- contentHelper.appendTextRow(WebInspector.UIString("Collected"), Number.bytesToString(delta));
+ case recordTypes.GCEvent:
+ case recordTypes.MajorGC:
+ case recordTypes.MinorGC:
+ var delta = event.args['usedHeapSizeBefore'] - event.args['usedHeapSizeAfter'];
+ contentHelper.appendTextRow(WebInspector.UIString('Collected'), Number.bytesToString(delta));
break;
- case recordTypes.JSFrame:
- case recordTypes.FunctionCall:
- var detailsNode = WebInspector.TimelineUIUtils.buildDetailsNodeForTraceEvent(event, model.targetByEvent(event), linkifier);
+ case recordTypes.JSFrame:
+ case recordTypes.FunctionCall:
+ var detailsNode =
+ WebInspector.TimelineUIUtils.buildDetailsNodeForTraceEvent(event, model.targetByEvent(event), linkifier);
if (detailsNode)
- contentHelper.appendElementRow(WebInspector.UIString("Function"), detailsNode);
+ contentHelper.appendElementRow(WebInspector.UIString('Function'), detailsNode);
break;
- case recordTypes.TimerFire:
- case recordTypes.TimerInstall:
- case recordTypes.TimerRemove:
- contentHelper.appendTextRow(WebInspector.UIString("Timer ID"), eventData["timerId"]);
+ case recordTypes.TimerFire:
+ case recordTypes.TimerInstall:
+ case recordTypes.TimerRemove:
+ contentHelper.appendTextRow(WebInspector.UIString('Timer ID'), eventData['timerId']);
if (event.name === recordTypes.TimerInstall) {
- contentHelper.appendTextRow(WebInspector.UIString("Timeout"), Number.millisToString(eventData["timeout"]));
- contentHelper.appendTextRow(WebInspector.UIString("Repeats"), !eventData["singleShot"]);
+ contentHelper.appendTextRow(WebInspector.UIString('Timeout'), Number.millisToString(eventData['timeout']));
+ contentHelper.appendTextRow(WebInspector.UIString('Repeats'), !eventData['singleShot']);
}
break;
- case recordTypes.FireAnimationFrame:
- contentHelper.appendTextRow(WebInspector.UIString("Callback ID"), eventData["id"]);
+ case recordTypes.FireAnimationFrame:
+ contentHelper.appendTextRow(WebInspector.UIString('Callback ID'), eventData['id']);
break;
- case recordTypes.ResourceSendRequest:
- case recordTypes.ResourceReceiveResponse:
- case recordTypes.ResourceReceivedData:
- case recordTypes.ResourceFinish:
- var url = (event.name === recordTypes.ResourceSendRequest) ? eventData["url"] : initiator && initiator.args["data"]["url"];
+ case recordTypes.ResourceSendRequest:
+ case recordTypes.ResourceReceiveResponse:
+ case recordTypes.ResourceReceivedData:
+ case recordTypes.ResourceFinish:
+ var url = (event.name === recordTypes.ResourceSendRequest) ? eventData['url'] :
+ initiator && initiator.args['data']['url'];
if (url)
- contentHelper.appendElementRow(WebInspector.UIString("Resource"), WebInspector.linkifyResourceAsNode(url));
- if (eventData["requestMethod"])
- contentHelper.appendTextRow(WebInspector.UIString("Request Method"), eventData["requestMethod"]);
- if (typeof eventData["statusCode"] === "number")
- contentHelper.appendTextRow(WebInspector.UIString("Status Code"), eventData["statusCode"]);
- if (eventData["mimeType"])
- contentHelper.appendTextRow(WebInspector.UIString("MIME Type"), eventData["mimeType"]);
- if ("priority" in eventData) {
- var priority = WebInspector.uiLabelForPriority(eventData["priority"]);
- contentHelper.appendTextRow(WebInspector.UIString("Priority"), priority);
+ contentHelper.appendElementRow(WebInspector.UIString('Resource'), WebInspector.linkifyResourceAsNode(url));
+ if (eventData['requestMethod'])
+ contentHelper.appendTextRow(WebInspector.UIString('Request Method'), eventData['requestMethod']);
+ if (typeof eventData['statusCode'] === 'number')
+ contentHelper.appendTextRow(WebInspector.UIString('Status Code'), eventData['statusCode']);
+ if (eventData['mimeType'])
+ contentHelper.appendTextRow(WebInspector.UIString('MIME Type'), eventData['mimeType']);
+ if ('priority' in eventData) {
+ var priority = WebInspector.uiLabelForPriority(eventData['priority']);
+ contentHelper.appendTextRow(WebInspector.UIString('Priority'), priority);
}
- if (eventData["encodedDataLength"])
- contentHelper.appendTextRow(WebInspector.UIString("Encoded Data Length"), WebInspector.UIString("%d Bytes", eventData["encodedDataLength"]));
+ if (eventData['encodedDataLength'])
+ contentHelper.appendTextRow(
+ WebInspector.UIString('Encoded Data Length'),
+ WebInspector.UIString('%d Bytes', eventData['encodedDataLength']));
break;
- case recordTypes.CompileScript:
- case recordTypes.EvaluateScript:
- var url = eventData && eventData["url"];
+ case recordTypes.CompileScript:
+ case recordTypes.EvaluateScript:
+ var url = eventData && eventData['url'];
if (url)
- contentHelper.appendLocationRow(WebInspector.UIString("Script"), url, eventData["lineNumber"], eventData["columnNumber"]);
+ contentHelper.appendLocationRow(
+ WebInspector.UIString('Script'), url, eventData['lineNumber'], eventData['columnNumber']);
break;
- case recordTypes.Paint:
- var clip = eventData["clip"];
- contentHelper.appendTextRow(WebInspector.UIString("Location"), WebInspector.UIString("(%d, %d)", clip[0], clip[1]));
+ case recordTypes.Paint:
+ var clip = eventData['clip'];
+ contentHelper.appendTextRow(
+ WebInspector.UIString('Location'), WebInspector.UIString('(%d, %d)', clip[0], clip[1]));
var clipWidth = WebInspector.TimelineUIUtils.quadWidth(clip);
var clipHeight = WebInspector.TimelineUIUtils.quadHeight(clip);
- contentHelper.appendTextRow(WebInspector.UIString("Dimensions"), WebInspector.UIString("%d × %d", clipWidth, clipHeight));
- // Fall-through intended.
-
- case recordTypes.PaintSetup:
- case recordTypes.Rasterize:
- case recordTypes.ScrollLayer:
- relatedNodeLabel = WebInspector.UIString("Layer Root");
+ contentHelper.appendTextRow(
+ WebInspector.UIString('Dimensions'), WebInspector.UIString('%d × %d', clipWidth, clipHeight));
+ // Fall-through intended.
+
+ case recordTypes.PaintSetup:
+ case recordTypes.Rasterize:
+ case recordTypes.ScrollLayer:
+ relatedNodeLabel = WebInspector.UIString('Layer Root');
break;
- case recordTypes.PaintImage:
- case recordTypes.DecodeLazyPixelRef:
- case recordTypes.DecodeImage:
- case recordTypes.ResizeImage:
- case recordTypes.DrawLazyPixelRef:
- relatedNodeLabel = WebInspector.UIString("Owner Element");
+ case recordTypes.PaintImage:
+ case recordTypes.DecodeLazyPixelRef:
+ case recordTypes.DecodeImage:
+ case recordTypes.ResizeImage:
+ case recordTypes.DrawLazyPixelRef:
+ relatedNodeLabel = WebInspector.UIString('Owner Element');
if (event.url)
- contentHelper.appendElementRow(WebInspector.UIString("Image URL"), WebInspector.linkifyResourceAsNode(event.url));
+ contentHelper.appendElementRow(
+ WebInspector.UIString('Image URL'), WebInspector.linkifyResourceAsNode(event.url));
break;
- case recordTypes.ParseAuthorStyleSheet:
- var url = eventData["styleSheetUrl"];
+ case recordTypes.ParseAuthorStyleSheet:
+ var url = eventData['styleSheetUrl'];
if (url)
- contentHelper.appendElementRow(WebInspector.UIString("Stylesheet URL"), WebInspector.linkifyResourceAsNode(url));
+ contentHelper.appendElementRow(
+ WebInspector.UIString('Stylesheet URL'), WebInspector.linkifyResourceAsNode(url));
break;
- case recordTypes.UpdateLayoutTree: // We don't want to see default details.
- case recordTypes.RecalculateStyles:
- contentHelper.appendTextRow(WebInspector.UIString("Elements Affected"), event.args["elementCount"]);
+ case recordTypes.UpdateLayoutTree: // We don't want to see default details.
+ case recordTypes.RecalculateStyles:
+ contentHelper.appendTextRow(WebInspector.UIString('Elements Affected'), event.args['elementCount']);
break;
- case recordTypes.Layout:
- var beginData = event.args["beginData"];
- contentHelper.appendTextRow(WebInspector.UIString("Nodes That Need Layout"), WebInspector.UIString("%s of %s", beginData["dirtyObjects"], beginData["totalObjects"]));
- relatedNodeLabel = WebInspector.UIString("Layout root");
+ case recordTypes.Layout:
+ var beginData = event.args['beginData'];
+ contentHelper.appendTextRow(
+ WebInspector.UIString('Nodes That Need Layout'),
+ WebInspector.UIString('%s of %s', beginData['dirtyObjects'], beginData['totalObjects']));
+ relatedNodeLabel = WebInspector.UIString('Layout root');
break;
- case recordTypes.ConsoleTime:
- contentHelper.appendTextRow(WebInspector.UIString("Message"), event.name);
+ case recordTypes.ConsoleTime:
+ contentHelper.appendTextRow(WebInspector.UIString('Message'), event.name);
break;
- case recordTypes.WebSocketCreate:
- case recordTypes.WebSocketSendHandshakeRequest:
- case recordTypes.WebSocketReceiveHandshakeResponse:
- case recordTypes.WebSocketDestroy:
- var initiatorData = initiator ? initiator.args["data"] : eventData;
- if (typeof initiatorData["webSocketURL"] !== "undefined")
- contentHelper.appendTextRow(WebInspector.UIString("URL"), initiatorData["webSocketURL"]);
- if (typeof initiatorData["webSocketProtocol"] !== "undefined")
- contentHelper.appendTextRow(WebInspector.UIString("WebSocket Protocol"), initiatorData["webSocketProtocol"]);
- if (typeof eventData["message"] !== "undefined")
- contentHelper.appendTextRow(WebInspector.UIString("Message"), eventData["message"]);
+ case recordTypes.WebSocketCreate:
+ case recordTypes.WebSocketSendHandshakeRequest:
+ case recordTypes.WebSocketReceiveHandshakeResponse:
+ case recordTypes.WebSocketDestroy:
+ var initiatorData = initiator ? initiator.args['data'] : eventData;
+ if (typeof initiatorData['webSocketURL'] !== 'undefined')
+ contentHelper.appendTextRow(WebInspector.UIString('URL'), initiatorData['webSocketURL']);
+ if (typeof initiatorData['webSocketProtocol'] !== 'undefined')
+ contentHelper.appendTextRow(WebInspector.UIString('WebSocket Protocol'), initiatorData['webSocketProtocol']);
+ if (typeof eventData['message'] !== 'undefined')
+ contentHelper.appendTextRow(WebInspector.UIString('Message'), eventData['message']);
break;
- case recordTypes.EmbedderCallback:
- contentHelper.appendTextRow(WebInspector.UIString("Callback Function"), eventData["callbackName"]);
+ case recordTypes.EmbedderCallback:
+ contentHelper.appendTextRow(WebInspector.UIString('Callback Function'), eventData['callbackName']);
break;
- case recordTypes.Animation:
+ case recordTypes.Animation:
if (event.phase === WebInspector.TracingModel.Phase.NestableAsyncInstant)
- contentHelper.appendTextRow(WebInspector.UIString("State"), eventData["state"]);
+ contentHelper.appendTextRow(WebInspector.UIString('State'), eventData['state']);
break;
- case recordTypes.ParseHTML:
- var beginData = event.args["beginData"];
- var url = beginData["url"];
- var startLine = beginData["startLine"] - 1;
- var endLine = event.args["endData"] ? event.args["endData"]["endLine"] - 1 : undefined;
+ case recordTypes.ParseHTML:
+ var beginData = event.args['beginData'];
+ var url = beginData['url'];
+ var startLine = beginData['startLine'] - 1;
+ var endLine = event.args['endData'] ? event.args['endData']['endLine'] - 1 : undefined;
if (url)
- contentHelper.appendLocationRange(WebInspector.UIString("Range"), url, startLine, endLine);
+ contentHelper.appendLocationRange(WebInspector.UIString('Range'), url, startLine, endLine);
break;
- case recordTypes.FireIdleCallback:
- contentHelper.appendTextRow(WebInspector.UIString("Allotted Time"), Number.millisToString(eventData["allottedMilliseconds"]));
- contentHelper.appendTextRow(WebInspector.UIString("Invoked by Timeout"), eventData["timedOut"]);
- // Fall-through intended.
+ case recordTypes.FireIdleCallback:
+ contentHelper.appendTextRow(
+ WebInspector.UIString('Allotted Time'), Number.millisToString(eventData['allottedMilliseconds']));
+ contentHelper.appendTextRow(WebInspector.UIString('Invoked by Timeout'), eventData['timedOut']);
+ // Fall-through intended.
- case recordTypes.RequestIdleCallback:
- case recordTypes.CancelIdleCallback:
- contentHelper.appendTextRow(WebInspector.UIString("Callback ID"), eventData["id"]);
+ case recordTypes.RequestIdleCallback:
+ case recordTypes.CancelIdleCallback:
+ contentHelper.appendTextRow(WebInspector.UIString('Callback ID'), eventData['id']);
break;
- case recordTypes.EventDispatch:
- contentHelper.appendTextRow(WebInspector.UIString("Type"), eventData["type"]);
+ case recordTypes.EventDispatch:
+ contentHelper.appendTextRow(WebInspector.UIString('Type'), eventData['type']);
break;
- default:
- var detailsNode = WebInspector.TimelineUIUtils.buildDetailsNodeForTraceEvent(event, model.targetByEvent(event), linkifier);
+ default:
+ var detailsNode =
+ WebInspector.TimelineUIUtils.buildDetailsNodeForTraceEvent(event, model.targetByEvent(event), linkifier);
if (detailsNode)
- contentHelper.appendElementRow(WebInspector.UIString("Details"), detailsNode);
+ contentHelper.appendElementRow(WebInspector.UIString('Details'), detailsNode);
break;
}
if (event.timeWaitingForMainThread)
- contentHelper.appendTextRow(WebInspector.UIString("Time Waiting for Main Thread"), Number.millisToString(event.timeWaitingForMainThread, true));
+ contentHelper.appendTextRow(
+ WebInspector.UIString('Time Waiting for Main Thread'),
+ Number.millisToString(event.timeWaitingForMainThread, true));
var relatedNode = relatedNodesMap && relatedNodesMap.get(event.backendNodeId);
if (relatedNode)
- contentHelper.appendElementRow(relatedNodeLabel || WebInspector.UIString("Related Node"), WebInspector.DOMPresentationUtils.linkifyNodeReference(relatedNode));
+ contentHelper.appendElementRow(
+ relatedNodeLabel || WebInspector.UIString('Related Node'),
+ WebInspector.DOMPresentationUtils.linkifyNodeReference(relatedNode));
if (event.previewElement) {
- contentHelper.addSection(WebInspector.UIString("Preview"));
- contentHelper.appendElementRow("", event.previewElement);
+ contentHelper.addSection(WebInspector.UIString('Preview'));
+ contentHelper.appendElementRow('', event.previewElement);
}
if (event.stackTrace || (event.initiator && event.initiator.stackTrace) || event.invalidationTrackingEvents)
- WebInspector.TimelineUIUtils._generateCauses(event, model.targetByEvent(event), relatedNodesMap, contentHelper);
+ WebInspector.TimelineUIUtils._generateCauses(event, model.targetByEvent(event), relatedNodesMap, contentHelper);
var showPieChart = detailed && WebInspector.TimelineUIUtils._aggregatedStatsForTraceEvent(stats, model, event);
if (showPieChart) {
- contentHelper.addSection(WebInspector.UIString("Aggregated Time"));
- var pieChart = WebInspector.TimelineUIUtils.generatePieChart(stats, WebInspector.TimelineUIUtils.eventStyle(event).category, event.selfTime);
- contentHelper.appendElementRow("", pieChart);
+ contentHelper.addSection(WebInspector.UIString('Aggregated Time'));
+ var pieChart = WebInspector.TimelineUIUtils.generatePieChart(
+ stats, WebInspector.TimelineUIUtils.eventStyle(event).category, event.selfTime);
+ contentHelper.appendElementRow('', pieChart);
}
return contentHelper.fragment;
-};
-
-WebInspector.TimelineUIUtils._aggregatedStatsKey = Symbol("aggregatedStats");
-
-/**
- * @param {!WebInspector.TimelineModel} model
- * @param {number} startTime
- * @param {number} endTime
- * @return {!DocumentFragment}
- */
-WebInspector.TimelineUIUtils.buildRangeStats = function(model, startTime, endTime)
-{
+ }
+
+ /**
+ * @param {!WebInspector.TimelineModel} model
+ * @param {number} startTime
+ * @param {number} endTime
+ * @return {!DocumentFragment}
+ */
+ static buildRangeStats(model, startTime, endTime) {
var aggregatedStats = {};
/**
@@ -891,165 +949,159 @@ WebInspector.TimelineUIUtils.buildRangeStats = function(model, startTime, endTim
* @param {!WebInspector.TimelineModel.Record} task
* @return {number}
*/
- function compareEndTime(value, task)
- {
- return value < task.endTime() ? -1 : 1;
+ function compareEndTime(value, task) {
+ return value < task.endTime() ? -1 : 1;
}
var mainThreadTasks = model.mainThreadTasks();
var taskIndex = mainThreadTasks.lowerBound(startTime, compareEndTime);
for (; taskIndex < mainThreadTasks.length; ++taskIndex) {
- var task = mainThreadTasks[taskIndex];
- if (task.startTime() > endTime)
- break;
- if (task.startTime() > startTime && task.endTime() < endTime) {
- // cache stats for top-level entries that fit the range entirely.
- var taskStats = task[WebInspector.TimelineUIUtils._aggregatedStatsKey];
- if (!taskStats) {
- taskStats = {};
- WebInspector.TimelineUIUtils._collectAggregatedStatsForRecord(task, startTime, endTime, taskStats);
- task[WebInspector.TimelineUIUtils._aggregatedStatsKey] = taskStats;
- }
- for (var key in taskStats)
- aggregatedStats[key] = (aggregatedStats[key] || 0) + taskStats[key];
- continue;
+ var task = mainThreadTasks[taskIndex];
+ if (task.startTime() > endTime)
+ break;
+ if (task.startTime() > startTime && task.endTime() < endTime) {
+ // cache stats for top-level entries that fit the range entirely.
+ var taskStats = task[WebInspector.TimelineUIUtils._aggregatedStatsKey];
+ if (!taskStats) {
+ taskStats = {};
+ WebInspector.TimelineUIUtils._collectAggregatedStatsForRecord(task, startTime, endTime, taskStats);
+ task[WebInspector.TimelineUIUtils._aggregatedStatsKey] = taskStats;
}
- WebInspector.TimelineUIUtils._collectAggregatedStatsForRecord(task, startTime, endTime, aggregatedStats);
+ for (var key in taskStats)
+ aggregatedStats[key] = (aggregatedStats[key] || 0) + taskStats[key];
+ continue;
+ }
+ WebInspector.TimelineUIUtils._collectAggregatedStatsForRecord(task, startTime, endTime, aggregatedStats);
}
var aggregatedTotal = 0;
for (var categoryName in aggregatedStats)
- aggregatedTotal += aggregatedStats[categoryName];
- aggregatedStats["idle"] = Math.max(0, endTime - startTime - aggregatedTotal);
+ aggregatedTotal += aggregatedStats[categoryName];
+ aggregatedStats['idle'] = Math.max(0, endTime - startTime - aggregatedTotal);
var startOffset = startTime - model.minimumRecordTime();
var endOffset = endTime - model.minimumRecordTime();
var contentHelper = new WebInspector.TimelineDetailsContentHelper(null, null);
- contentHelper.addSection(WebInspector.UIString("Range: %s \u2013 %s", Number.millisToString(startOffset), Number.millisToString(endOffset)));
+ contentHelper.addSection(WebInspector.UIString(
+ 'Range: %s \u2013 %s', Number.millisToString(startOffset), Number.millisToString(endOffset)));
var pieChart = WebInspector.TimelineUIUtils.generatePieChart(aggregatedStats);
- contentHelper.appendElementRow("", pieChart);
+ contentHelper.appendElementRow('', pieChart);
return contentHelper.fragment;
-};
-
-/**
- * @param {!WebInspector.TimelineModel.Record} record
- * @param {number} startTime
- * @param {number} endTime
- * @param {!Object} aggregatedStats
- */
-WebInspector.TimelineUIUtils._collectAggregatedStatsForRecord = function(record, startTime, endTime, aggregatedStats)
-{
+ }
+
+ /**
+ * @param {!WebInspector.TimelineModel.Record} record
+ * @param {number} startTime
+ * @param {number} endTime
+ * @param {!Object} aggregatedStats
+ */
+ static _collectAggregatedStatsForRecord(record, startTime, endTime, aggregatedStats) {
var records = [];
if (!record.endTime() || record.endTime() < startTime || record.startTime() > endTime)
- return;
+ return;
var childrenTime = 0;
var children = record.children() || [];
for (var i = 0; i < children.length; ++i) {
- var child = children[i];
- if (!child.endTime() || child.endTime() < startTime || child.startTime() > endTime)
- continue;
- childrenTime += Math.min(endTime, child.endTime()) - Math.max(startTime, child.startTime());
- WebInspector.TimelineUIUtils._collectAggregatedStatsForRecord(child, startTime, endTime, aggregatedStats);
+ var child = children[i];
+ if (!child.endTime() || child.endTime() < startTime || child.startTime() > endTime)
+ continue;
+ childrenTime += Math.min(endTime, child.endTime()) - Math.max(startTime, child.startTime());
+ WebInspector.TimelineUIUtils._collectAggregatedStatsForRecord(child, startTime, endTime, aggregatedStats);
}
var categoryName = WebInspector.TimelineUIUtils.categoryForRecord(record).name;
var ownTime = Math.min(endTime, record.endTime()) - Math.max(startTime, record.startTime()) - childrenTime;
aggregatedStats[categoryName] = (aggregatedStats[categoryName] || 0) + ownTime;
-};
-
-/**
- * @param {!WebInspector.TimelineModel.NetworkRequest} request
- * @param {!WebInspector.TimelineModel} model
- * @param {!WebInspector.Linkifier} linkifier
- * @return {!Promise<!DocumentFragment>}
- */
-WebInspector.TimelineUIUtils.buildNetworkRequestDetails = function(request, model, linkifier)
-{
+ }
+
+ /**
+ * @param {!WebInspector.TimelineModel.NetworkRequest} request
+ * @param {!WebInspector.TimelineModel} model
+ * @param {!WebInspector.Linkifier} linkifier
+ * @return {!Promise<!DocumentFragment>}
+ */
+ static buildNetworkRequestDetails(request, model, linkifier) {
var target = model.targetByEvent(request.children[0]);
var contentHelper = new WebInspector.TimelineDetailsContentHelper(target, linkifier);
var duration = request.endTime - (request.startTime || -Infinity);
var items = [];
if (request.url)
- contentHelper.appendElementRow(WebInspector.UIString("URL"), WebInspector.linkifyURLAsNode(request.url));
+ contentHelper.appendElementRow(WebInspector.UIString('URL'), WebInspector.linkifyURLAsNode(request.url));
if (isFinite(duration))
- contentHelper.appendTextRow(WebInspector.UIString("Duration"), Number.millisToString(duration, true));
+ contentHelper.appendTextRow(WebInspector.UIString('Duration'), Number.millisToString(duration, true));
if (request.requestMethod)
- contentHelper.appendTextRow(WebInspector.UIString("Request Method"), request.requestMethod);
- if (typeof request.priority === "string") {
- var priority = WebInspector.uiLabelForPriority(/** @type {!NetworkAgent.ResourcePriority} */ (request.priority));
- contentHelper.appendTextRow(WebInspector.UIString("Priority"), priority);
+ contentHelper.appendTextRow(WebInspector.UIString('Request Method'), request.requestMethod);
+ if (typeof request.priority === 'string') {
+ var priority = WebInspector.uiLabelForPriority(/** @type {!NetworkAgent.ResourcePriority} */ (request.priority));
+ contentHelper.appendTextRow(WebInspector.UIString('Priority'), priority);
}
if (request.mimeType)
- contentHelper.appendTextRow(WebInspector.UIString("Mime Type"), request.mimeType);
+ contentHelper.appendTextRow(WebInspector.UIString('Mime Type'), request.mimeType);
- var title = WebInspector.UIString("Initiator");
+ var title = WebInspector.UIString('Initiator');
var sendRequest = request.children[0];
var topFrame = WebInspector.TimelineUIUtils.topStackFrame(sendRequest);
if (topFrame) {
- var link = linkifier.maybeLinkifyConsoleCallFrame(target, topFrame);
- if (link)
- contentHelper.appendElementRow(title, link);
+ var link = linkifier.maybeLinkifyConsoleCallFrame(target, topFrame);
+ if (link)
+ contentHelper.appendElementRow(title, link);
} else if (sendRequest.initiator) {
- var initiatorURL = WebInspector.TimelineUIUtils.eventURL(sendRequest.initiator);
- if (initiatorURL) {
- var link = linkifier.maybeLinkifyScriptLocation(target, null, initiatorURL, 0);
- if (link)
- contentHelper.appendElementRow(title, link);
- }
+ var initiatorURL = WebInspector.TimelineUIUtils.eventURL(sendRequest.initiator);
+ if (initiatorURL) {
+ var link = linkifier.maybeLinkifyScriptLocation(target, null, initiatorURL, 0);
+ if (link)
+ contentHelper.appendElementRow(title, link);
+ }
}
/**
* @param {function(?Element)} fulfill
*/
- function action(fulfill)
- {
- WebInspector.DOMPresentationUtils.buildImagePreviewContents(/** @type {!WebInspector.Target} */(target), request.url, false, saveImage);
- /**
- * @param {!Element=} element
- */
- function saveImage(element)
- {
- request.previewElement = element || null;
- fulfill(request.previewElement);
- }
+ function action(fulfill) {
+ WebInspector.DOMPresentationUtils.buildImagePreviewContents(
+ /** @type {!WebInspector.Target} */ (target), request.url, false, saveImage);
+ /**
+ * @param {!Element=} element
+ */
+ function saveImage(element) {
+ request.previewElement = element || null;
+ fulfill(request.previewElement);
+ }
}
var previewPromise;
if (request.previewElement)
- previewPromise = Promise.resolve(request.previewElement);
+ previewPromise = Promise.resolve(request.previewElement);
else
- previewPromise = request.url && target ? new Promise(action) : Promise.resolve(null);
+ previewPromise = request.url && target ? new Promise(action) : Promise.resolve(null);
/**
* @param {?Element} element
* @return {!DocumentFragment}
*/
- function appendPreview(element)
- {
- if (element)
- contentHelper.appendElementRow(WebInspector.UIString("Preview"), request.previewElement);
- return contentHelper.fragment;
+ function appendPreview(element) {
+ if (element)
+ contentHelper.appendElementRow(WebInspector.UIString('Preview'), request.previewElement);
+ return contentHelper.fragment;
}
return previewPromise.then(appendPreview);
-};
-
-/**
- * @param {!Array<!RuntimeAgent.CallFrame>} callFrames
- * @return {!RuntimeAgent.StackTrace}
- */
-WebInspector.TimelineUIUtils._stackTraceFromCallFrames = function(callFrames)
-{
- return /** @type {!RuntimeAgent.StackTrace} */ ({ callFrames: callFrames });
-};
-
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @param {?WebInspector.Target} target
- * @param {?Map<number, ?WebInspector.DOMNode>} relatedNodesMap
- * @param {!WebInspector.TimelineDetailsContentHelper} contentHelper
- */
-WebInspector.TimelineUIUtils._generateCauses = function(event, target, relatedNodesMap, contentHelper)
-{
+ }
+
+ /**
+ * @param {!Array<!RuntimeAgent.CallFrame>} callFrames
+ * @return {!RuntimeAgent.StackTrace}
+ */
+ static _stackTraceFromCallFrames(callFrames) {
+ return /** @type {!RuntimeAgent.StackTrace} */ ({callFrames: callFrames});
+ }
+
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @param {?WebInspector.Target} target
+ * @param {?Map<number, ?WebInspector.DOMNode>} relatedNodesMap
+ * @param {!WebInspector.TimelineDetailsContentHelper} contentHelper
+ */
+ static _generateCauses(event, target, relatedNodesMap, contentHelper) {
var recordTypes = WebInspector.TimelineModel.RecordType;
var callSiteStackLabel;
@@ -1057,95 +1109,98 @@ WebInspector.TimelineUIUtils._generateCauses = function(event, target, relatedNo
var initiator = event.initiator;
switch (event.name) {
- case recordTypes.TimerFire:
- callSiteStackLabel = WebInspector.UIString("Timer Installed");
+ case recordTypes.TimerFire:
+ callSiteStackLabel = WebInspector.UIString('Timer Installed');
break;
- case recordTypes.FireAnimationFrame:
- callSiteStackLabel = WebInspector.UIString("Animation Frame Requested");
+ case recordTypes.FireAnimationFrame:
+ callSiteStackLabel = WebInspector.UIString('Animation Frame Requested');
break;
- case recordTypes.FireIdleCallback:
- callSiteStackLabel = WebInspector.UIString("Idle Callback Requested");
+ case recordTypes.FireIdleCallback:
+ callSiteStackLabel = WebInspector.UIString('Idle Callback Requested');
break;
- case recordTypes.UpdateLayoutTree:
- case recordTypes.RecalculateStyles:
- stackLabel = WebInspector.UIString("Recalculation Forced");
+ case recordTypes.UpdateLayoutTree:
+ case recordTypes.RecalculateStyles:
+ stackLabel = WebInspector.UIString('Recalculation Forced');
break;
- case recordTypes.Layout:
- callSiteStackLabel = WebInspector.UIString("First Layout Invalidation");
- stackLabel = WebInspector.UIString("Layout Forced");
+ case recordTypes.Layout:
+ callSiteStackLabel = WebInspector.UIString('First Layout Invalidation');
+ stackLabel = WebInspector.UIString('Layout Forced');
break;
}
// Direct cause.
if (event.stackTrace && event.stackTrace.length) {
- contentHelper.addSection(WebInspector.UIString("Call Stacks"));
- contentHelper.appendStackTrace(stackLabel || WebInspector.UIString("Stack Trace"), WebInspector.TimelineUIUtils._stackTraceFromCallFrames(event.stackTrace));
+ contentHelper.addSection(WebInspector.UIString('Call Stacks'));
+ contentHelper.appendStackTrace(
+ stackLabel || WebInspector.UIString('Stack Trace'),
+ WebInspector.TimelineUIUtils._stackTraceFromCallFrames(event.stackTrace));
}
// Indirect causes.
- if (event.invalidationTrackingEvents && target) { // Full invalidation tracking (experimental).
- contentHelper.addSection(WebInspector.UIString("Invalidations"));
- WebInspector.TimelineUIUtils._generateInvalidations(event, target, relatedNodesMap, contentHelper);
- } else if (initiator && initiator.stackTrace) { // Partial invalidation tracking.
- contentHelper.appendStackTrace(callSiteStackLabel || WebInspector.UIString("First Invalidated"), WebInspector.TimelineUIUtils._stackTraceFromCallFrames(initiator.stackTrace));
+ if (event.invalidationTrackingEvents && target) { // Full invalidation tracking (experimental).
+ contentHelper.addSection(WebInspector.UIString('Invalidations'));
+ WebInspector.TimelineUIUtils._generateInvalidations(event, target, relatedNodesMap, contentHelper);
+ } else if (initiator && initiator.stackTrace) { // Partial invalidation tracking.
+ contentHelper.appendStackTrace(
+ callSiteStackLabel || WebInspector.UIString('First Invalidated'),
+ WebInspector.TimelineUIUtils._stackTraceFromCallFrames(initiator.stackTrace));
}
-};
-
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @param {!WebInspector.Target} target
- * @param {?Map<number, ?WebInspector.DOMNode>} relatedNodesMap
- * @param {!WebInspector.TimelineDetailsContentHelper} contentHelper
- */
-WebInspector.TimelineUIUtils._generateInvalidations = function(event, target, relatedNodesMap, contentHelper)
-{
+ }
+
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @param {!WebInspector.Target} target
+ * @param {?Map<number, ?WebInspector.DOMNode>} relatedNodesMap
+ * @param {!WebInspector.TimelineDetailsContentHelper} contentHelper
+ */
+ static _generateInvalidations(event, target, relatedNodesMap, contentHelper) {
if (!event.invalidationTrackingEvents)
- return;
+ return;
var invalidations = {};
event.invalidationTrackingEvents.forEach(function(invalidation) {
- if (!invalidations[invalidation.type])
- invalidations[invalidation.type] = [invalidation];
- else
- invalidations[invalidation.type].push(invalidation);
+ if (!invalidations[invalidation.type])
+ invalidations[invalidation.type] = [invalidation];
+ else
+ invalidations[invalidation.type].push(invalidation);
});
Object.keys(invalidations).forEach(function(type) {
- WebInspector.TimelineUIUtils._generateInvalidationsForType(
- type, target, invalidations[type], relatedNodesMap, contentHelper);
+ WebInspector.TimelineUIUtils._generateInvalidationsForType(
+ type, target, invalidations[type], relatedNodesMap, contentHelper);
});
-};
-
-/**
- * @param {string} type
- * @param {!WebInspector.Target} target
- * @param {!Array.<!WebInspector.InvalidationTrackingEvent>} invalidations
- * @param {?Map<number, ?WebInspector.DOMNode>} relatedNodesMap
- * @param {!WebInspector.TimelineDetailsContentHelper} contentHelper
- */
-WebInspector.TimelineUIUtils._generateInvalidationsForType = function(type, target, invalidations, relatedNodesMap, contentHelper)
-{
+ }
+
+ /**
+ * @param {string} type
+ * @param {!WebInspector.Target} target
+ * @param {!Array.<!WebInspector.InvalidationTrackingEvent>} invalidations
+ * @param {?Map<number, ?WebInspector.DOMNode>} relatedNodesMap
+ * @param {!WebInspector.TimelineDetailsContentHelper} contentHelper
+ */
+ static _generateInvalidationsForType(type, target, invalidations, relatedNodesMap, contentHelper) {
var title;
switch (type) {
- case WebInspector.TimelineModel.RecordType.StyleRecalcInvalidationTracking:
- title = WebInspector.UIString("Style Invalidations");
+ case WebInspector.TimelineModel.RecordType.StyleRecalcInvalidationTracking:
+ title = WebInspector.UIString('Style Invalidations');
break;
- case WebInspector.TimelineModel.RecordType.LayoutInvalidationTracking:
- title = WebInspector.UIString("Layout Invalidations");
+ case WebInspector.TimelineModel.RecordType.LayoutInvalidationTracking:
+ title = WebInspector.UIString('Layout Invalidations');
break;
- default:
- title = WebInspector.UIString("Other Invalidations");
+ default:
+ title = WebInspector.UIString('Other Invalidations');
break;
}
var invalidationsTreeOutline = new TreeOutlineInShadow();
- invalidationsTreeOutline.registerRequiredCSS("timeline/invalidationsTree.css");
- invalidationsTreeOutline.element.classList.add("invalidations-tree");
+ invalidationsTreeOutline.registerRequiredCSS('timeline/invalidationsTree.css');
+ invalidationsTreeOutline.element.classList.add('invalidations-tree');
var invalidationGroups = groupInvalidationsByCause(invalidations);
invalidationGroups.forEach(function(group) {
- var groupElement = new WebInspector.TimelineUIUtils.InvalidationsGroupElement(target, relatedNodesMap, contentHelper, group);
- invalidationsTreeOutline.appendChild(groupElement);
+ var groupElement =
+ new WebInspector.TimelineUIUtils.InvalidationsGroupElement(target, relatedNodesMap, contentHelper, group);
+ invalidationsTreeOutline.appendChild(groupElement);
});
contentHelper.appendElementRow(title, invalidationsTreeOutline.element, false, true);
@@ -1153,421 +1208,259 @@ WebInspector.TimelineUIUtils._generateInvalidationsForType = function(type, targ
* @param {!Array<!WebInspector.InvalidationTrackingEvent>} invalidations
* @return {!Array<!Array<!WebInspector.InvalidationTrackingEvent>>}
*/
- function groupInvalidationsByCause(invalidations)
- {
- /** @type {!Map<string, !Array<!WebInspector.InvalidationTrackingEvent>>} */
- var causeToInvalidationMap = new Map();
- for (var index = 0; index < invalidations.length; index++) {
- var invalidation = invalidations[index];
- var causeKey = "";
- if (invalidation.cause.reason)
- causeKey += invalidation.cause.reason + ".";
- if (invalidation.cause.stackTrace) {
- invalidation.cause.stackTrace.forEach(function(stackFrame) {
- causeKey += stackFrame["functionName"] + ".";
- causeKey += stackFrame["scriptId"] + ".";
- causeKey += stackFrame["url"] + ".";
- causeKey += stackFrame["lineNumber"] + ".";
- causeKey += stackFrame["columnNumber"] + ".";
- });
- }
-
- if (causeToInvalidationMap.has(causeKey))
- causeToInvalidationMap.get(causeKey).push(invalidation);
- else
- causeToInvalidationMap.set(causeKey, [ invalidation ]);
+ function groupInvalidationsByCause(invalidations) {
+ /** @type {!Map<string, !Array<!WebInspector.InvalidationTrackingEvent>>} */
+ var causeToInvalidationMap = new Map();
+ for (var index = 0; index < invalidations.length; index++) {
+ var invalidation = invalidations[index];
+ var causeKey = '';
+ if (invalidation.cause.reason)
+ causeKey += invalidation.cause.reason + '.';
+ if (invalidation.cause.stackTrace) {
+ invalidation.cause.stackTrace.forEach(function(stackFrame) {
+ causeKey += stackFrame['functionName'] + '.';
+ causeKey += stackFrame['scriptId'] + '.';
+ causeKey += stackFrame['url'] + '.';
+ causeKey += stackFrame['lineNumber'] + '.';
+ causeKey += stackFrame['columnNumber'] + '.';
+ });
}
- return causeToInvalidationMap.valuesArray();
+
+ if (causeToInvalidationMap.has(causeKey))
+ causeToInvalidationMap.get(causeKey).push(invalidation);
+ else
+ causeToInvalidationMap.set(causeKey, [invalidation]);
+ }
+ return causeToInvalidationMap.valuesArray();
}
-};
+ }
-/**
- * @param {!Set<number>} nodeIds
- * @param {!WebInspector.InvalidationTrackingEvent} invalidations
- */
-WebInspector.TimelineUIUtils._collectInvalidationNodeIds = function(nodeIds, invalidations)
-{
+ /**
+ * @param {!Set<number>} nodeIds
+ * @param {!WebInspector.InvalidationTrackingEvent} invalidations
+ */
+ static _collectInvalidationNodeIds(nodeIds, invalidations) {
for (var i = 0; i < invalidations.length; ++i) {
- if (invalidations[i].nodeId)
- nodeIds.add(invalidations[i].nodeId);
+ if (invalidations[i].nodeId)
+ nodeIds.add(invalidations[i].nodeId);
}
-};
-
-/**
- * @constructor
- * @param {!WebInspector.Target} target
- * @param {?Map<number, ?WebInspector.DOMNode>} relatedNodesMap
- * @param {!WebInspector.TimelineDetailsContentHelper} contentHelper
- * @param {!Array.<!WebInspector.InvalidationTrackingEvent>} invalidations
- * @extends {TreeElement}
- */
-WebInspector.TimelineUIUtils.InvalidationsGroupElement = function(target, relatedNodesMap, contentHelper, invalidations)
-{
- TreeElement.call(this, "", true);
-
- this.listItemElement.classList.add("header");
- this.selectable = false;
- this.toggleOnClick = true;
-
- this._relatedNodesMap = relatedNodesMap;
- this._contentHelper = contentHelper;
- this._invalidations = invalidations;
- this.title = this._createTitle(target);
-};
-
-WebInspector.TimelineUIUtils.InvalidationsGroupElement.prototype = {
-
- /**
- * @param {!WebInspector.Target} target
- * @return {!Element}
- */
- _createTitle: function(target)
- {
- var first = this._invalidations[0];
- var reason = first.cause.reason;
- var topFrame = first.cause.stackTrace && first.cause.stackTrace[0];
-
- var title = createElement("span");
- if (reason)
- title.createTextChild(WebInspector.UIString("%s for ", reason));
- else
- title.createTextChild(WebInspector.UIString("Unknown cause for "));
-
- this._appendTruncatedNodeList(title, this._invalidations);
-
- if (topFrame && this._contentHelper.linkifier()) {
- title.createTextChild(WebInspector.UIString(". "));
- var stack = title.createChild("span", "monospace");
- stack.createChild("span").textContent = WebInspector.beautifyFunctionName(topFrame.functionName);
- var link = this._contentHelper.linkifier().maybeLinkifyConsoleCallFrame(target, topFrame);
- if (link) {
- stack.createChild("span").textContent = " @ ";
- stack.createChild("span").appendChild(link);
- }
- }
-
- return title;
- },
-
- /**
- * @override
- */
- onpopulate: function()
- {
- var content = createElementWithClass("div", "content");
-
- var first = this._invalidations[0];
- if (first.cause.stackTrace) {
- var stack = content.createChild("div");
- stack.createTextChild(WebInspector.UIString("Stack trace:"));
- this._contentHelper.createChildStackTraceElement(stack, WebInspector.TimelineUIUtils._stackTraceFromCallFrames(first.cause.stackTrace));
- }
-
- content.createTextChild(this._invalidations.length > 1 ? WebInspector.UIString("Nodes:") : WebInspector.UIString("Node:"));
- var nodeList = content.createChild("div", "node-list");
- var firstNode = true;
- for (var i = 0; i < this._invalidations.length; i++) {
- var invalidation = this._invalidations[i];
- var invalidationNode = this._createInvalidationNode(invalidation, true);
- if (invalidationNode) {
- if (!firstNode)
- nodeList.createTextChild(WebInspector.UIString(", "));
- firstNode = false;
-
- nodeList.appendChild(invalidationNode);
-
- var extraData = invalidation.extraData ? ", " + invalidation.extraData : "";
- if (invalidation.changedId)
- nodeList.createTextChild(WebInspector.UIString("(changed id to \"%s\"%s)", invalidation.changedId, extraData));
- else if (invalidation.changedClass)
- nodeList.createTextChild(WebInspector.UIString("(changed class to \"%s\"%s)", invalidation.changedClass, extraData));
- else if (invalidation.changedAttribute)
- nodeList.createTextChild(WebInspector.UIString("(changed attribute to \"%s\"%s)", invalidation.changedAttribute, extraData));
- else if (invalidation.changedPseudo)
- nodeList.createTextChild(WebInspector.UIString("(changed pesudo to \"%s\"%s)", invalidation.changedPseudo, extraData));
- else if (invalidation.selectorPart)
- nodeList.createTextChild(WebInspector.UIString("(changed \"%s\"%s)", invalidation.selectorPart, extraData));
- }
- }
-
- var contentTreeElement = new TreeElement(content, false);
- contentTreeElement.selectable = false;
- this.appendChild(contentTreeElement);
- },
-
- /**
- * @param {!Element} parentElement
- * @param {!Array.<!WebInspector.InvalidationTrackingEvent>} invalidations
- */
- _appendTruncatedNodeList: function(parentElement, invalidations)
- {
- var invalidationNodes = [];
- var invalidationNodeIdMap = {};
- for (var i = 0; i < invalidations.length; i++) {
- var invalidation = invalidations[i];
- var invalidationNode = this._createInvalidationNode(invalidation, false);
- invalidationNode.addEventListener("click", (e) => e.consume(), false);
- if (invalidationNode && !invalidationNodeIdMap[invalidation.nodeId]) {
- invalidationNodes.push(invalidationNode);
- invalidationNodeIdMap[invalidation.nodeId] = true;
- }
- }
-
- if (invalidationNodes.length === 1) {
- parentElement.appendChild(invalidationNodes[0]);
- } else if (invalidationNodes.length === 2) {
- parentElement.appendChild(invalidationNodes[0]);
- parentElement.createTextChild(WebInspector.UIString(" and "));
- parentElement.appendChild(invalidationNodes[1]);
- } else if (invalidationNodes.length >= 3) {
- parentElement.appendChild(invalidationNodes[0]);
- parentElement.createTextChild(WebInspector.UIString(", "));
- parentElement.appendChild(invalidationNodes[1]);
- parentElement.createTextChild(WebInspector.UIString(", and %s others", invalidationNodes.length - 2));
- }
- },
-
- /**
- * @param {!WebInspector.InvalidationTrackingEvent} invalidation
- * @param {boolean} showUnknownNodes
- */
- _createInvalidationNode: function(invalidation, showUnknownNodes)
- {
- var node = (invalidation.nodeId && this._relatedNodesMap) ? this._relatedNodesMap.get(invalidation.nodeId) : null;
- if (node)
- return WebInspector.DOMPresentationUtils.linkifyNodeReference(node);
- if (invalidation.nodeName) {
- var nodeSpan = createElement("span");
- nodeSpan.textContent = WebInspector.UIString("[ %s ]", invalidation.nodeName);
- return nodeSpan;
- }
- if (showUnknownNodes) {
- var nodeSpan = createElement("span");
- return nodeSpan.createTextChild(WebInspector.UIString("[ unknown node ]"));
- }
- },
-
- __proto__: TreeElement.prototype
-};
-
-/**
- * @param {!Object} total
- * @param {!WebInspector.TimelineModel} model
- * @param {!WebInspector.TracingModel.Event} event
- * @return {boolean}
- */
-WebInspector.TimelineUIUtils._aggregatedStatsForTraceEvent = function(total, model, event)
-{
+ }
+
+ /**
+ * @param {!Object} total
+ * @param {!WebInspector.TimelineModel} model
+ * @param {!WebInspector.TracingModel.Event} event
+ * @return {boolean}
+ */
+ static _aggregatedStatsForTraceEvent(total, model, event) {
var events = model.inspectedTargetEvents();
/**
* @param {number} startTime
* @param {!WebInspector.TracingModel.Event} e
* @return {number}
*/
- function eventComparator(startTime, e)
- {
- return startTime - e.startTime;
+ function eventComparator(startTime, e) {
+ return startTime - e.startTime;
}
var index = events.binaryIndexOf(event.startTime, eventComparator);
// Not a main thread event?
if (index < 0)
- return false;
+ return false;
var hasChildren = false;
var endTime = event.endTime;
if (endTime) {
- for (var i = index; i < events.length; i++) {
- var nextEvent = events[i];
- if (nextEvent.startTime >= endTime)
- break;
- if (!nextEvent.selfTime)
- continue;
- if (nextEvent.thread !== event.thread)
- continue;
- if (i > index)
- hasChildren = true;
- var categoryName = WebInspector.TimelineUIUtils.eventStyle(nextEvent).category.name;
- total[categoryName] = (total[categoryName] || 0) + nextEvent.selfTime;
- }
+ for (var i = index; i < events.length; i++) {
+ var nextEvent = events[i];
+ if (nextEvent.startTime >= endTime)
+ break;
+ if (!nextEvent.selfTime)
+ continue;
+ if (nextEvent.thread !== event.thread)
+ continue;
+ if (i > index)
+ hasChildren = true;
+ var categoryName = WebInspector.TimelineUIUtils.eventStyle(nextEvent).category.name;
+ total[categoryName] = (total[categoryName] || 0) + nextEvent.selfTime;
+ }
}
if (WebInspector.TracingModel.isAsyncPhase(event.phase)) {
- if (event.endTime) {
- var aggregatedTotal = 0;
- for (var categoryName in total)
- aggregatedTotal += total[categoryName];
- total["idle"] = Math.max(0, event.endTime - event.startTime - aggregatedTotal);
- }
- return false;
+ if (event.endTime) {
+ var aggregatedTotal = 0;
+ for (var categoryName in total)
+ aggregatedTotal += total[categoryName];
+ total['idle'] = Math.max(0, event.endTime - event.startTime - aggregatedTotal);
+ }
+ return false;
}
return hasChildren;
-};
-
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @param {!WebInspector.Target} target
- * @param {function(!Element=)} callback
- */
-WebInspector.TimelineUIUtils.buildPicturePreviewContent = function(event, target, callback)
-{
+ }
+
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @param {!WebInspector.Target} target
+ * @param {function(!Element=)} callback
+ */
+ static buildPicturePreviewContent(event, target, callback) {
new WebInspector.LayerPaintEvent(event, target).snapshotPromise().then(onSnapshotLoaded);
/**
* @param {?WebInspector.SnapshotWithRect} snapshotWithRect
*/
- function onSnapshotLoaded(snapshotWithRect)
- {
- if (!snapshotWithRect) {
- callback();
- return;
- }
- snapshotWithRect.snapshot.replay(null, null, 1).then(imageURL => onGotImage(imageURL));
- snapshotWithRect.snapshot.release();
+ function onSnapshotLoaded(snapshotWithRect) {
+ if (!snapshotWithRect) {
+ callback();
+ return;
+ }
+ snapshotWithRect.snapshot.replay(null, null, 1).then(imageURL => onGotImage(imageURL));
+ snapshotWithRect.snapshot.release();
}
/**
* @param {?string} imageURL
*/
- function onGotImage(imageURL)
- {
- if (!imageURL) {
- callback();
- return;
- }
- var container = createElement("div");
- container.classList.add("image-preview-container", "vbox", "link");
- var img = container.createChild("img");
- img.src = imageURL;
- var paintProfilerButton = container.createChild("a");
- paintProfilerButton.textContent = WebInspector.UIString("Paint Profiler");
- container.addEventListener("click", showPaintProfiler, false);
- callback(container);
+ function onGotImage(imageURL) {
+ if (!imageURL) {
+ callback();
+ return;
+ }
+ var container = createElement('div');
+ container.classList.add('image-preview-container', 'vbox', 'link');
+ var img = container.createChild('img');
+ img.src = imageURL;
+ var paintProfilerButton = container.createChild('a');
+ paintProfilerButton.textContent = WebInspector.UIString('Paint Profiler');
+ container.addEventListener('click', showPaintProfiler, false);
+ callback(container);
}
- function showPaintProfiler()
- {
- WebInspector.TimelinePanel.instance().select(WebInspector.TimelineSelection.fromTraceEvent(event), WebInspector.TimelinePanel.DetailsTab.PaintProfiler);
+ function showPaintProfiler() {
+ WebInspector.TimelinePanel.instance().select(
+ WebInspector.TimelineSelection.fromTraceEvent(event), WebInspector.TimelinePanel.DetailsTab.PaintProfiler);
}
-};
-
-/**
- * @param {!WebInspector.TimelineModel.RecordType} recordType
- * @param {?string} title
- * @param {number} position
- * @return {!Element}
- */
-WebInspector.TimelineUIUtils.createEventDivider = function(recordType, title, position)
-{
- var eventDivider = createElement("div");
- eventDivider.className = "resources-event-divider";
+ }
+
+ /**
+ * @param {!WebInspector.TimelineModel.RecordType} recordType
+ * @param {?string} title
+ * @param {number} position
+ * @return {!Element}
+ */
+ static createEventDivider(recordType, title, position) {
+ var eventDivider = createElement('div');
+ eventDivider.className = 'resources-event-divider';
var recordTypes = WebInspector.TimelineModel.RecordType;
if (recordType === recordTypes.MarkDOMContent)
- eventDivider.className += " resources-blue-divider";
+ eventDivider.className += ' resources-blue-divider';
else if (recordType === recordTypes.MarkLoad)
- eventDivider.className += " resources-red-divider";
+ eventDivider.className += ' resources-red-divider';
else if (recordType === recordTypes.MarkFirstPaint)
- eventDivider.className += " resources-green-divider";
- else if (recordType === recordTypes.TimeStamp || recordType === recordTypes.ConsoleTime || recordType === recordTypes.UserTiming)
- eventDivider.className += " resources-orange-divider";
+ eventDivider.className += ' resources-green-divider';
+ else if (
+ recordType === recordTypes.TimeStamp || recordType === recordTypes.ConsoleTime ||
+ recordType === recordTypes.UserTiming)
+ eventDivider.className += ' resources-orange-divider';
else if (recordType === recordTypes.BeginFrame)
- eventDivider.className += " timeline-frame-divider";
+ eventDivider.className += ' timeline-frame-divider';
if (title)
- eventDivider.title = title;
- eventDivider.style.left = position + "px";
+ eventDivider.title = title;
+ eventDivider.style.left = position + 'px';
return eventDivider;
-};
-
-/**
- * @param {!WebInspector.TimelineModel.Record} record
- * @param {number} zeroTime
- * @param {number} position
- * @return {!Element}
- */
-WebInspector.TimelineUIUtils.createDividerForRecord = function(record, zeroTime, position)
-{
+ }
+
+ /**
+ * @param {!WebInspector.TimelineModel.Record} record
+ * @param {number} zeroTime
+ * @param {number} position
+ * @return {!Element}
+ */
+ static createDividerForRecord(record, zeroTime, position) {
var startTime = Number.millisToString(record.startTime() - zeroTime);
- var title = WebInspector.UIString("%s at %s", WebInspector.TimelineUIUtils.eventTitle(record.traceEvent()), startTime);
+ var title =
+ WebInspector.UIString('%s at %s', WebInspector.TimelineUIUtils.eventTitle(record.traceEvent()), startTime);
return WebInspector.TimelineUIUtils.createEventDivider(record.type(), title, position);
-};
+ }
-/**
- * @return {!Array.<string>}
- */
-WebInspector.TimelineUIUtils._visibleTypes = function()
-{
+ /**
+ * @return {!Array.<string>}
+ */
+ static _visibleTypes() {
var eventStyles = WebInspector.TimelineUIUtils._initEventStyles();
var result = [];
for (var name in eventStyles) {
- if (!eventStyles[name].hidden)
- result.push(name);
+ if (!eventStyles[name].hidden)
+ result.push(name);
}
return result;
-};
+ }
-/**
- * @return {!WebInspector.TimelineModel.Filter}
- */
-WebInspector.TimelineUIUtils.visibleEventsFilter = function()
-{
+ /**
+ * @return {!WebInspector.TimelineModel.Filter}
+ */
+ static visibleEventsFilter() {
return new WebInspector.TimelineVisibleEventsFilter(WebInspector.TimelineUIUtils._visibleTypes());
-};
+ }
-/**
- * @return {!Object.<string, !WebInspector.TimelineCategory>}
- */
-WebInspector.TimelineUIUtils.categories = function()
-{
+ /**
+ * @return {!Object.<string, !WebInspector.TimelineCategory>}
+ */
+ static categories() {
if (WebInspector.TimelineUIUtils._categories)
- return WebInspector.TimelineUIUtils._categories;
+ return WebInspector.TimelineUIUtils._categories;
WebInspector.TimelineUIUtils._categories = {
- loading: new WebInspector.TimelineCategory("loading", WebInspector.UIString("Loading"), true, "hsl(214, 67%, 74%)", "hsl(214, 67%, 66%)"),
- scripting: new WebInspector.TimelineCategory("scripting", WebInspector.UIString("Scripting"), true, "hsl(43, 83%, 72%)", "hsl(43, 83%, 64%) "),
- rendering: new WebInspector.TimelineCategory("rendering", WebInspector.UIString("Rendering"), true, "hsl(256, 67%, 76%)", "hsl(256, 67%, 70%)"),
- painting: new WebInspector.TimelineCategory("painting", WebInspector.UIString("Painting"), true, "hsl(109, 33%, 64%)", "hsl(109, 33%, 55%)"),
- gpu: new WebInspector.TimelineCategory("gpu", WebInspector.UIString("GPU"), false, "hsl(109, 33%, 64%)", "hsl(109, 33%, 55%)"),
- other: new WebInspector.TimelineCategory("other", WebInspector.UIString("Other"), false, "hsl(0, 0%, 87%)", "hsl(0, 0%, 79%)"),
- idle: new WebInspector.TimelineCategory("idle", WebInspector.UIString("Idle"), false, "hsl(0, 100%, 100%)", "hsl(0, 100%, 100%)")
+ loading: new WebInspector.TimelineCategory(
+ 'loading', WebInspector.UIString('Loading'), true, 'hsl(214, 67%, 74%)', 'hsl(214, 67%, 66%)'),
+ scripting: new WebInspector.TimelineCategory(
+ 'scripting', WebInspector.UIString('Scripting'), true, 'hsl(43, 83%, 72%)', 'hsl(43, 83%, 64%) '),
+ rendering: new WebInspector.TimelineCategory(
+ 'rendering', WebInspector.UIString('Rendering'), true, 'hsl(256, 67%, 76%)', 'hsl(256, 67%, 70%)'),
+ painting: new WebInspector.TimelineCategory(
+ 'painting', WebInspector.UIString('Painting'), true, 'hsl(109, 33%, 64%)', 'hsl(109, 33%, 55%)'),
+ gpu: new WebInspector.TimelineCategory(
+ 'gpu', WebInspector.UIString('GPU'), false, 'hsl(109, 33%, 64%)', 'hsl(109, 33%, 55%)'),
+ other: new WebInspector.TimelineCategory(
+ 'other', WebInspector.UIString('Other'), false, 'hsl(0, 0%, 87%)', 'hsl(0, 0%, 79%)'),
+ idle: new WebInspector.TimelineCategory(
+ 'idle', WebInspector.UIString('Idle'), false, 'hsl(0, 100%, 100%)', 'hsl(0, 100%, 100%)')
};
return WebInspector.TimelineUIUtils._categories;
-};
+ }
-/**
- * @param {!WebInspector.TimelineModel.AsyncEventGroup} group
- * @return {string}
- */
-WebInspector.TimelineUIUtils.titleForAsyncEventGroup = function(group)
-{
+ /**
+ * @param {!WebInspector.TimelineModel.AsyncEventGroup} group
+ * @return {string}
+ */
+ static titleForAsyncEventGroup(group) {
if (!WebInspector.TimelineUIUtils._titleForAsyncEventGroupMap) {
- var groups = WebInspector.TimelineModel.AsyncEventGroup;
- WebInspector.TimelineUIUtils._titleForAsyncEventGroupMap = new Map([
- [groups.animation, WebInspector.UIString("Animation")],
- [groups.console, WebInspector.UIString("Console")],
- [groups.userTiming, WebInspector.UIString("User Timing")],
- [groups.input, WebInspector.UIString("Input")]
- ]);
- }
- return WebInspector.TimelineUIUtils._titleForAsyncEventGroupMap.get(group) || "";
-};
-
-/**
- * @param {!Object} aggregatedStats
- * @param {!WebInspector.TimelineCategory=} selfCategory
- * @param {number=} selfTime
- * @return {!Element}
- */
-WebInspector.TimelineUIUtils.generatePieChart = function(aggregatedStats, selfCategory, selfTime)
-{
+ var groups = WebInspector.TimelineModel.AsyncEventGroup;
+ WebInspector.TimelineUIUtils._titleForAsyncEventGroupMap = new Map([
+ [groups.animation, WebInspector.UIString('Animation')], [groups.console, WebInspector.UIString('Console')],
+ [groups.userTiming, WebInspector.UIString('User Timing')], [groups.input, WebInspector.UIString('Input')]
+ ]);
+ }
+ return WebInspector.TimelineUIUtils._titleForAsyncEventGroupMap.get(group) || '';
+ }
+
+ /**
+ * @param {!Object} aggregatedStats
+ * @param {!WebInspector.TimelineCategory=} selfCategory
+ * @param {number=} selfTime
+ * @return {!Element}
+ */
+ static generatePieChart(aggregatedStats, selfCategory, selfTime) {
var total = 0;
for (var categoryName in aggregatedStats)
- total += aggregatedStats[categoryName];
+ total += aggregatedStats[categoryName];
- var element = createElementWithClass("div", "timeline-details-view-pie-chart-wrapper hbox");
+ var element = createElementWithClass('div', 'timeline-details-view-pie-chart-wrapper hbox');
var pieChart = new WebInspector.PieChart(100);
- pieChart.element.classList.add("timeline-details-view-pie-chart");
+ pieChart.element.classList.add('timeline-details-view-pie-chart');
pieChart.setTotal(total);
- var pieChartContainer = element.createChild("div", "vbox");
+ var pieChartContainer = element.createChild('div', 'vbox');
pieChartContainer.appendChild(pieChart.element);
- pieChartContainer.createChild("div", "timeline-details-view-pie-chart-total").textContent = WebInspector.UIString("Total: %s", Number.millisToString(total, true));
- var footerElement = element.createChild("div", "timeline-aggregated-info-legend");
+ pieChartContainer.createChild('div', 'timeline-details-view-pie-chart-total').textContent =
+ WebInspector.UIString('Total: %s', Number.millisToString(total, true));
+ var footerElement = element.createChild('div', 'timeline-aggregated-info-legend');
/**
* @param {string} name
@@ -1575,579 +1468,766 @@ WebInspector.TimelineUIUtils.generatePieChart = function(aggregatedStats, selfCa
* @param {number} value
* @param {string} color
*/
- function appendLegendRow(name, title, value, color)
- {
- if (!value)
- return;
- pieChart.addSlice(value, color);
- var rowElement = footerElement.createChild("div");
- rowElement.createChild("span", "timeline-aggregated-legend-value").textContent = Number.preciseMillisToString(value, 1);
- rowElement.createChild("span", "timeline-aggregated-legend-swatch").style.backgroundColor = color;
- rowElement.createChild("span", "timeline-aggregated-legend-title").textContent = title;
+ function appendLegendRow(name, title, value, color) {
+ if (!value)
+ return;
+ pieChart.addSlice(value, color);
+ var rowElement = footerElement.createChild('div');
+ rowElement.createChild('span', 'timeline-aggregated-legend-value').textContent =
+ Number.preciseMillisToString(value, 1);
+ rowElement.createChild('span', 'timeline-aggregated-legend-swatch').style.backgroundColor = color;
+ rowElement.createChild('span', 'timeline-aggregated-legend-title').textContent = title;
}
// In case of self time, first add self, then children of the same category.
if (selfCategory) {
- if (selfTime)
- appendLegendRow(selfCategory.name, WebInspector.UIString("%s (self)", selfCategory.title), selfTime, selfCategory.color);
- // Children of the same category.
- var categoryTime = aggregatedStats[selfCategory.name];
- var value = categoryTime - selfTime;
- if (value > 0)
- appendLegendRow(selfCategory.name, WebInspector.UIString("%s (children)", selfCategory.title), value, selfCategory.childColor);
+ if (selfTime)
+ appendLegendRow(
+ selfCategory.name, WebInspector.UIString('%s (self)', selfCategory.title), selfTime, selfCategory.color);
+ // Children of the same category.
+ var categoryTime = aggregatedStats[selfCategory.name];
+ var value = categoryTime - selfTime;
+ if (value > 0)
+ appendLegendRow(
+ selfCategory.name, WebInspector.UIString('%s (children)', selfCategory.title), value,
+ selfCategory.childColor);
}
// Add other categories.
for (var categoryName in WebInspector.TimelineUIUtils.categories()) {
- var category = WebInspector.TimelineUIUtils.categories()[categoryName];
- if (category === selfCategory)
- continue;
- appendLegendRow(category.name, category.title, aggregatedStats[category.name], category.childColor);
+ var category = WebInspector.TimelineUIUtils.categories()[categoryName];
+ if (category === selfCategory)
+ continue;
+ appendLegendRow(category.name, category.title, aggregatedStats[category.name], category.childColor);
}
return element;
-};
-
-/**
- * @param {!WebInspector.TimelineFrameModel} frameModel
- * @param {!WebInspector.TimelineFrame} frame
- * @param {?WebInspector.FilmStripModel.Frame} filmStripFrame
- * @return {!Element}
- */
-WebInspector.TimelineUIUtils.generateDetailsContentForFrame = function(frameModel, frame, filmStripFrame)
-{
+ }
+
+ /**
+ * @param {!WebInspector.TimelineFrameModel} frameModel
+ * @param {!WebInspector.TimelineFrame} frame
+ * @param {?WebInspector.FilmStripModel.Frame} filmStripFrame
+ * @return {!Element}
+ */
+ static generateDetailsContentForFrame(frameModel, frame, filmStripFrame) {
var pieChart = WebInspector.TimelineUIUtils.generatePieChart(frame.timeByCategory);
var contentHelper = new WebInspector.TimelineDetailsContentHelper(null, null);
- contentHelper.addSection(WebInspector.UIString("Frame"));
+ contentHelper.addSection(WebInspector.UIString('Frame'));
var duration = WebInspector.TimelineUIUtils.frameDuration(frame);
- contentHelper.appendElementRow(WebInspector.UIString("Duration"), duration, frame.hasWarnings());
+ contentHelper.appendElementRow(WebInspector.UIString('Duration'), duration, frame.hasWarnings());
if (filmStripFrame) {
- var filmStripPreview = createElementWithClass("img", "timeline-filmstrip-preview");
- filmStripFrame.imageDataPromise().then(onGotImageData.bind(null, filmStripPreview));
- contentHelper.appendElementRow("", filmStripPreview);
- filmStripPreview.addEventListener("click", frameClicked.bind(null, filmStripFrame), false);
+ var filmStripPreview = createElementWithClass('img', 'timeline-filmstrip-preview');
+ filmStripFrame.imageDataPromise().then(onGotImageData.bind(null, filmStripPreview));
+ contentHelper.appendElementRow('', filmStripPreview);
+ filmStripPreview.addEventListener('click', frameClicked.bind(null, filmStripFrame), false);
}
var durationInMillis = frame.endTime - frame.startTime;
- contentHelper.appendTextRow(WebInspector.UIString("FPS"), Math.floor(1000 / durationInMillis));
- contentHelper.appendTextRow(WebInspector.UIString("CPU time"), Number.millisToString(frame.cpuTime, true));
+ contentHelper.appendTextRow(WebInspector.UIString('FPS'), Math.floor(1000 / durationInMillis));
+ contentHelper.appendTextRow(WebInspector.UIString('CPU time'), Number.millisToString(frame.cpuTime, true));
- if (Runtime.experiments.isEnabled("layersPanel") && frame.layerTree) {
- contentHelper.appendElementRow(WebInspector.UIString("Layer tree"),
- WebInspector.Linkifier.linkifyUsingRevealer(frame.layerTree, WebInspector.UIString("show")));
+ if (Runtime.experiments.isEnabled('layersPanel') && frame.layerTree) {
+ contentHelper.appendElementRow(
+ WebInspector.UIString('Layer tree'),
+ WebInspector.Linkifier.linkifyUsingRevealer(frame.layerTree, WebInspector.UIString('show')));
}
/**
* @param {!Element} image
* @param {?string} data
*/
- function onGotImageData(image, data)
- {
- if (data)
- image.src = "data:image/jpg;base64," + data;
+ function onGotImageData(image, data) {
+ if (data)
+ image.src = 'data:image/jpg;base64,' + data;
}
/**
* @param {!WebInspector.FilmStripModel.Frame} filmStripFrame
*/
- function frameClicked(filmStripFrame)
- {
- new WebInspector.FilmStripView.Dialog(filmStripFrame, 0);
+ function frameClicked(filmStripFrame) {
+ new WebInspector.FilmStripView.Dialog(filmStripFrame, 0);
}
return contentHelper.fragment;
-};
-
-/**
- * @param {!WebInspector.TimelineFrame} frame
- * @return {!Element}
- */
-WebInspector.TimelineUIUtils.frameDuration = function(frame)
-{
- var durationText = WebInspector.UIString("%s (at %s)", Number.millisToString(frame.endTime - frame.startTime, true),
+ }
+
+ /**
+ * @param {!WebInspector.TimelineFrame} frame
+ * @return {!Element}
+ */
+ static frameDuration(frame) {
+ var durationText = WebInspector.UIString(
+ '%s (at %s)', Number.millisToString(frame.endTime - frame.startTime, true),
Number.millisToString(frame.startTimeOffset, true));
- var element = createElement("span");
+ var element = createElement('span');
element.createTextChild(durationText);
if (!frame.hasWarnings())
- return element;
- element.createTextChild(WebInspector.UIString(". Long frame times are an indication of "));
- element.appendChild(WebInspector.linkifyURLAsNode("https://developers.google.com/web/fundamentals/performance/rendering/",
- WebInspector.UIString("jank"), undefined, true));
- element.createTextChild(".");
+ return element;
+ element.createTextChild(WebInspector.UIString('. Long frame times are an indication of '));
+ element.appendChild(WebInspector.linkifyURLAsNode(
+ 'https://developers.google.com/web/fundamentals/performance/rendering/', WebInspector.UIString('jank'),
+ undefined, true));
+ element.createTextChild('.');
return element;
-};
-
-/**
- * @param {!CanvasRenderingContext2D} context
- * @param {number} width
- * @param {number} height
- * @param {string} color0
- * @param {string} color1
- * @param {string} color2
- * @return {!CanvasGradient}
- */
-WebInspector.TimelineUIUtils.createFillStyle = function(context, width, height, color0, color1, color2)
-{
+ }
+
+ /**
+ * @param {!CanvasRenderingContext2D} context
+ * @param {number} width
+ * @param {number} height
+ * @param {string} color0
+ * @param {string} color1
+ * @param {string} color2
+ * @return {!CanvasGradient}
+ */
+ static createFillStyle(context, width, height, color0, color1, color2) {
var gradient = context.createLinearGradient(0, 0, width, height);
gradient.addColorStop(0, color0);
gradient.addColorStop(0.25, color1);
gradient.addColorStop(0.75, color1);
gradient.addColorStop(1, color2);
return gradient;
-};
+ }
-/**
- * @param {!Array.<number>} quad
- * @return {number}
- */
-WebInspector.TimelineUIUtils.quadWidth = function(quad)
-{
+ /**
+ * @param {!Array.<number>} quad
+ * @return {number}
+ */
+ static quadWidth(quad) {
return Math.round(Math.sqrt(Math.pow(quad[0] - quad[2], 2) + Math.pow(quad[1] - quad[3], 2)));
-};
+ }
-/**
- * @param {!Array.<number>} quad
- * @return {number}
- */
-WebInspector.TimelineUIUtils.quadHeight = function(quad)
-{
+ /**
+ * @param {!Array.<number>} quad
+ * @return {number}
+ */
+ static quadHeight(quad) {
return Math.round(Math.sqrt(Math.pow(quad[0] - quad[6], 2) + Math.pow(quad[1] - quad[7], 2)));
-};
+ }
-/**
- * @constructor
- * @param {number} priority
- * @param {string} color
- * @param {!Array.<string>} eventTypes
- */
-WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor = function(priority, color, eventTypes)
-{
- this.priority = priority;
- this.color = color;
- this.eventTypes = eventTypes;
-};
-
-/**
- * @return {!Array.<!WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor>}
- */
-WebInspector.TimelineUIUtils.eventDispatchDesciptors = function()
-{
+ /**
+ * @return {!Array.<!WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor>}
+ */
+ static eventDispatchDesciptors() {
if (WebInspector.TimelineUIUtils._eventDispatchDesciptors)
- return WebInspector.TimelineUIUtils._eventDispatchDesciptors;
- var lightOrange = "hsl(40,100%,80%)";
- var orange = "hsl(40,100%,50%)";
- var green = "hsl(90,100%,40%)";
- var purple = "hsl(256,100%,75%)";
+ return WebInspector.TimelineUIUtils._eventDispatchDesciptors;
+ var lightOrange = 'hsl(40,100%,80%)';
+ var orange = 'hsl(40,100%,50%)';
+ var green = 'hsl(90,100%,40%)';
+ var purple = 'hsl(256,100%,75%)';
WebInspector.TimelineUIUtils._eventDispatchDesciptors = [
- new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(1, lightOrange, ["mousemove", "mouseenter", "mouseleave", "mouseout", "mouseover"]),
- new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(1, lightOrange, ["pointerover", "pointerout", "pointerenter", "pointerleave", "pointermove"]),
- new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(2, green, ["wheel"]),
- new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(3, orange, ["click", "mousedown", "mouseup"]),
- new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(3, orange, ["touchstart", "touchend", "touchmove", "touchcancel"]),
- new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(3, orange, ["pointerdown", "pointerup", "pointercancel", "gotpointercapture", "lostpointercapture"]),
- new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(3, purple, ["keydown", "keyup", "keypress"])
+ new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(
+ 1, lightOrange, ['mousemove', 'mouseenter', 'mouseleave', 'mouseout', 'mouseover']),
+ new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(
+ 1, lightOrange, ['pointerover', 'pointerout', 'pointerenter', 'pointerleave', 'pointermove']),
+ new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(2, green, ['wheel']),
+ new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(3, orange, ['click', 'mousedown', 'mouseup']),
+ new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(
+ 3, orange, ['touchstart', 'touchend', 'touchmove', 'touchcancel']),
+ new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(
+ 3, orange, ['pointerdown', 'pointerup', 'pointercancel', 'gotpointercapture', 'lostpointercapture']),
+ new WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor(3, purple, ['keydown', 'keyup', 'keypress'])
];
return WebInspector.TimelineUIUtils._eventDispatchDesciptors;
-};
-
-/**
- * @constructor
- * @extends {WebInspector.Object}
- * @param {string} name
- * @param {string} title
- * @param {boolean} visible
- * @param {string} childColor
- * @param {string} color
- */
-WebInspector.TimelineCategory = function(name, title, visible, childColor, color)
-{
- this.name = name;
- this.title = title;
- this.visible = visible;
- this.childColor = childColor;
- this.color = color;
- this.hidden = false;
-};
-
-/** @enum {symbol} */
-WebInspector.TimelineCategory.Events = {
- VisibilityChanged: Symbol("VisibilityChanged")
-};
-
-WebInspector.TimelineCategory.prototype = {
- /**
- * @return {boolean}
- */
- get hidden()
- {
- return this._hidden;
- },
-
- set hidden(hidden)
- {
- this._hidden = hidden;
- this.dispatchEventToListeners(WebInspector.TimelineCategory.Events.VisibilityChanged, this);
- },
-
- __proto__: WebInspector.Object.prototype
-};
-
-/**
- * @typedef {!{
- * title: string,
- * color: string,
- * lineWidth: number,
- * dashStyle: !Array.<number>,
- * tall: boolean,
- * lowPriority: boolean
- * }}
- */
-WebInspector.TimelineMarkerStyle;
-
-/**
- * @param {!WebInspector.TracingModel.Event} event
- * @return {!WebInspector.TimelineMarkerStyle}
- */
-WebInspector.TimelineUIUtils.markerStyleForEvent = function(event)
-{
- var red = "rgb(255, 0, 0)";
- var blue = "rgb(0, 0, 255)";
- var orange = "rgb(255, 178, 23)";
- var green = "rgb(0, 130, 0)";
+ }
+
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @return {!WebInspector.TimelineMarkerStyle}
+ */
+ static markerStyleForEvent(event) {
+ var red = 'rgb(255, 0, 0)';
+ var blue = 'rgb(0, 0, 255)';
+ var orange = 'rgb(255, 178, 23)';
+ var green = 'rgb(0, 130, 0)';
var tallMarkerDashStyle = [10, 5];
var title = WebInspector.TimelineUIUtils.eventTitle(event);
- if (event.hasCategory(WebInspector.TimelineModel.Category.Console) || event.hasCategory(WebInspector.TimelineModel.Category.UserTiming)) {
- return {
- title: title,
- dashStyle: tallMarkerDashStyle,
- lineWidth: 0.5,
- color: orange,
- tall: false,
- lowPriority: false,
- };
+ if (event.hasCategory(WebInspector.TimelineModel.Category.Console) ||
+ event.hasCategory(WebInspector.TimelineModel.Category.UserTiming)) {
+ return {
+ title: title,
+ dashStyle: tallMarkerDashStyle,
+ lineWidth: 0.5,
+ color: orange,
+ tall: false,
+ lowPriority: false,
+ };
}
var recordTypes = WebInspector.TimelineModel.RecordType;
var tall = false;
var color = green;
switch (event.name) {
- case recordTypes.MarkDOMContent:
+ case recordTypes.MarkDOMContent:
color = blue;
tall = true;
break;
- case recordTypes.MarkLoad:
+ case recordTypes.MarkLoad:
color = red;
tall = true;
break;
- case recordTypes.MarkFirstPaint:
+ case recordTypes.MarkFirstPaint:
color = green;
tall = true;
break;
- case recordTypes.TimeStamp:
+ case recordTypes.TimeStamp:
color = orange;
break;
}
return {
- title: title,
- dashStyle: tallMarkerDashStyle,
- lineWidth: 0.5,
- color: color,
- tall: tall,
- lowPriority: false,
+ title: title,
+ dashStyle: tallMarkerDashStyle,
+ lineWidth: 0.5,
+ color: color,
+ tall: tall,
+ lowPriority: false,
};
-};
+ }
-/**
- * @return {!WebInspector.TimelineMarkerStyle}
- */
-WebInspector.TimelineUIUtils.markerStyleForFrame = function()
-{
+ /**
+ * @return {!WebInspector.TimelineMarkerStyle}
+ */
+ static markerStyleForFrame() {
return {
- title: WebInspector.UIString("Frame"),
- color: "rgba(100, 100, 100, 0.4)",
- lineWidth: 3,
- dashStyle: [3],
- tall: true,
- lowPriority: true
+ title: WebInspector.UIString('Frame'),
+ color: 'rgba(100, 100, 100, 0.4)',
+ lineWidth: 3,
+ dashStyle: [3],
+ tall: true,
+ lowPriority: true
};
-};
+ }
-/**
- * @param {string} url
- * @return {string}
- */
-WebInspector.TimelineUIUtils.colorForURL = function(url)
-{
+ /**
+ * @param {string} url
+ * @return {string}
+ */
+ static colorForURL(url) {
if (!WebInspector.TimelineUIUtils.colorForURL._colorGenerator) {
- WebInspector.TimelineUIUtils.colorForURL._colorGenerator = new WebInspector.FlameChart.ColorGenerator(
- { min: 30, max: 330 },
- { min: 50, max: 80, count: 3 },
- 85);
+ WebInspector.TimelineUIUtils.colorForURL._colorGenerator =
+ new WebInspector.FlameChart.ColorGenerator({min: 30, max: 330}, {min: 50, max: 80, count: 3}, 85);
}
return WebInspector.TimelineUIUtils.colorForURL._colorGenerator.colorForID(url);
+ }
+
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @param {string=} warningType
+ * @return {?Element}
+ */
+ static eventWarning(event, warningType) {
+ var warning = warningType || event.warning;
+ if (!warning)
+ return null;
+ var warnings = WebInspector.TimelineModel.WarningType;
+ var span = createElement('span');
+ var eventData = event.args['data'];
+
+ switch (warning) {
+ case warnings.ForcedStyle:
+ case warnings.ForcedLayout:
+ span.appendChild(WebInspector.linkifyDocumentationURLAsNode(
+ '../../fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing#avoid-forced-synchronous-layouts',
+ WebInspector.UIString('Forced reflow')));
+ span.createTextChild(WebInspector.UIString(' is a likely performance bottleneck.'));
+ break;
+ case warnings.IdleDeadlineExceeded:
+ span.textContent = WebInspector.UIString(
+ 'Idle callback execution extended beyond deadline by ' +
+ Number.millisToString(event.duration - eventData['allottedMilliseconds'], true));
+ break;
+ case warnings.V8Deopt:
+ span.appendChild(WebInspector.linkifyURLAsNode(
+ 'https://github.com/GoogleChrome/devtools-docs/issues/53', WebInspector.UIString('Not optimized'),
+ undefined, true));
+ span.createTextChild(WebInspector.UIString(': %s', eventData['deoptReason']));
+ break;
+ default:
+ console.assert(false, 'Unhandled TimelineModel.WarningType');
+ }
+ return span;
+ }
};
/**
- * @constructor
- * @param {string} title
+ * @unrestricted
*/
-WebInspector.TimelinePopupContentHelper = function(title)
-{
- this._contentTable = createElement("table");
- var titleCell = this._createCell(WebInspector.UIString("%s - Details", title), "timeline-details-title");
- titleCell.colSpan = 2;
- var titleRow = createElement("tr");
- titleRow.appendChild(titleCell);
- this._contentTable.appendChild(titleRow);
+WebInspector.TimelineRecordStyle = class {
+ /**
+ * @param {string} title
+ * @param {!WebInspector.TimelineCategory} category
+ * @param {boolean=} hidden
+ */
+ constructor(title, category, hidden) {
+ this.title = title;
+ this.category = category;
+ this.hidden = !!hidden;
+ }
};
-WebInspector.TimelinePopupContentHelper.prototype = {
- /**
- * @return {!Element}
- */
- contentTable: function()
- {
- return this._contentTable;
- },
- /**
- * @param {string|number} content
- * @param {string=} styleName
- */
- _createCell: function(content, styleName)
- {
- var text = createElement("label");
- text.createTextChild(String(content));
- var cell = createElement("td");
- cell.className = "timeline-details";
- if (styleName)
- cell.className += " " + styleName;
- cell.textContent = content;
- return cell;
- },
+/**
+ * @enum {symbol}
+ */
+WebInspector.TimelineUIUtils.NetworkCategory = {
+ HTML: Symbol('HTML'),
+ Script: Symbol('Script'),
+ Style: Symbol('Style'),
+ Media: Symbol('Media'),
+ Other: Symbol('Other')
+};
- /**
- * @param {string} title
- * @param {string|number} content
- */
- appendTextRow: function(title, content)
- {
- var row = createElement("tr");
- row.appendChild(this._createCell(title, "timeline-details-row-title"));
- row.appendChild(this._createCell(content, "timeline-details-row-data"));
- this._contentTable.appendChild(row);
- },
- /**
- * @param {string} title
- * @param {!Node|string} content
- */
- appendElementRow: function(title, content)
- {
- var row = createElement("tr");
- var titleCell = this._createCell(title, "timeline-details-row-title");
- row.appendChild(titleCell);
- var cell = createElement("td");
- cell.className = "details";
- if (content instanceof Node)
- cell.appendChild(content);
- else
- cell.createTextChild(content || "");
- row.appendChild(cell);
- this._contentTable.appendChild(row);
- }
-};
+WebInspector.TimelineUIUtils._aggregatedStatsKey = Symbol('aggregatedStats');
+
/**
- * @constructor
- * @param {?WebInspector.Target} target
- * @param {?WebInspector.Linkifier} linkifier
+ * @unrestricted
*/
-WebInspector.TimelineDetailsContentHelper = function(target, linkifier)
-{
- this.fragment = createDocumentFragment();
-
- this._linkifier = linkifier;
- this._target = target;
+WebInspector.TimelineUIUtils.InvalidationsGroupElement = class extends TreeElement {
+ /**
+ * @param {!WebInspector.Target} target
+ * @param {?Map<number, ?WebInspector.DOMNode>} relatedNodesMap
+ * @param {!WebInspector.TimelineDetailsContentHelper} contentHelper
+ * @param {!Array.<!WebInspector.InvalidationTrackingEvent>} invalidations
+ */
+ constructor(target, relatedNodesMap, contentHelper, invalidations) {
+ super('', true);
+
+ this.listItemElement.classList.add('header');
+ this.selectable = false;
+ this.toggleOnClick = true;
- this.element = createElementWithClass("div", "timeline-details-view-block");
- this._tableElement = this.element.createChild("div", "vbox timeline-details-chip-body");
- this.fragment.appendChild(this.element);
-};
+ this._relatedNodesMap = relatedNodesMap;
+ this._contentHelper = contentHelper;
+ this._invalidations = invalidations;
+ this.title = this._createTitle(target);
+ }
+
+ /**
+ * @param {!WebInspector.Target} target
+ * @return {!Element}
+ */
+ _createTitle(target) {
+ var first = this._invalidations[0];
+ var reason = first.cause.reason;
+ var topFrame = first.cause.stackTrace && first.cause.stackTrace[0];
+
+ var title = createElement('span');
+ if (reason)
+ title.createTextChild(WebInspector.UIString('%s for ', reason));
+ else
+ title.createTextChild(WebInspector.UIString('Unknown cause for '));
+
+ this._appendTruncatedNodeList(title, this._invalidations);
+
+ if (topFrame && this._contentHelper.linkifier()) {
+ title.createTextChild(WebInspector.UIString('. '));
+ var stack = title.createChild('span', 'monospace');
+ stack.createChild('span').textContent = WebInspector.beautifyFunctionName(topFrame.functionName);
+ var link = this._contentHelper.linkifier().maybeLinkifyConsoleCallFrame(target, topFrame);
+ if (link) {
+ stack.createChild('span').textContent = ' @ ';
+ stack.createChild('span').appendChild(link);
+ }
+ }
-WebInspector.TimelineDetailsContentHelper.prototype = {
- /**
- * @param {string} title
- * @param {!WebInspector.TimelineCategory=} category
- */
- addSection: function(title, category)
- {
- if (!this._tableElement.hasChildNodes()) {
- this.element.removeChildren();
- } else {
- this.element = createElementWithClass("div", "timeline-details-view-block");
- this.fragment.appendChild(this.element);
- }
+ return title;
+ }
+
+ /**
+ * @override
+ */
+ onpopulate() {
+ var content = createElementWithClass('div', 'content');
+
+ var first = this._invalidations[0];
+ if (first.cause.stackTrace) {
+ var stack = content.createChild('div');
+ stack.createTextChild(WebInspector.UIString('Stack trace:'));
+ this._contentHelper.createChildStackTraceElement(
+ stack, WebInspector.TimelineUIUtils._stackTraceFromCallFrames(first.cause.stackTrace));
+ }
- if (title) {
- var titleElement = this.element.createChild("div", "timeline-details-chip-title");
- if (category)
- titleElement.createChild("div").style.backgroundColor = category.color;
- titleElement.createTextChild(title);
- }
+ content.createTextChild(
+ this._invalidations.length > 1 ? WebInspector.UIString('Nodes:') : WebInspector.UIString('Node:'));
+ var nodeList = content.createChild('div', 'node-list');
+ var firstNode = true;
+ for (var i = 0; i < this._invalidations.length; i++) {
+ var invalidation = this._invalidations[i];
+ var invalidationNode = this._createInvalidationNode(invalidation, true);
+ if (invalidationNode) {
+ if (!firstNode)
+ nodeList.createTextChild(WebInspector.UIString(', '));
+ firstNode = false;
+
+ nodeList.appendChild(invalidationNode);
+
+ var extraData = invalidation.extraData ? ', ' + invalidation.extraData : '';
+ if (invalidation.changedId)
+ nodeList.createTextChild(WebInspector.UIString('(changed id to "%s"%s)', invalidation.changedId, extraData));
+ else if (invalidation.changedClass)
+ nodeList.createTextChild(
+ WebInspector.UIString('(changed class to "%s"%s)', invalidation.changedClass, extraData));
+ else if (invalidation.changedAttribute)
+ nodeList.createTextChild(
+ WebInspector.UIString('(changed attribute to "%s"%s)', invalidation.changedAttribute, extraData));
+ else if (invalidation.changedPseudo)
+ nodeList.createTextChild(
+ WebInspector.UIString('(changed pesudo to "%s"%s)', invalidation.changedPseudo, extraData));
+ else if (invalidation.selectorPart)
+ nodeList.createTextChild(WebInspector.UIString('(changed "%s"%s)', invalidation.selectorPart, extraData));
+ }
+ }
- this._tableElement = this.element.createChild("div", "vbox timeline-details-chip-body");
- this.fragment.appendChild(this.element);
- },
+ var contentTreeElement = new TreeElement(content, false);
+ contentTreeElement.selectable = false;
+ this.appendChild(contentTreeElement);
+ }
+
+ /**
+ * @param {!Element} parentElement
+ * @param {!Array.<!WebInspector.InvalidationTrackingEvent>} invalidations
+ */
+ _appendTruncatedNodeList(parentElement, invalidations) {
+ var invalidationNodes = [];
+ var invalidationNodeIdMap = {};
+ for (var i = 0; i < invalidations.length; i++) {
+ var invalidation = invalidations[i];
+ var invalidationNode = this._createInvalidationNode(invalidation, false);
+ invalidationNode.addEventListener('click', (e) => e.consume(), false);
+ if (invalidationNode && !invalidationNodeIdMap[invalidation.nodeId]) {
+ invalidationNodes.push(invalidationNode);
+ invalidationNodeIdMap[invalidation.nodeId] = true;
+ }
+ }
- /**
- * @return {?WebInspector.Linkifier}
- */
- linkifier: function()
- {
- return this._linkifier;
- },
+ if (invalidationNodes.length === 1) {
+ parentElement.appendChild(invalidationNodes[0]);
+ } else if (invalidationNodes.length === 2) {
+ parentElement.appendChild(invalidationNodes[0]);
+ parentElement.createTextChild(WebInspector.UIString(' and '));
+ parentElement.appendChild(invalidationNodes[1]);
+ } else if (invalidationNodes.length >= 3) {
+ parentElement.appendChild(invalidationNodes[0]);
+ parentElement.createTextChild(WebInspector.UIString(', '));
+ parentElement.appendChild(invalidationNodes[1]);
+ parentElement.createTextChild(WebInspector.UIString(', and %s others', invalidationNodes.length - 2));
+ }
+ }
+
+ /**
+ * @param {!WebInspector.InvalidationTrackingEvent} invalidation
+ * @param {boolean} showUnknownNodes
+ */
+ _createInvalidationNode(invalidation, showUnknownNodes) {
+ var node = (invalidation.nodeId && this._relatedNodesMap) ? this._relatedNodesMap.get(invalidation.nodeId) : null;
+ if (node)
+ return WebInspector.DOMPresentationUtils.linkifyNodeReference(node);
+ if (invalidation.nodeName) {
+ var nodeSpan = createElement('span');
+ nodeSpan.textContent = WebInspector.UIString('[ %s ]', invalidation.nodeName);
+ return nodeSpan;
+ }
+ if (showUnknownNodes) {
+ var nodeSpan = createElement('span');
+ return nodeSpan.createTextChild(WebInspector.UIString('[ unknown node ]'));
+ }
+ }
+};
- /**
- * @param {string} title
- * @param {string|number|boolean} value
- */
- appendTextRow: function(title, value)
- {
- var rowElement = this._tableElement.createChild("div", "timeline-details-view-row");
- rowElement.createChild("div", "timeline-details-view-row-title").textContent = title;
- rowElement.createChild("div", "timeline-details-view-row-value").textContent = value;
- },
- /**
- * @param {string} title
- * @param {!Node|string} content
- * @param {boolean=} isWarning
- * @param {boolean=} isStacked
- */
- appendElementRow: function(title, content, isWarning, isStacked)
- {
- var rowElement = this._tableElement.createChild("div", "timeline-details-view-row");
- if (isWarning)
- rowElement.classList.add("timeline-details-warning");
- if (isStacked)
- rowElement.classList.add("timeline-details-stack-values");
- var titleElement = rowElement.createChild("div", "timeline-details-view-row-title");
- titleElement.textContent = title;
- var valueElement = rowElement.createChild("div", "timeline-details-view-row-value");
- if (content instanceof Node)
- valueElement.appendChild(content);
- else
- valueElement.createTextChild(content || "");
- },
+/**
+ * @unrestricted
+ */
+WebInspector.TimelineUIUtils.EventDispatchTypeDescriptor = class {
+ /**
+ * @param {number} priority
+ * @param {string} color
+ * @param {!Array.<string>} eventTypes
+ */
+ constructor(priority, color, eventTypes) {
+ this.priority = priority;
+ this.color = color;
+ this.eventTypes = eventTypes;
+ }
+};
- /**
- * @param {string} title
- * @param {string} url
- * @param {number} startLine
- * @param {number=} startColumn
- */
- appendLocationRow: function(title, url, startLine, startColumn)
- {
- if (!this._linkifier || !this._target)
- return;
- var link = this._linkifier.maybeLinkifyScriptLocation(this._target, null, url, startLine, startColumn);
- if (!link)
- return;
- this.appendElementRow(title, link);
- },
- /**
- * @param {string} title
- * @param {string} url
- * @param {number} startLine
- * @param {number=} endLine
- */
- appendLocationRange: function(title, url, startLine, endLine)
- {
- if (!this._linkifier || !this._target)
- return;
- var locationContent = createElement("span");
- var link = this._linkifier.maybeLinkifyScriptLocation(this._target, null, url, startLine);
- if (!link)
- return;
- locationContent.appendChild(link);
- locationContent.createTextChild(String.sprintf(" [%s\u2026%s]", startLine + 1, endLine + 1 || ""));
- this.appendElementRow(title, locationContent);
- },
+/**
+ * @unrestricted
+ */
+WebInspector.TimelineCategory = class extends WebInspector.Object {
+ /**
+ * @param {string} name
+ * @param {string} title
+ * @param {boolean} visible
+ * @param {string} childColor
+ * @param {string} color
+ */
+ constructor(name, title, visible, childColor, color) {
+ super();
+ this.name = name;
+ this.title = title;
+ this.visible = visible;
+ this.childColor = childColor;
+ this.color = color;
+ this.hidden = false;
+ }
+
+ /**
+ * @return {boolean}
+ */
+ get hidden() {
+ return this._hidden;
+ }
+
+ /**
+ * @param {boolean} hidden
+ */
+ set hidden(hidden) {
+ this._hidden = hidden;
+ this.dispatchEventToListeners(WebInspector.TimelineCategory.Events.VisibilityChanged, this);
+ }
+};
- /**
- * @param {string} title
- * @param {!RuntimeAgent.StackTrace} stackTrace
- */
- appendStackTrace: function(title, stackTrace)
- {
- if (!this._linkifier || !this._target)
- return;
+/** @enum {symbol} */
+WebInspector.TimelineCategory.Events = {
+ VisibilityChanged: Symbol('VisibilityChanged')
+};
- var rowElement = this._tableElement.createChild("div", "timeline-details-view-row");
- rowElement.createChild("div", "timeline-details-view-row-title").textContent = title;
- this.createChildStackTraceElement(rowElement, stackTrace);
- },
+/**
+ * @typedef {!{
+ * title: string,
+ * color: string,
+ * lineWidth: number,
+ * dashStyle: !Array.<number>,
+ * tall: boolean,
+ * lowPriority: boolean
+ * }}
+ */
+WebInspector.TimelineMarkerStyle;
- /**
- * @param {!Element} parentElement
- * @param {!RuntimeAgent.StackTrace} stackTrace
- */
- createChildStackTraceElement: function(parentElement, stackTrace)
- {
- if (!this._linkifier || !this._target)
- return;
- parentElement.classList.add("timeline-details-stack-values");
- var stackTraceElement = parentElement.createChild("div", "timeline-details-view-row-value timeline-details-view-row-stack-trace");
- var callFrameElem = WebInspector.DOMPresentationUtils.buildStackTracePreviewContents(this._target, this._linkifier, stackTrace);
- stackTraceElement.appendChild(callFrameElem);
- },
- /**
- * @param {!WebInspector.TracingModel.Event} event
- * @param {string=} warningType
- */
- appendWarningRow: function(event, warningType)
- {
- var warning = WebInspector.TimelineUIUtils.eventWarning(event, warningType);
- if (warning)
- this.appendElementRow(WebInspector.UIString("Warning"), warning, true);
- }
+/**
+ * @unrestricted
+ */
+WebInspector.TimelinePopupContentHelper = class {
+ /**
+ * @param {string} title
+ */
+ constructor(title) {
+ this._contentTable = createElement('table');
+ var titleCell = this._createCell(WebInspector.UIString('%s - Details', title), 'timeline-details-title');
+ titleCell.colSpan = 2;
+ var titleRow = createElement('tr');
+ titleRow.appendChild(titleCell);
+ this._contentTable.appendChild(titleRow);
+ }
+
+ /**
+ * @return {!Element}
+ */
+ contentTable() {
+ return this._contentTable;
+ }
+
+ /**
+ * @param {string|number} content
+ * @param {string=} styleName
+ */
+ _createCell(content, styleName) {
+ var text = createElement('label');
+ text.createTextChild(String(content));
+ var cell = createElement('td');
+ cell.className = 'timeline-details';
+ if (styleName)
+ cell.className += ' ' + styleName;
+ cell.textContent = content;
+ return cell;
+ }
+
+ /**
+ * @param {string} title
+ * @param {string|number} content
+ */
+ appendTextRow(title, content) {
+ var row = createElement('tr');
+ row.appendChild(this._createCell(title, 'timeline-details-row-title'));
+ row.appendChild(this._createCell(content, 'timeline-details-row-data'));
+ this._contentTable.appendChild(row);
+ }
+
+ /**
+ * @param {string} title
+ * @param {!Node|string} content
+ */
+ appendElementRow(title, content) {
+ var row = createElement('tr');
+ var titleCell = this._createCell(title, 'timeline-details-row-title');
+ row.appendChild(titleCell);
+ var cell = createElement('td');
+ cell.className = 'details';
+ if (content instanceof Node)
+ cell.appendChild(content);
+ else
+ cell.createTextChild(content || '');
+ row.appendChild(cell);
+ this._contentTable.appendChild(row);
+ }
};
/**
- * @param {!WebInspector.TracingModel.Event} event
- * @param {string=} warningType
- * @return {?Element}
+ * @unrestricted
*/
-WebInspector.TimelineUIUtils.eventWarning = function(event, warningType)
-{
- var warning = warningType || event.warning;
- if (!warning)
- return null;
- var warnings = WebInspector.TimelineModel.WarningType;
- var span = createElement("span");
- var eventData = event.args["data"];
+WebInspector.TimelineDetailsContentHelper = class {
+ /**
+ * @param {?WebInspector.Target} target
+ * @param {?WebInspector.Linkifier} linkifier
+ */
+ constructor(target, linkifier) {
+ this.fragment = createDocumentFragment();
- switch (warning) {
- case warnings.ForcedStyle:
- case warnings.ForcedLayout:
- span.appendChild(WebInspector.linkifyDocumentationURLAsNode("../../fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing#avoid-forced-synchronous-layouts",
- WebInspector.UIString("Forced reflow")));
- span.createTextChild(WebInspector.UIString(" is a likely performance bottleneck."));
- break;
- case warnings.IdleDeadlineExceeded:
- span.textContent = WebInspector.UIString("Idle callback execution extended beyond deadline by " +
- Number.millisToString(event.duration - eventData["allottedMilliseconds"], true));
- break;
- case warnings.V8Deopt:
- span.appendChild(WebInspector.linkifyURLAsNode("https://github.com/GoogleChrome/devtools-docs/issues/53",
- WebInspector.UIString("Not optimized"), undefined, true));
- span.createTextChild(WebInspector.UIString(": %s", eventData["deoptReason"]));
- break;
- default:
- console.assert(false, "Unhandled TimelineModel.WarningType");
+ this._linkifier = linkifier;
+ this._target = target;
+
+ this.element = createElementWithClass('div', 'timeline-details-view-block');
+ this._tableElement = this.element.createChild('div', 'vbox timeline-details-chip-body');
+ this.fragment.appendChild(this.element);
+ }
+
+ /**
+ * @param {string} title
+ * @param {!WebInspector.TimelineCategory=} category
+ */
+ addSection(title, category) {
+ if (!this._tableElement.hasChildNodes()) {
+ this.element.removeChildren();
+ } else {
+ this.element = createElementWithClass('div', 'timeline-details-view-block');
+ this.fragment.appendChild(this.element);
}
- return span;
+
+ if (title) {
+ var titleElement = this.element.createChild('div', 'timeline-details-chip-title');
+ if (category)
+ titleElement.createChild('div').style.backgroundColor = category.color;
+ titleElement.createTextChild(title);
+ }
+
+ this._tableElement = this.element.createChild('div', 'vbox timeline-details-chip-body');
+ this.fragment.appendChild(this.element);
+ }
+
+ /**
+ * @return {?WebInspector.Linkifier}
+ */
+ linkifier() {
+ return this._linkifier;
+ }
+
+ /**
+ * @param {string} title
+ * @param {string|number|boolean} value
+ */
+ appendTextRow(title, value) {
+ var rowElement = this._tableElement.createChild('div', 'timeline-details-view-row');
+ rowElement.createChild('div', 'timeline-details-view-row-title').textContent = title;
+ rowElement.createChild('div', 'timeline-details-view-row-value').textContent = value;
+ }
+
+ /**
+ * @param {string} title
+ * @param {!Node|string} content
+ * @param {boolean=} isWarning
+ * @param {boolean=} isStacked
+ */
+ appendElementRow(title, content, isWarning, isStacked) {
+ var rowElement = this._tableElement.createChild('div', 'timeline-details-view-row');
+ if (isWarning)
+ rowElement.classList.add('timeline-details-warning');
+ if (isStacked)
+ rowElement.classList.add('timeline-details-stack-values');
+ var titleElement = rowElement.createChild('div', 'timeline-details-view-row-title');
+ titleElement.textContent = title;
+ var valueElement = rowElement.createChild('div', 'timeline-details-view-row-value');
+ if (content instanceof Node)
+ valueElement.appendChild(content);
+ else
+ valueElement.createTextChild(content || '');
+ }
+
+ /**
+ * @param {string} title
+ * @param {string} url
+ * @param {number} startLine
+ * @param {number=} startColumn
+ */
+ appendLocationRow(title, url, startLine, startColumn) {
+ if (!this._linkifier || !this._target)
+ return;
+ var link = this._linkifier.maybeLinkifyScriptLocation(this._target, null, url, startLine, startColumn);
+ if (!link)
+ return;
+ this.appendElementRow(title, link);
+ }
+
+ /**
+ * @param {string} title
+ * @param {string} url
+ * @param {number} startLine
+ * @param {number=} endLine
+ */
+ appendLocationRange(title, url, startLine, endLine) {
+ if (!this._linkifier || !this._target)
+ return;
+ var locationContent = createElement('span');
+ var link = this._linkifier.maybeLinkifyScriptLocation(this._target, null, url, startLine);
+ if (!link)
+ return;
+ locationContent.appendChild(link);
+ locationContent.createTextChild(String.sprintf(' [%s\u2026%s]', startLine + 1, endLine + 1 || ''));
+ this.appendElementRow(title, locationContent);
+ }
+
+ /**
+ * @param {string} title
+ * @param {!RuntimeAgent.StackTrace} stackTrace
+ */
+ appendStackTrace(title, stackTrace) {
+ if (!this._linkifier || !this._target)
+ return;
+
+ var rowElement = this._tableElement.createChild('div', 'timeline-details-view-row');
+ rowElement.createChild('div', 'timeline-details-view-row-title').textContent = title;
+ this.createChildStackTraceElement(rowElement, stackTrace);
+ }
+
+ /**
+ * @param {!Element} parentElement
+ * @param {!RuntimeAgent.StackTrace} stackTrace
+ */
+ createChildStackTraceElement(parentElement, stackTrace) {
+ if (!this._linkifier || !this._target)
+ return;
+ parentElement.classList.add('timeline-details-stack-values');
+ var stackTraceElement =
+ parentElement.createChild('div', 'timeline-details-view-row-value timeline-details-view-row-stack-trace');
+ var callFrameElem =
+ WebInspector.DOMPresentationUtils.buildStackTracePreviewContents(this._target, this._linkifier, stackTrace);
+ stackTraceElement.appendChild(callFrameElem);
+ }
+
+ /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @param {string=} warningType
+ */
+ appendWarningRow(event, warningType) {
+ var warning = WebInspector.TimelineUIUtils.eventWarning(event, warningType);
+ if (warning)
+ this.appendElementRow(WebInspector.UIString('Warning'), warning, true);
+ }
};
+
+
« no previous file with comments | « third_party/WebKit/Source/devtools/front_end/timeline/TimelineTreeView.js ('k') | third_party/WebKit/Source/devtools/front_end/timeline_model/TimelineFrameModel.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698