DevTools: Fix network request details on timeline flamechart

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

Index: third_party/WebKit/Source/devtools/front_end/timeline/TimelineUIUtils.js
diff --git a/third_party/WebKit/Source/devtools/front_end/timeline/TimelineUIUtils.js b/third_party/WebKit/Source/devtools/front_end/timeline/TimelineUIUtils.js
index 28fb0572366596ed1b859fa03b9fabc9270289d5..3f443133e1d30881cd0b14d1b8a71c0ef411f0a4 100644
--- a/third_party/WebKit/Source/devtools/front_end/timeline/TimelineUIUtils.js
+++ b/third_party/WebKit/Source/devtools/front_end/timeline/TimelineUIUtils.js
@@ -734,7 +734,7 @@ Timeline.TimelineUIUtils = class {
 
     var contentHelper = new Timeline.TimelineDetailsContentHelper(model.targetByEvent(event), linkifier);
     contentHelper.addSection(
-        Timeline.TimelineUIUtils.eventTitle(event), Timeline.TimelineUIUtils.eventStyle(event).category);
+        Timeline.TimelineUIUtils.eventTitle(event), Timeline.TimelineUIUtils.eventStyle(event).category.color);
 
     var eventData = event.args['data'];
     var timelineData = TimelineModel.TimelineData.forEvent(event);
@@ -1017,10 +1017,13 @@ Timeline.TimelineUIUtils = class {
    * @return {!Promise<!DocumentFragment>}
    */
   static buildNetworkRequestDetails(request, model, linkifier) {
-    var target = model.targetByEvent(request.children[0]);
-    var contentHelper = new Timeline.TimelineDetailsContentHelper(target, linkifier);
+    const target = model.targetByEvent(request.children[0]);
+    const contentHelper = new Timeline.TimelineDetailsContentHelper(target, linkifier);
+    const category = Timeline.TimelineUIUtils.networkRequestCategory(request);
+    const color = Timeline.TimelineUIUtils.networkCategoryColor(category);
+    contentHelper.addSection(Common.UIString('Network request'), color);
 
-    var duration = request.endTime - (request.startTime || -Infinity);
+    const duration = request.endTime - (request.startTime || -Infinity);
     if (request.url)
       contentHelper.appendElementRow(Common.UIString('URL'), Components.Linkifier.linkifyURL(request.url));
     if (isFinite(duration))
@@ -2112,9 +2115,9 @@ Timeline.TimelineDetailsContentHelper = class {
 
   /**
    * @param {string} title
-   * @param {!Timeline.TimelineCategory=} category
+   * @param {string=} swatchColor
    */
-  addSection(title, category) {
+  addSection(title, swatchColor) {
     if (!this._tableElement.hasChildNodes()) {
       this.element.removeChildren();
     } else {
@@ -2124,8 +2127,8 @@ Timeline.TimelineDetailsContentHelper = class {
 
     if (title) {
       var titleElement = this.element.createChild('div', 'timeline-details-chip-title');
-      if (category)
-        titleElement.createChild('div').style.backgroundColor = category.color;
+      if (swatchColor)
+        titleElement.createChild('div').style.backgroundColor = swatchColor;
       titleElement.createTextChild(title);
     }