DevTools: insert console message decorations in order

third_party/WebKit/Source/devtools/front_end/console/ConsoleContextSelector.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.
 /**
  * @implements {SDK.TargetManager.Observer}
  * @unrestricted
  */
 Console.ConsoleContextSelector = class {
   /**
+   * @param {!SDK.ExecutionContext} executionContext
+   * @param {boolean} showStatus
+   * @return {string}
+   */
+  static titleFor(executionContext, showStatus) {

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

I feel like this isn't very descriptive, I would suggest something like:
"titleForContext" or something.

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

Done.

+    var result;
+    if (executionContext.isDefault) {

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

I suggest something more like:

if (executionContext.isDefault && executionContext.frameId) {
  var resourceTreeModel =
SDK.ResourceTreeModel.fromTarget(executionContext.target());
  var frame = resourceTreeModel &&
resourceTreeModel.frameForId(executionContext.frameId);
  result = frame ? frame.displayName() : executionContext.label(showStatus);
} else if(executionContext.isDefault) {
  result =
executionContext.target().decorateLabel(executionContext.label(showStatus));
} else {
  result = executionContext.label(showStatus) || executionContext.origin;
}

+      if (executionContext.frameId) {
+        var resourceTreeModel = SDK.ResourceTreeModel.fromTarget(executionContext.target());
+        var frame = resourceTreeModel && resourceTreeModel.frameForId(executionContext.frameId);
+        result = frame ? frame.displayName() : executionContext.label(showStatus);
+      } else {
+        result = executionContext.target().decorateLabel(executionContext.label(showStatus));
+      }
+    } else {
+      result = executionContext.label(showStatus) || executionContext.origin;
+    }
+
+    var maxLength = 50;

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

nit: inline or change this to const.

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

Done.

+    return result.trimMiddle(maxLength);
+  }
+
+  /**
    * @param {!Element} selectElement
    */
   constructor(selectElement) {
     this._selectElement = selectElement;
     /**
      * @type {!Map.<!SDK.ExecutionContext, !Element>}
      */
     this._optionByExecutionContext = new Map();
 
     SDK.targetManager.observeTargets(this);
     SDK.targetManager.addModelListener(
         SDK.RuntimeModel, SDK.RuntimeModel.Events.ExecutionContextCreated, this._onExecutionContextCreated, this);
     SDK.targetManager.addModelListener(
         SDK.RuntimeModel, SDK.RuntimeModel.Events.ExecutionContextChanged, this._onExecutionContextChanged, this);
     SDK.targetManager.addModelListener(
         SDK.RuntimeModel, SDK.RuntimeModel.Events.ExecutionContextDestroyed, this._onExecutionContextDestroyed, this);
 
     this._selectElement.addEventListener('change', this._executionContextChanged.bind(this), false);
     UI.context.addFlavorChangeListener(SDK.ExecutionContext, this._executionContextChangedExternally, this);
   }
 
   /**
    * @param {!SDK.ExecutionContext} executionContext
-   * @return {string}
-   */
-  _titleFor(executionContext) {
-    var result;
-    if (executionContext.isDefault) {
-      if (executionContext.frameId) {
-        var resourceTreeModel = SDK.ResourceTreeModel.fromTarget(executionContext.target());
-        var frame = resourceTreeModel && resourceTreeModel.frameForId(executionContext.frameId);
-        result = frame ? frame.displayName() : executionContext.label();
-      } else {
-        result = executionContext.target().decorateLabel(executionContext.label());
-      }
-    } else {
-      result = '\u00a0\u00a0\u00a0\u00a0' + (executionContext.label() || executionContext.origin);

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

Looks like this unicode stuff was used for indenting for drop down context. Lets
move the indenting aspect to the dropdown specific code and let it choose when
to indent it or not.

-    }
-
-    var maxLength = 50;
-    return result.trimMiddle(maxLength);
-  }
-
-  /**
-   * @param {!SDK.ExecutionContext} executionContext
    */
   _executionContextCreated(executionContext) {
     // FIXME(413886): We never want to show execution context for the main thread of shadow page in service/shared worker frontend.
     // This check could be removed once we do not send this context to frontend.
     if (!executionContext.target().hasJSCapability())
       return;
 
     var newOption = createElement('option');
     newOption.__executionContext = executionContext;
-    newOption.text = this._titleFor(executionContext);
+    newOption.text = Console.ConsoleContextSelector.titleFor(executionContext, true /* showStatus */);
     this._optionByExecutionContext.set(executionContext, newOption);
     var options = this._selectElement.options;
     var contexts = Array.prototype.map.call(options, mapping);
     var index = contexts.lowerBound(executionContext, executionContext.runtimeModel.executionContextComparator());
     this._selectElement.insertBefore(newOption, options[index]);
 
     if (executionContext === UI.context.flavor(SDK.ExecutionContext))
       this._select(newOption);
 
     /**
@@ skipping 14 matching lines @@
     this._updateSelectionWarning();
   }
 
   /**
    * @param {!Common.Event} event
    */
   _onExecutionContextChanged(event) {
     var executionContext = /** @type {!SDK.ExecutionContext} */ (event.data);
     var option = this._optionByExecutionContext.get(executionContext);
     if (option)
-      option.text = this._titleFor(executionContext);
+      option.text = Console.ConsoleContextSelector.titleFor(executionContext, true /* showStatus */);
     this._updateSelectionWarning();
   }
 
   /**
    * @param {!SDK.ExecutionContext} executionContext
    */
   _executionContextDestroyed(executionContext) {
     var option = this._optionByExecutionContext.remove(executionContext);
     option.remove();
   }
@@ skipping 91 matching lines @@
 
   /**
    * @return {?Element}
    */
   _selectedOption() {
     if (this._selectElement.selectedIndex >= 0)
       return this._selectElement[this._selectElement.selectedIndex];
     return null;
   }
 };