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._contextLabelElement;
   }
 
   /**
    * @return {?SDK.Target}
    */
   _target() {
     return this.consoleMessage().target();
   }
 
   /**
@@ skipping 753 matching lines @@
   }
 
   /**
    * @param {boolean} show
    */
   updateTimestamp(show) {
     if (!this._contentElement)
       return;
 
     if (show && !this.timestampElement) {
+      var timeStampText = (new Date(this._message.timestamp)).toConsoleTime() + ' ';
       this.timestampElement = createElementWithClass('span', 'console-timestamp');
-      this.timestampElement.textContent = (new Date(this._message.timestamp)).toConsoleTime() + ' ';
+      this.timestampElement.title = timeStampText;
+      this.timestampElement.createChild('span', 'console-timestamp-visible').textContent = timeStampText;
       this._contentElement.insertBefore(this.timestampElement, this._contentElement.firstChild);
       return;
     }
 
     if (!show && this.timestampElement) {
       this.timestampElement.remove();
       delete this.timestampElement;
     }
   }
 
+  updateContextLabel() {
+    var target = this._target();
+    if (!this._contentElement || !target)
+      return;
+    if (!this._contextLabelElement) {
+      this._contextLabelElement = createElementWithClass('span', 'console-context-label');
+      this._contentElement.insertBefore(this._contextLabelElement, this._contentElement.firstChild);
+    }
+    this._contextLabelElement.textContent = '';

[allada, 2017/01/19 02:38:08]

Lets move these to the end of the function and store the data that will be in
them in local variables.

[luoe, 2017/01/19 23:22:59]

Done.

+    this._contextLabelElement.title = '';
+
+    // Logs from scripts, extensions, and service workers have a labeled execution context. Iframes have a more useful
+    // frame title. Unlabeled cases include worker messages with source != 'worker' or no workerId and uncaught errors.
+    var messageContext = target.runtimeModel.executionContext(this._message.executionContextId);
+    var currentContext = UI.context.flavor(SDK.ExecutionContext);
+    if (messageContext && messageContext !== currentContext) {
+      var labelText = Console.ConsoleContextSelector.titleFor(messageContext, false /* showStatus */);
+      this._contextLabelElement.textContent = labelText + ' ';
+      this._contextLabelElement.title = labelText;
+    }
+  }
+
   /**
    * @return {number}
    */
   nestingLevel() {
     return this._nestingLevel;
   }
 
   resetCloseGroupDecorationCount() {
     if (!this._closeGroupDecorationCount)
       return;
@@ skipping 40 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(Common.moduleSetting('consoleTimestampsEnabled').get());
     return this._contentElement;
   }
 
   /**
    * @return {!Element}
    */
   toMessageElement() {
     if (this._element)
       return this._element;
@@ skipping 300 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;
   }
 };