DevTools: group by frame, not product in the network panel.

third_party/WebKit/Source/devtools/front_end/network/NetworkLogView.js

 /*
  * Copyright (C) 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2008, 2009 Anthony Ricaud <rik@webkit.org>
  * Copyright (C) 2011 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
@@ skipping 82 matching lines @@
     this.linkifier = new Components.Linkifier();
     this.badgePool = new ProductRegistry.BadgePool();
 
     this._recording = false;
     this._preserveLog = false;
 
     this._headerHeight = 0;
 
     /** @type {!Map<string, !Network.GroupLookupInterface>} */
     this._groupLookups = new Map();
-    this._groupLookups.set('Frame', new Network.FrameGrouper(this));
+    this._groupLookups.set('Frame', new Network.NetworkFrameGrouper(this));
 
     /** @type {?Network.GroupLookupInterface} */
     this._activeGroupLookup = null;
 
     this._addFilters();
     this._resetSuggestionBuilder();
     this._initializeView();
 
     Common.moduleSetting('networkColorCodeResourceTypes')
         .addChangeListener(this._invalidateAllItems.bind(this, false), this);
 
     SDK.targetManager.observeModels(SDK.NetworkManager, this);
     SDK.targetManager.addModelListener(
         SDK.NetworkManager, SDK.NetworkManager.Events.RequestStarted, this._onRequestStarted, this);
     SDK.targetManager.addModelListener(
         SDK.NetworkManager, SDK.NetworkManager.Events.RequestUpdated, this._onRequestUpdated, this);
     SDK.targetManager.addModelListener(
         SDK.NetworkManager, SDK.NetworkManager.Events.RequestFinished, this._onRequestUpdated, this);
+
+    this._updateGroupByFrame();
+    Common.moduleSetting('network.group-by-frame').addChangeListener(() => this._updateGroupByFrame());

[dgozman, 2017/05/13 00:32:34]

(..., this._updateGroupByFrame, this)

[pfeldman, 2017/05/15 14:53:02]

I am now using these, because I think performance-wise they are same and
readability-wise, it is better.

+  }
+
+  _updateGroupByFrame() {
+    var value = Common.moduleSetting('network.group-by-frame').get();
+    this.contentElement.classList.toggle('network-group-by-frame', value);

[dgozman, 2017/05/13 00:32:34]

Is this class ever used?

[pfeldman, 2017/05/15 14:53:02]

Done.

+    this._setGrouping(value ? 'Frame' : null);
   }
 
   /**
    * @param {!Network.NetworkLogView.Filter} filter
    * @param {!SDK.NetworkRequest} request
    * @return {boolean}
    */
   static _negativeFilter(filter, request) {
     return !filter(request);
   }
@@ skipping 212 matching lines @@
    */
   static _requestTimeFilter(windowStart, windowEnd, request) {
     if (request.issueTime() > windowEnd)
       return false;
     if (request.endTime !== -1 && request.endTime < windowStart)
       return false;
     return true;
   }
 
   /**
-   * @return {!Map<string, !Network.GroupLookupInterface>}
+   * @param {?string} groupKey
    */
-  groupLookups() {
-    return this._groupLookups;
+  _setGrouping(groupKey) {
+    var groupLookup = groupKey ? this._groupLookups.get(groupKey) || null : null;
+    this._activeGroupLookup = groupLookup;
+    if (groupLookup)
+      groupLookup.reset();
+    this._invalidateAllItems();
   }
 
   /**
-   * @param {string} groupKey
-   */
-  setGrouping(groupKey) {
-    var groupLookup = this._groupLookups.get(groupKey) || null;
-    this._activeGroupLookup = groupLookup;
-    if (!groupLookup) {
-      this._invalidateAllItems();
-      return;
-    }
-    groupLookup.initialize().then(() => {
-      if (this._activeGroupLookup !== groupLookup)
-        return;
-      this._activeGroupLookup.reset();
-      this._invalidateAllItems();
-    });
-  }
-
-  /**
    * @param {!SDK.NetworkRequest} request
    * @return {?Network.NetworkRequestNode}
    */
   nodeForRequest(request) {
     return this._nodesByRequestId.get(request.requestId());
   }
 
   /**
    * @return {number}
    */
@@ skipping 1428 matching lines @@
 /** @typedef {function(!SDK.NetworkRequest): boolean} */
 Network.NetworkLogView.Filter;
 
 /**
  * @interface
  */
 Network.GroupLookupInterface = function() {};
 
 Network.GroupLookupInterface.prototype = {
   /**
-   * @return {!Promise}
-   */
-  initialize: function() {},
-
-  /**
    * @param {!SDK.NetworkRequest} request
    * @return {?Network.NetworkGroupNode}
    */
   groupNodeForRequest: function(request) {},
 
   reset: function() {}
 };