[Devtools] New structure and colorize rows for network products

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

Index: third_party/WebKit/Source/devtools/front_end/network/NetworkLogViewColumns.js
diff --git a/third_party/WebKit/Source/devtools/front_end/network/NetworkLogViewColumns.js b/third_party/WebKit/Source/devtools/front_end/network/NetworkLogViewColumns.js
index e206ff068489418f3909c338c3ad97cb5f7a4ce4..396af0e0a8652b59d3444f71d937a65e436ded97 100644
--- a/third_party/WebKit/Source/devtools/front_end/network/NetworkLogViewColumns.js
+++ b/third_party/WebKit/Source/devtools/front_end/network/NetworkLogViewColumns.js
@@ -29,9 +29,6 @@ Network.NetworkLogViewColumns = class {
     /** @type {!Array.<!Network.NetworkLogViewColumns.Descriptor>} */
     this._columns = [];
 
-    /** @type {!Map<string, ?Network.NetworkColumnExtensionInterface>} */
-    this._columnExtensions = new Map();
-
     this._waterfallRequestsAreStale = false;
     this._waterfallScrollerWidthIsStale = true;
 
@@ -78,6 +75,16 @@ Network.NetworkLogViewColumns = class {
 
   _setupDataGrid() {
     var defaultColumns = Network.NetworkLogViewColumns._defaultColumns;
+
+    if (Runtime.experiments.isEnabled('networkGroupingRequests')) {
+      defaultColumns.splice(1, 0, /** @type {!Network.NetworkLogViewColumns.Descriptor} */ ({
+                              id: 'product',
+                              title: Common.UIString('Product'),
+                              visible: true,
+                              sortingFunction: Network.NetworkRequestNode.ProductComparitor

[pfeldman, 2017/04/27 22:20:49]

You need to either make sorting async or create this whole control after you
resolve the products.

[allada, 2017/04/28 01:20:07]

Sorting is a pain point of network grid as it is. I want to resolve it after
products.

+                            }));
+    }
+
     var defaultColumnConfig = Network.NetworkLogViewColumns._defaultColumnConfig;
 
     this._columns = /** @type {!Array<!Network.NetworkLogViewColumns.Descriptor>} */ ([]);
@@ -89,7 +96,6 @@ Network.NetworkLogViewColumns = class {
         columnConfig.titleDOMFragment = this._makeHeaderFragment(columnConfig.title, columnConfig.subtitle);
       this._columns.push(columnConfig);
     }
-    this._loadColumnExtensions();
     this._loadCustomColumnsAndSettings();
 
     this._popoverHelper = new UI.PopoverHelper(this._networkLogView.element, this._getPopoverRequest.bind(this));
@@ -329,13 +335,6 @@ Network.NetworkLogViewColumns = class {
   }
 
   /**
-   * @return {!Map<string, ?Network.NetworkColumnExtensionInterface>}
-   */
-  columnExtensions() {
-    return this._columnExtensions;
-  }
-
-  /**
    * @param {!Network.NetworkLogViewColumns.Descriptor} columnConfig
    */
   _toggleColumnVisibility(columnConfig) {
@@ -353,43 +352,6 @@ Network.NetworkLogViewColumns = class {
     this._persistantSettings.set(saveableSettings);
   }
 
-  _loadColumnExtensions() {
-    var extensions = self.runtime.extensions(Network.NetworkColumnExtensionInterface);
-    for (var i = 0; i < extensions.length; i++) {
-      var extension = extensions[i];
-      var title = extension.title();
-      var columnId = title.toLowerCase() + '-extension';
-
-      this._columnExtensions.set(columnId, null);
-      extension.instance().then(extensionInstanceResolved.bind(this, columnId));
-
-      var columnConfig = /** @type {!Network.NetworkLogViewColumns.Descriptor} */ (
-          Object.assign({}, Network.NetworkLogViewColumns._defaultColumnConfig, {
-            id: columnId,
-            title: title,
-            isResponseHeader: false,
-            isCustomHeader: false,
-            visible: true,
-            sortingFunction:
-                Network.NetworkRequestNode.ExtensionColumnComparator.bind(null, this._columnExtensions, columnId)
-          }));
-      const columnIndex = i + 1;
-      this._columns.splice(columnIndex, 0, columnConfig);
-      if (this._dataGrid)
-        this._dataGrid.addColumn(Network.NetworkLogViewColumns._convertToDataGridDescriptor(columnConfig), columnIndex);
-    }
-
-    /**
-     * @param {string} columnId
-     * @param {!Network.NetworkColumnExtensionInterface} instance
-     * @this {Network.NetworkLogViewColumns}
-     */
-    function extensionInstanceResolved(columnId, instance) {
-      this._columnExtensions.set(columnId, instance);
-      this._networkLogView.columnExtensionResolved();
-    }
-  }
-
   _loadCustomColumnsAndSettings() {
     var savedSettings = this._persistantSettings.get();
     var columnIds = Object.keys(savedSettings);
@@ -854,23 +816,3 @@ Network.NetworkLogViewColumns.WaterfallSortIds = {
   Duration: 'duration',
   Latency: 'latency'
 };
-
-/**
- * @interface
- */
-Network.NetworkColumnExtensionInterface = function() {};
-
-Network.NetworkColumnExtensionInterface.prototype = {
-  /**
-   * @param {!SDK.NetworkRequest} request
-   * @return {string}
-   */
-  lookupColumnValue(request) {},
-
-  /**
-   * @param {!SDK.NetworkRequest} aRequest
-   * @param {!SDK.NetworkRequest} bRequest
-   * @return {number}
-   */
-  requestComparator(aRequest, bRequest) {}
-};