Timeline: add experiment to show events from subframes in the frames of their own

third_party/WebKit/Source/devtools/front_end/timeline_model/TimelineModel.js

Index: third_party/WebKit/Source/devtools/front_end/timeline_model/TimelineModel.js
diff --git a/third_party/WebKit/Source/devtools/front_end/timeline_model/TimelineModel.js b/third_party/WebKit/Source/devtools/front_end/timeline_model/TimelineModel.js
index 052239ee4501844febdd908a245826676147be19..2ecb22bd9ba3ffe73b941c265af39efc7852131c 100644
--- a/third_party/WebKit/Source/devtools/front_end/timeline_model/TimelineModel.js
+++ b/third_party/WebKit/Source/devtools/front_end/timeline_model/TimelineModel.js
@@ -562,6 +562,7 @@ WebInspector.TimelineModel = class {
   _processThreadEvents(tracingModel, startTime, endTime, thread, isMainThread) {
     var events = this._injectJSFrameEvents(tracingModel, thread);
     var asyncEvents = thread.asyncEvents();
+    var groupByFrame = isMainThread && Runtime.experiments.isEnabled('timelinePerFrameTrack');
 
     var threadEvents;
     var threadAsyncEventsByGroup;
@@ -584,6 +585,19 @@ WebInspector.TimelineModel = class {
         break;
       if (!this._processEvent(event))
         continue;
+      if (groupByFrame) {
+        var frameId = WebInspector.TimelineData.forEvent(event).frameId;
+        var pageFrame = frameId && this._pageFrames.get(frameId);
+        var isMainFrame = !frameId || !pageFrame || !pageFrame.parent;
+        if (isMainFrame)
+          frameId = WebInspector.TimelineModel.PageFrame.mainFrameId;
+        var frameEvents = this._eventsByFrame.get(frameId);
+        if (!frameEvents) {
+          frameEvents = [];
+          this._eventsByFrame.set(frameId, frameEvents);
+        }
+        frameEvents.push(event);
+      }
       threadEvents.push(event);
       this._inspectedTargetEvents.push(event);
     }
@@ -650,7 +664,7 @@ WebInspector.TimelineModel = class {
     var pageFrameId = WebInspector.TimelineModel.eventFrameId(event);
     if (!pageFrameId && eventStack.length)
       pageFrameId = WebInspector.TimelineData.forEvent(eventStack.peekLast()).frameId;
-    timelineData.frameId = pageFrameId || WebInspector.TimelineData.mainFrameId;
+    timelineData.frameId = pageFrameId || WebInspector.TimelineModel.PageFrame.mainFrameId;
     this._asyncEventTracker.processEvent(event);
     switch (event.name) {
       case recordTypes.ResourceSendRequest:
@@ -954,6 +968,8 @@ WebInspector.TimelineModel = class {
     this._workerIdByThread = new WeakMap();
     /** @type {!Map<string, !WebInspector.TimelineModel.PageFrame>} */
     this._pageFrames = new Map();
+    /** @type {!Map<string, !Array<!WebInspector.TracingModel.Event>>} */
+    this._eventsByFrame = new Map();
 
     this._minimumRecordTime = 0;
     this._maximumRecordTime = 0;
@@ -1037,6 +1053,13 @@ WebInspector.TimelineModel = class {
   }
 
   /**
+   * @return {!Array<!WebInspector.TimelineModel.PageFrame>}
+   */
+  rootFrames() {
+    return Array.from(this._pageFrames.values()).filter(frame => !frame.parent);
+  }
+
+  /**
    * @param {string} frameId
    * @return {?WebInspector.TimelineModel.PageFrame}
    */
@@ -1045,6 +1068,14 @@ WebInspector.TimelineModel = class {
   }
 
   /**
+   * @param {string} frameId
+   * @return {!Array<!WebInspector.TracingModel.Event>}
+   */
+  eventsForFrame(frameId) {
+    return this._eventsByFrame.get(frameId) || [];
+  }
+
+  /**
    * @return {!Array<!WebInspector.TimelineModel.NetworkRequest>}
    */
   networkRequests() {
@@ -1384,6 +1415,9 @@ WebInspector.TimelineModel.PageFrame = class {
   }
 };
 
+WebInspector.TimelineModel.PageFrame.mainFrameId = '';
+
+
 /**
  * @unrestricted
  */
@@ -1952,5 +1986,4 @@ WebInspector.TimelineData = class {
   }
 };
 
-WebInspector.TimelineData.mainFrameId = '';
 WebInspector.TimelineData._symbol = Symbol('timelineData');