[DevTools]: Require explicit connection

third_party/WebKit/Source/devtools/front_end/sources/ThreadsSidebarPane.js

 // Copyright 2014 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.
 
 /**
  * @constructor
  * @extends {WebInspector.VBox}
  * @implements {WebInspector.TargetManager.Observer}
  */
 WebInspector.ThreadsSidebarPane = function()
 {
     WebInspector.VBox.call(this);
 
     /** @type {!Map.<!WebInspector.DebuggerModel, !WebInspector.UIList.Item>} */
     this._debuggerModelToListItems = new Map();
     /** @type {!Map.<!WebInspector.UIList.Item, !WebInspector.Target>} */
     this._listItemsToTargets = new Map();
     /** @type {?WebInspector.UIList.Item} */
     this._selectedListItem = null;
+    /** @type {!Map.<!WebInspector.TargetConnectionManager.Connection, !WebInspector.UIList.Item>} */
+    this._connectionToListItem = new Map();
     this.threadList = new WebInspector.UIList();
     this.threadList.show(this.element);
     WebInspector.targetManager.addModelListener(WebInspector.DebuggerModel, WebInspector.DebuggerModel.Events.DebuggerPaused, this._onDebuggerStateChanged, this);
     WebInspector.targetManager.addModelListener(WebInspector.DebuggerModel, WebInspector.DebuggerModel.Events.DebuggerResumed, this._onDebuggerStateChanged, this);
     WebInspector.targetManager.addModelListener(WebInspector.RuntimeModel, WebInspector.RuntimeModel.Events.ExecutionContextChanged, this._onExecutionContextChanged, this);
     WebInspector.context.addFlavorChangeListener(WebInspector.Target, this._targetChanged, this);
     WebInspector.targetManager.addEventListener(WebInspector.TargetManager.Events.NameChanged, this._targetNameChanged, this);
     WebInspector.targetManager.observeTargets(this);
+    WebInspector.targetConnectionManager.addEventListener(WebInspector.TargetConnectionManager.Events.ConnectionAdded, this._connectionAdded, this);

[dgozman, 2016/10/26 22:14:06]

Why can't we talk directly to SubTargetsManager, which already has the pending
connections?

+    WebInspector.targetConnectionManager.addEventListener(WebInspector.TargetConnectionManager.Events.ConnectionRemoved, this._connectionRemoved, this);
+    WebInspector.targetConnectionManager.connections().forEach(this._showConnection.bind(this));
 };
 
 WebInspector.ThreadsSidebarPane.prototype = {
     /**
      * @override
      * @param {!WebInspector.Target} target
      */
     targetAdded: function(target)
     {
         var debuggerModel = WebInspector.DebuggerModel.fromTarget(target);
         if (!debuggerModel)
             return;
 
-        var listItem = new WebInspector.UIList.Item(this._titleForTarget(target), "");
-        listItem.element.addEventListener("click", this._onListItemClick.bind(this, listItem), false);
+        var connection = WebInspector.TargetConnectionManager.Connection.fromTarget(target);
+        var listItem = (connection && this._connectionToListItem.get(connection)) || this._createListItem();

[dgozman, 2016/10/26 22:14:06]

I'd suggest to remove connections from the collection, so that we never have
both target and pending connection for it.

[eostroukhov, 2016/10/27 23:42:25]

Then target will need "disconnect" and "isDisconnectable" methods, I do not like
it :)

+        this._setupTargetItem(listItem, target);
         var currentTarget = WebInspector.context.flavor(WebInspector.Target);
         if (currentTarget === target)
             this._selectListItem(listItem);
 
         this._debuggerModelToListItems.set(debuggerModel, listItem);
         this._listItemsToTargets.set(listItem, target);
-        this.threadList.addItem(listItem);
         this._updateDebuggerState(debuggerModel);
     },
 
     /**
      * @override
      * @param {!WebInspector.Target} target
      */
     targetRemoved: function(target)
     {
         var debuggerModel = WebInspector.DebuggerModel.fromTarget(target);
         if (!debuggerModel)
             return;
         var listItem = this._debuggerModelToListItems.remove(debuggerModel);
-        if (listItem) {
-            this._listItemsToTargets.remove(listItem);
+        this._listItemsToTargets.remove(listItem);
+        this._debuggerModelToListItems.remove(debuggerModel);
+        if (!listItem)
+            return;
+        var connection = WebInspector.TargetConnectionManager.Connection.fromTarget(target)
+        if (connection && this._connectionToListItem.get(connection) === listItem) {
+            this._setupConnectionItem(listItem, connection);
+        } else {
             this.threadList.removeItem(listItem);
         }
     },
 
     /**
      * @param {!WebInspector.Event} event
      */
     _targetNameChanged: function(event)
     {
         var target = /** @type {!WebInspector.Target} */ (event.data);
@@ skipping 83 matching lines @@
 
     /**
      * @param {!WebInspector.UIList.Item} listItem
      */
     _onListItemClick: function(listItem)
     {
         WebInspector.context.setFlavor(WebInspector.Target, this._listItemsToTargets.get(listItem));
         listItem.element.scrollIntoViewIfNeeded();
     },
 
+    /**
+     * @param {!WebInspector.Event} event
+     */
+    _connectionAdded: function(event)
+    {
+        var connection =/** @type {!WebInspector.TargetConnectionManager.Connection} */ (event.data);
+        this._showConnection(connection);
+    },
+
+    /**
+     * @param {!WebInspector.Event} event
+     */
+    _connectionRemoved: function(event)
+    {
+        var connection = /** @type {!WebInspector.TargetConnectionManager.Connection} */ (event.data);
+        var listItem = this._connectionToListItem.get(connection);
+        this._connectionToListItem.delete(connection)
+        if (!listItem || this._listItemsToTargets.get(listItem))
+            return;
+        this.threadList.removeItem(listItem);
+    },
+
+    /**
+     * @return {!WebInspector.UIList.Item}
+     */
+    _createListItem: function()
+    {
+        var item = new WebInspector.UIList.Item("", "");
+        item.element.addEventListener("click", this._onListItemClick.bind(this, item), false);
+        this.threadList.addItem(item);
+        return item;
+    },
+
+    /**
+     * @param {!WebInspector.UIList.Item} item
+     * @param {!WebInspector.Target} target
+     */
+    _setupTargetItem: function(item, target)
+    {
+        item.setTitle(this._titleForTarget(target));
+        item.setSubtitle("");
+        item.setDimmed(false);
+        var connection = WebInspector.TargetConnectionManager.Connection.fromTarget(target);
+        if (connection)
+            item.setAction("Disconnect", () => connection.disconnect());
+        else
+            item.setAction(null, null);
+    },
+
+    /**
+     * @param {!WebInspector.UIList.Item} item
+     * @param {!WebInspector.TargetConnectionManager.Connection} connection
+     */
+    _setupConnectionItem: function(item, connection)
+    {
+        item.setTitle(connection.name());
+        item.setSubtitle("");
+        var clickFn = this._onListItemClick.bind(this, item);
+        item.setAction("Connect", (() => connection.connect().then(clickFn)));
+        item.setDimmed(true);
+    },
+
+    /**
+     * @param {!WebInspector.TargetConnectionManager.Connection} connection
+     */
+    _showConnection: function(connection)
+    {
+        var listItem = this._createListItem();
+        this._setupConnectionItem(listItem, connection);
+        this._connectionToListItem.set(connection, listItem);
+    },
 
     __proto__: WebInspector.VBox.prototype
 };