[Devtools] Execution context in console shows product experiment

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.SDKModelObserver<!SDK.RuntimeModel>}
  * @unrestricted
  */
 Console.ConsoleContextSelector = class {
   /**
    * @param {!Element} selectElement
    */
   constructor(selectElement) {
     this._selectElement = selectElement;
     /**
      * @type {!Map.<!SDK.ExecutionContext, !Element>}
      */
     this._optionByExecutionContext = new Map();
 
     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.RuntimeModel, SDK.RuntimeModel.Events.ExecutionContextChanged,
+        event => this._refreshTitle(/** @type {!SDK.ExecutionContext} */ (event.data)));
     SDK.targetManager.addModelListener(
         SDK.RuntimeModel, SDK.RuntimeModel.Events.ExecutionContextDestroyed, this._onExecutionContextDestroyed, this);
 
+    /**
+     * @type {?Console.ConsoleFrameNameLookupInterface}
+     */
+    this._frameNameLookupInstance = null;
+    var extension = self.runtime.extension(Console.ConsoleFrameNameLookupInterface);
+    if (extension) {
+      extension.instance().then(instance => {

[pfeldman, 2017/04/04 19:03:15]

That's super early. We are creating this all upon front-end creation. We should
delay this by default + trigger on demand (wasShown).

[allada, 2017/04/05 01:49:45]

Done.

+        this._frameNameLookupInstance = instance;
+        this._optionByExecutionContext.keysArray().forEach(this._refreshTitle.bind(this));
+      });
+    }
+
     this._selectElement.addEventListener('change', this._executionContextChanged.bind(this), false);
     UI.context.addFlavorChangeListener(SDK.ExecutionContext, this._executionContextChangedExternally, this);
     SDK.targetManager.observeModels(SDK.RuntimeModel, this);
   }
 
   /**
    * @param {!SDK.ExecutionContext} executionContext
    * @return {string}
    */
   _titleFor(executionContext) {
     var target = executionContext.target();
     var depth = 0;
     var label = executionContext.label() ? target.decorateLabel(executionContext.label()) : '';
     if (!executionContext.isDefault)
       depth++;
     if (executionContext.frameId) {
       var resourceTreeModel = SDK.ResourceTreeModel.fromTarget(target);
       var frame = resourceTreeModel && resourceTreeModel.frameForId(executionContext.frameId);
       if (frame) {
         label = label || frame.displayName();
+        if (this._frameNameLookupInstance) {
+          var productName = this._frameNameLookupInstance.nameForFrame(frame);
+          if (productName)
+            label = productName.trimMiddle(15) + ' / ' + label;

[caseq, 2017/04/04 18:59:40]

Why not trimEnd()? Also,
label = Common.UIString('%s / %s', ..., label);

[allada, 2017/04/05 01:49:45]

We can trimEnd() I was playing around with it and I thought it looked better
when trimMiddle mostly because "..." does not look good next to "/".

Done.

+        }
         while (frame.parentFrame) {
           depth++;
           frame = frame.parentFrame;
         }
       }
     }
     label = label || executionContext.origin;
     var targetDepth = 0;
     while (target.parentTarget()) {
       if (target.parentTarget().hasJSCapability()) {
         targetDepth++;
       } else {
         // Special casing service workers to be top-level.
         targetDepth = 0;
         break;
       }
       target = target.parentTarget();
     }
 
     depth += targetDepth;
     var prefix = new Array(4 * depth + 1).join('\u00a0');
     var maxLength = 50;
     return (prefix + label).trimMiddle(maxLength);
   }
 
   /**
    * @param {!SDK.ExecutionContext} executionContext
    */
+  _refreshTitle(executionContext) {
+    var option = this._optionByExecutionContext.get(executionContext);
+    if (option)
+      option.text = this._titleFor(executionContext);
+    this._updateSelectionWarning();
+  }
+
+  /**
+   * @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);
     this._optionByExecutionContext.set(executionContext, newOption);
+    this._refreshTitle(executionContext);
     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);
 
     /**
      * @param {!Element} option
      * @return {!SDK.ExecutionContext}
      */
     function mapping(option) {
       return option.__executionContext;
     }
   }
 
   /**
    * @param {!Common.Event} event
    */
   _onExecutionContextCreated(event) {
     var executionContext = /** @type {!SDK.ExecutionContext} */ (event.data);
     this._executionContextCreated(executionContext);
     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);
-    this._updateSelectionWarning();
-  }
-
-  /**
    * @param {!SDK.ExecutionContext} executionContext
    */
   _executionContextDestroyed(executionContext) {
     var option = this._optionByExecutionContext.remove(executionContext);
     option.remove();
   }
 
   /**
    * @param {!Common.Event} event
    */
@@ skipping 87 matching lines @@
 
   /**
    * @return {?Element}
    */
   _selectedOption() {
     if (this._selectElement.selectedIndex >= 0)
       return this._selectElement[this._selectElement.selectedIndex];
     return null;
   }
 };
+
+/**
+ * @interface
+ */
+Console.ConsoleFrameNameLookupInterface = function() {};
+
+Console.ConsoleFrameNameLookupInterface.prototype = {
+  /**
+   * @param {!SDK.ResourceTreeFrame} frame
+   * @return {?string}
+   */
+  nameForFrame(frame) {}
+};