DevTools: insert console message decorations in order

third_party/WebKit/Source/devtools/front_end/console/ConsoleViewMessage.js

 /*
  * Copyright (C) 2011 Google Inc.  All rights reserved.
  * Copyright (C) 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * 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 32 matching lines @@
     this._repeatCount = 1;
     this._closeGroupDecorationCount = 0;
     this._nestingLevel = nestingLevel;
 
     /** @type {?DataGrid.DataGrid} */
     this._dataGrid = null;
     this._previewFormatter = new Components.RemoteObjectPreviewFormatter();
     this._searchRegex = null;
     /** @type {?UI.Icon} */
     this._messageLevelIcon = null;
+    /** @type {!Element|undefined} */
+    this._timestampElement;

[luoe, 2017/01/28 01:01:22]

Drive by

+    /** @type {!Element|undefined} */
+    this._contextIcon;
   }
 
   /**
    * @return {?SDK.Target}
    */
   _target() {
     return this.consoleMessage().target();
   }
 
   /**
@@ skipping 754 matching lines @@
     return regexObject.test(text);
   }
 
   updateTimestamp() {
     if (!this._contentElement)
       return;
 
     var format = Common.moduleSetting('consoleTimestampFormat').get();
     if (format !== Console.ConsoleViewMessage.TimestampFormat.None) {
       var timestampText = formatTimestamp(this._message.timestamp, format);
-      if (!this._timestampElement)
+      if (!this._timestampElement) {
         this._timestampElement = createElementWithClass('span', 'console-timestamp');
+        this._contentElement.insertBefore(this._timestampElement, this._contentElement.firstChild);
+      }

[luoe, 2017/01/28 01:01:22]

Drive by change

       this._timestampElement.textContent = timestampText + ' ';
       this._timestampElement.title = timestampText;
-      this._contentElement.insertBefore(this._timestampElement, this._contentElement.firstChild);
     } else if (this._timestampElement) {
       this._timestampElement.remove();
       delete this._timestampElement;
     }
 
     /**
      * @param {number} timestamp
      * @param {!Console.ConsoleViewMessage.TimestampFormat} format
      * @return {string}
      */
@@ skipping 12 matching lines @@
        * @return {string}
        */
       function leadZero(value, length) {
         var valueString = value.toString();
         var padding = length - valueString.length;
         return padding <= 0 ? valueString : '0'.repeat(padding) + valueString;
       }
     }
   }
 
+  updateContextLabel() {
+    var target = this._target();
+    if (!this._contentElement || !target)
+      return;
+
+    var show = Common.moduleSetting('consoleContextLabelsEnabled').get();
+    if (show && !this._contextIcon) {
+      var subTargetsManager = SDK.SubTargetsManager.fromTarget(target);
+      var mainTarget = target.targetManager().mainTarget();
+      var targetInfo;
+      if (subTargetsManager)
+        targetInfo = subTargetsManager.targetInfo(target);
+      else if (mainTarget && mainTarget.subTargetsManager)
+        targetInfo = mainTarget.subTargetsManager.targetInfo(target);
+      var targetType = targetInfo ? targetInfo.type : null;
+      var messageContext = target.runtimeModel.executionContext(this._message.executionContextId);
+
+      if (messageContext && messageContext.frameId && !Console.ConsoleContextSelector.isTopContext(messageContext)) {
+        if (messageContext.isDefault)
+          this._contextIcon = UI.Icon.create('smallicon-frame', 'console-context-icon');
+        else
+          this._contextIcon = UI.Icon.create('smallicon-extension', 'console-context-icon');
+      } else if (targetType === 'service_worker' || targetType === 'worker') {
+        this._contextIcon = UI.Icon.create('smallicon-worker', 'console-context-icon');
+      }
+
+      if (this._contextIcon) {
+        var subTargetName = subTargetsManager ? subTargetsManager.target().name() : null;
+        var title = subTargetName || target.name();
+        if (messageContext)
+          title = Console.ConsoleContextSelector.titleForContext(messageContext).trim();
+        this._contextIcon.title = title;
+        this._contentElement.insertBefore(this._contextIcon, this._contentElement.firstChild);
+      }
+    } else if (this._contextIcon && !show) {
+      this._contextIcon.remove();
+      delete this._contextIcon;
+    }
+  }
+
   /**
    * @return {number}
    */
   nestingLevel() {
     return this._nestingLevel;
   }
 
   resetCloseGroupDecorationCount() {
     if (!this._closeGroupDecorationCount)
       return;
@@ skipping 39 matching lines @@
                                         consoleMessage.type === SDK.ConsoleMessage.MessageType.Trace ||
                                         consoleMessage.level === SDK.ConsoleMessage.MessageLevel.Warning);
     if (target && shouldIncludeTrace)
       formattedMessage = this._buildMessageWithStackTrace(consoleMessage, target, this._linkifier);
     else if (this._message.type === SDK.ConsoleMessage.MessageType.Table)
       formattedMessage = this._buildTableMessage(this._message);
     else
       formattedMessage = this._buildMessage(consoleMessage);
     contentElement.appendChild(formattedMessage);
 
+    this.updateContextLabel();
     this.updateTimestamp();
     return this._contentElement;
   }
 
   /**
    * @return {!Element}
    */
   toMessageElement() {
     if (this._element)
       return this._element;
@@ skipping 314 matching lines @@
   toMessageElement() {
     if (!this._element) {
       super.toMessageElement();
       this._expandGroupIcon = UI.Icon.create('', 'expand-group-icon');
       this._contentElement.insertBefore(this._expandGroupIcon, this._contentElement.firstChild);
       this.setCollapsed(this._collapsed);
     }
     return this._element;
   }
 };