DevTools: Tweak Group by Product

third_party/WebKit/Source/devtools/front_end/timeline/TimelineTreeView.js

 // Copyright 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @unrestricted
  * @implements {UI.Searchable}
  */
 Timeline.TimelineTreeView = class extends UI.VBox {
   constructor() {
@@ skipping 654 matching lines @@
   }
 
   /**
    * @param {!TimelineModel.TimelineProfileTree.Node} node
    * @return {!{name: string, color: string}}
    */
   _displayInfoForGroupNode(node) {
     var categories = Timeline.TimelineUIUtils.categories();
     var color = node.id ? Timeline.TimelineUIUtils.eventColor(/** @type {!SDK.TracingModel.Event} */ (node.event)) :
                           categories['other'].color;
-
+    var unattributed = Common.UIString('[unattributed]');
+    /**
+     * @param {string} name
+     * @return {string}
+     * @this {Timeline.AggregatedTimelineTreeView}
+     */
+    function beautifyDomainName(name) {
+      if (Timeline.AggregatedTimelineTreeView._isExtensionInternalURL(name))
+        name = Common.UIString('[Chrome extensions overhead]');
+      else if (Timeline.AggregatedTimelineTreeView._isV8NativeURL(name))
+        name = Common.UIString('[V8 Runtime]');
+      else if (name.startsWith('chrome-extension'))
+        name = this._executionContextNamesByOrigin.get(name) || name;
+      return name;
+    }
     switch (this._groupBySetting.get()) {
       case Timeline.AggregatedTimelineTreeView.GroupBy.Category:
         var category = categories[node.id] || categories['other'];
         return {name: category.title, color: category.color};
 
       case Timeline.AggregatedTimelineTreeView.GroupBy.Domain:
       case Timeline.AggregatedTimelineTreeView.GroupBy.Subdomain:
-        var name = node.id;
-        if (Timeline.AggregatedTimelineTreeView._isExtensionInternalURL(name))
-          name = Common.UIString('[Chrome extensions overhead]');
-        else if (Timeline.AggregatedTimelineTreeView._isV8NativeURL(name))
-          name = Common.UIString('[V8 Runtime]');
-        else if (name.startsWith('chrome-extension'))
-          name = this._executionContextNamesByOrigin.get(name) || name;
-        return {name: name || Common.UIString('unattributed'), color: color};
+        return {name: beautifyDomainName.call(this, node.id) || unattributed, color: color};
 
       case Timeline.AggregatedTimelineTreeView.GroupBy.EventName:
         var name = node.event.name === TimelineModel.TimelineModel.RecordType.JSFrame ?
             Common.UIString('JavaScript') :
             Timeline.TimelineUIUtils.eventTitle(node.event);
         return {
           name: name,
           color: node.event.name === TimelineModel.TimelineModel.RecordType.JSFrame ?
               Timeline.TimelineUIUtils.eventStyle(node.event).category.color :
               color
         };
 
       case Timeline.AggregatedTimelineTreeView.GroupBy.Product:
-        var name = node.event ? this._productByEvent(node.event) : '';
-        return {name: name || Common.UIString('unattributed'), color: Timeline.TimelineUIUtils.colorForId(name)};
+        var productName = this._productByEvent(/** @type {!SDK.TracingModel.Event} */ (node.event));
+        color = productName ? Timeline.TimelineUIUtils.colorForId(productName) : '#eee';
+        var name = productName || this._domainByEvent(true, /** @type {!SDK.TracingModel.Event} */ (node.event)) || '';
+        return {name: beautifyDomainName.call(this, name) || unattributed, color: color};
 
       case Timeline.AggregatedTimelineTreeView.GroupBy.URL:
         break;
 
       case Timeline.AggregatedTimelineTreeView.GroupBy.Frame:
         var frame = this._model.timelineModel().pageFrameById(node.id);
         var frameName = frame ? Timeline.TimelineUIUtils.displayNameForFrame(frame, 80) : Common.UIString('Page');
         return {name: frameName, color: color};
 
       default:
         console.assert(false, 'Unexpected aggregation type');
     }
-    return {name: node.id || Common.UIString('unattributed'), color: color};
+    return {name: node.id || unattributed, color: color};
   }
 
   /**
    * @override
    * @param {!UI.Toolbar} toolbar
    */
   populateToolbar(toolbar) {
     super.populateToolbar(toolbar);
     var groupBy = Timeline.AggregatedTimelineTreeView.GroupBy;
     var options = [
@@ skipping 54 matching lines @@
     this._stackView.setStack(stack, node);
     this._stackView.show(this._detailsView.element);
     return true;
   }
 
   /**
    * @param {!Timeline.AggregatedTimelineTreeView.GroupBy} groupBy
    * @return {?function(!SDK.TracingModel.Event):string}
    */
   _groupingFunction(groupBy) {
-    /**
-     * @param {!SDK.TracingModel.Event} event
-     * @return {string}
-     */
-    function groupByURL(event) {
-      return TimelineModel.TimelineProfileTree.eventURL(event) || '';
-    }
-
-    /**
-     * @param {boolean} groupSubdomains
-     * @param {!SDK.TracingModel.Event} event
-     * @return {string}
-     */
-    function groupByDomain(groupSubdomains, event) {
-      var url = TimelineModel.TimelineProfileTree.eventURL(event) || '';
-      if (Timeline.AggregatedTimelineTreeView._isExtensionInternalURL(url))
-        return Timeline.AggregatedTimelineTreeView._extensionInternalPrefix;
-      if (Timeline.AggregatedTimelineTreeView._isV8NativeURL(url))
-        return Timeline.AggregatedTimelineTreeView._v8NativePrefix;
-      var parsedURL = url.asParsedURL();
-      if (!parsedURL)
-        return '';
-      if (parsedURL.scheme === 'chrome-extension')
-        return parsedURL.scheme + '://' + parsedURL.host;
-      if (!groupSubdomains)
-        return parsedURL.host;
-      if (/^[.0-9]+$/.test(parsedURL.host))
-        return parsedURL.host;
-      var domainMatch = /([^.]*\.)?[^.]*$/.exec(parsedURL.host);
-      return domainMatch && domainMatch[0] || '';
-    }
-
+    var GroupBy = Timeline.AggregatedTimelineTreeView.GroupBy;
     switch (groupBy) {
-      case Timeline.AggregatedTimelineTreeView.GroupBy.None:
+      case GroupBy.None:
         return null;
-      case Timeline.AggregatedTimelineTreeView.GroupBy.EventName:
+      case GroupBy.EventName:
         return event => Timeline.TimelineUIUtils.eventStyle(event).title;
-      case Timeline.AggregatedTimelineTreeView.GroupBy.Category:
+      case GroupBy.Category:
         return event => Timeline.TimelineUIUtils.eventStyle(event).category.name;
-      case Timeline.AggregatedTimelineTreeView.GroupBy.Subdomain:
-        return groupByDomain.bind(null, false);
-      case Timeline.AggregatedTimelineTreeView.GroupBy.Domain:
-        return groupByDomain.bind(null, true);
-      case Timeline.AggregatedTimelineTreeView.GroupBy.Product:
-        return this._productByEvent.bind(this);
-      case Timeline.AggregatedTimelineTreeView.GroupBy.URL:
-        return groupByURL;
-      case Timeline.AggregatedTimelineTreeView.GroupBy.Frame:
+      case GroupBy.Subdomain:
+        return this._domainByEvent.bind(this, false);
+      case GroupBy.Domain:
+        return this._domainByEvent.bind(this, true);
+      case GroupBy.Product:
+        return event => this._productByEvent(event) || this._domainByEvent(true, event);
+      case GroupBy.URL:
+        return event => TimelineModel.TimelineProfileTree.eventURL(event) || '';
+      case GroupBy.Frame:
         return event => TimelineModel.TimelineData.forEvent(event).frameId;
       default:
         console.assert(false, `Unexpected aggregation setting: ${groupBy}`);
         return null;
     }
   }
 
   /**
+   * @param {boolean} groupSubdomains
+   * @param {!SDK.TracingModel.Event} event
+   * @return {string}
+   */
+  _domainByEvent(groupSubdomains, event) {
+    var url = TimelineModel.TimelineProfileTree.eventURL(event) || '';
+    if (Timeline.AggregatedTimelineTreeView._isExtensionInternalURL(url))
+      return Timeline.AggregatedTimelineTreeView._extensionInternalPrefix;
+    if (Timeline.AggregatedTimelineTreeView._isV8NativeURL(url))
+      return Timeline.AggregatedTimelineTreeView._v8NativePrefix;
+    var parsedURL = url.asParsedURL();
+    if (!parsedURL)
+      return '';
+    if (parsedURL.scheme === 'chrome-extension')
+      return parsedURL.scheme + '://' + parsedURL.host;
+    if (!groupSubdomains)
+      return parsedURL.host;
+    if (/^[.0-9]+$/.test(parsedURL.host))
+      return parsedURL.host;
+    var domainMatch = /([^.]*\.)?[^.]*$/.exec(parsedURL.host);
+    return domainMatch && domainMatch[0] || '';
+  }
+
+  /**
    * @param {!SDK.TracingModel.Event} event
    * @return {string}
    */
   _productByEvent(event) {
+    var url = TimelineModel.TimelineProfileTree.eventURL(event);
+    if (!url)
+      return '';
+    if (this._productByURLCache.has(url))
+      return this._productByURLCache.get(url);
     if (!this._productRegistry)
       return '';
-    var url = TimelineModel.TimelineProfileTree.eventURL(event) || '';
-    var name = this._productByURLCache.get(url);
-    if (name)
-      return name;
     var parsedURL = url.asParsedURL();
-    name = parsedURL && this._productRegistry.nameForUrl(parsedURL) || '';
+    var name = parsedURL && this._productRegistry.nameForUrl(parsedURL) || '';
     this._productByURLCache.set(url, name);
     return name;
   }
 
   /**
    * @override
    * @param {!UI.ContextMenu} contextMenu
    * @param {!TimelineModel.TimelineProfileTree.Node} node
    */
   _appendContextMenuItems(contextMenu, node) {
@@ skipping 133 matching lines @@
 
   _onSelectionChanged() {
     this.dispatchEventToListeners(Timeline.TimelineStackView.Events.SelectionChanged);
   }
 };
 
 /** @enum {symbol} */
 Timeline.TimelineStackView.Events = {
   SelectionChanged: Symbol('SelectionChanged')
 };