[Devtools] Updated format to store product registry data

third_party/WebKit/Source/devtools/front_end/network_group_lookup/NetworkProductGroupLookup.js

Index: third_party/WebKit/Source/devtools/front_end/network_group_lookup/NetworkProductGroupLookup.js
diff --git a/third_party/WebKit/Source/devtools/front_end/network_group_lookup/NetworkProductGroupLookup.js b/third_party/WebKit/Source/devtools/front_end/network_group_lookup/NetworkProductGroupLookup.js
index 95edcda762420b483c0bc80937bcb50cb8438670..6346155d827f7c072e735536ea37c39ebe87e169 100644
--- a/third_party/WebKit/Source/devtools/front_end/network_group_lookup/NetworkProductGroupLookup.js
+++ b/third_party/WebKit/Source/devtools/front_end/network_group_lookup/NetworkProductGroupLookup.js
@@ -113,4 +113,33 @@ NetworkGroupLookup.NetworkProductFrameGroupLookup = class {
   }
 };
 
+/**
+ * @implements {Network.NetworkRowDecorator}
+ */
+NetworkGroupLookup.NetworkProductTypeGroupLookup = class {
+  /**
+   * @override
+   * @param {!DataGrid.SortableDataGrid<!Network.NetworkNode>} dataGrid
+   */
+  setDataGrid(dataGrid) {
+    UI.appendStyle(dataGrid.element, 'network_group_lookup/networkProductTypeGroupLookup.css');

[pfeldman, 2017/04/11 00:07:31]

Let's expose registerRequiredCSS on DataGrid as we do in other places that
inject css. That way we can track them as we migrate to components.

+  }
+
+  /**
+   * @override
+   * @param {!Network.NetworkNode} node
+   */
+  decorate(node) {
+    var request = node.request();
+    var element = node.existingElement();
+    if (!request || !element)
+      return;
+    var typeName = ProductRegistry.typeForUrl(request.parsedURL);
+    if (!typeName)
+      return;
+    element.classList.add('product-type-' + typeName);

[pfeldman, 2017/04/11 00:07:31]

Better yet, set your style via CSSOM (yes, I mean that it is still better).

+    element.classList.add('product-type');
+  }
+};
+
 NetworkGroupLookup.NetworkProductFrameGroupLookup._productFrameGroupNameSymbol = Symbol('ProductFrameGroupName');