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 @@
     /** @type {!Components.Linkifier} */
     this.linkifier = new Components.Linkifier();
 
     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.FrameGrouper(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());
+  }
+
+  _updateGroupByFrame() {
+    var value = Common.moduleSetting('network.group-by-frame').get();
+    this.contentElement.classList.toggle('network-group-by-frame', value);
+    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;
-  }
-
-  /**
-   * @param {string} groupKey
-   */
-  setGrouping(groupKey) {
-    var groupLookup = this._groupLookups.get(groupKey) || null;
+  _setGrouping(groupKey) {
+    var groupLookup = groupKey ? this._groupLookups.get(groupKey) || null : null;
     this._activeGroupLookup = groupLookup;
     if (!groupLookup) {
       this._invalidateAllItems();
       return;
     }
     groupLookup.initialize().then(() => {
       if (this._activeGroupLookup !== groupLookup)
         return;
       this._activeGroupLookup.reset();
       this._invalidateAllItems();
@@ skipping 1456 matching lines @@
   initialize: function() {},
 
   /**
    * @param {!SDK.NetworkRequest} request
    * @return {?Network.NetworkGroupNode}
    */
   groupNodeForRequest: function(request) {},
 
   reset: function() {}
 };