diff --git a/BUILD.gn b/BUILD.gn index 1e25aae50f..8c189c34af 100644 --- a/BUILD.gn +++ b/BUILD.gn @@ -303,7 +303,6 @@ all_devtools_files = [ "front_end/main/GCActionDelegate.js", "front_end/main/Main.js", "front_end/main/module.json", - "front_end/main/nodeIcon.css", "front_end/main/remoteDebuggingTerminatedScreen.css", "front_end/main/renderingOptions.css", "front_end/main/RenderingOptions.js", @@ -819,7 +818,6 @@ devtools_image_files = [ "front_end/Images/ic_warning_black_18dp.svg", "front_end/Images/navigationControls.png", "front_end/Images/navigationControls_2x.png", - "front_end/Images/nodeIcon.png", "front_end/Images/popoverArrows.png", "front_end/Images/profileGroupIcon.png", "front_end/Images/profileIcon.png", diff --git a/front_end/Images/nodeIcon.png b/front_end/Images/nodeIcon.png deleted file mode 100644 index a7929a98eb..0000000000 Binary files a/front_end/Images/nodeIcon.png and /dev/null differ diff --git a/front_end/main/Main.js b/front_end/main/Main.js index 29add33e2d..4cf1200b83 100644 --- a/front_end/main/Main.js +++ b/front_end/main/Main.js @@ -728,37 +728,6 @@ Main.Main.MainMenuItem = class { } }; -/** - * @implements {UI.ToolbarItem.Provider} - */ -Main.Main.NodeIndicator = class { - constructor() { - var element = createElement('div'); - var shadowRoot = UI.createShadowRootWithCoreStyles(element, 'main/nodeIcon.css'); - this._element = shadowRoot.createChild('div', 'node-icon'); - element.addEventListener('click', () => InspectorFrontendHost.openNodeFrontend(), false); - this._button = new UI.ToolbarItem(element); - this._button.setTitle(Common.UIString('Open dedicated DevTools for Node.js')); - SDK.targetManager.addEventListener(SDK.TargetManager.Events.AvailableNodeTargetsChanged, this._update, this); - this._button.setVisible(false); - this._update(); - } - - _update() { - this._element.classList.toggle('inactive', !SDK.targetManager.availableNodeTargetsCount()); - if (SDK.targetManager.availableNodeTargetsCount()) - this._button.setVisible(true); - } - - /** - * @override - * @return {?UI.ToolbarItem} - */ - item() { - return this._button; - } -}; - Main.NetworkPanelIndicator = class { constructor() { // TODO: we should not access network from other modules. diff --git a/front_end/main/module.json b/front_end/main/module.json index 538e46319b..591621bfbf 100644 --- a/front_end/main/module.json +++ b/front_end/main/module.json @@ -202,13 +202,6 @@ "location": "main-toolbar-left", "order": 100 }, - { - "type": "@UI.ToolbarItem.Provider", - "className": "Main.Main.NodeIndicator", - "order": 2, - "location": "main-toolbar-left", - "condition": "!nodeFrontend" - }, { "type": "@UI.ToolbarItem.Provider", "className": "Main.Main.WarningErrorCounter", @@ -448,7 +441,6 @@ ], "resources": [ "errorWarningCounter.css", - "nodeIcon.css", "remoteDebuggingTerminatedScreen.css", "renderingOptions.css", "targetCrashedScreen.css" diff --git a/front_end/main/nodeIcon.css b/front_end/main/nodeIcon.css deleted file mode 100644 index 326247d333..0000000000 --- a/front_end/main/nodeIcon.css +++ /dev/null @@ -1,23 +0,0 @@ -/* - * Copyright 2017 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. - */ - -.node-icon { - width: 28px; - height: 26px; - background-image: url(Images/nodeIcon.png); - background-size: 17px 17px; - background-repeat: no-repeat; - background-position: center; - opacity: 0.8; -} - -.node-icon:hover { - opacity: 1.0; -} - -.node-icon.inactive { - filter: grayscale(100%); -} diff --git a/front_end/sdk/TargetManager.js b/front_end/sdk/TargetManager.js index eeb0e03da4..cc8ee55fe6 100644 --- a/front_end/sdk/TargetManager.js +++ b/front_end/sdk/TargetManager.js @@ -328,9 +328,9 @@ SDK.TargetManager = class extends Common.Object { _connectAndCreateMainTarget() { if (Runtime.queryParam('nodeFrontend')) { var target = new SDK.Target( - this, 'main', Common.UIString('Node.js'), SDK.Target.Capability.Target, this._createMainConnection.bind(this), + this, 'main', Common.UIString('Node'), SDK.Target.Capability.Target, this._createMainConnection.bind(this), null); - target.setInspectedURL('Node.js'); + target.setInspectedURL('Node'); this._childTargetManagers.set(target, new SDK.ChildTargetManager(this, target)); Host.userMetrics.actionTaken(Host.UserMetrics.Action.ConnectToNodeJSFromFrontend); return; @@ -410,15 +410,13 @@ SDK.ChildTargetManager = class { if (Runtime.experiments.isEnabled('autoAttachToCrossProcessSubframes')) this._targetAgent.setAttachToFrames(true); - if (!parentTarget.parentTarget()) { + if (!parentTarget.parentTarget()) this._targetAgent.setDiscoverTargets(true); - if (Runtime.queryParam('nodeFrontend')) { - InspectorFrontendHost.setDevicesUpdatesEnabled(true); - InspectorFrontendHost.events.addEventListener( - InspectorFrontendHostAPI.Events.DevicesDiscoveryConfigChanged, this._devicesDiscoveryConfigChanged, this); - } else { - this._targetAgent.setRemoteLocations([{host: 'localhost', port: 9229}]); - } + + if (Runtime.queryParam('nodeFrontend') && !this._parentTarget.parentTarget()) { + InspectorFrontendHost.setDevicesUpdatesEnabled(true); + InspectorFrontendHost.events.addEventListener( + InspectorFrontendHostAPI.Events.DevicesDiscoveryConfigChanged, this._devicesDiscoveryConfigChanged, this); } } @@ -431,8 +429,7 @@ SDK.ChildTargetManager = class { for (var address of config.networkDiscoveryConfig) { var parts = address.split(':'); var port = parseInt(parts[1], 10); - if (parts[0] && port) - locations.push({host: parts[0], port: port}); + locations.push({host: parts[0] || 'localhost', port: port || 9229}); } this._targetAgent.setRemoteLocations(locations); } @@ -516,7 +513,7 @@ SDK.ChildTargetManager = class { attachedToTarget(targetInfo, waitingForDebugger) { var targetName = ''; if (targetInfo.type === 'node') { - targetName = Common.UIString('Node.js: %s', targetInfo.url); + targetName = Common.UIString('Node: %s', targetInfo.url); } else if (targetInfo.type !== 'iframe') { var parsedURL = targetInfo.url.asParsedURL(); targetName = diff --git a/front_end/sources/ThreadsSidebarPane.js b/front_end/sources/ThreadsSidebarPane.js index 0abf5a482d..7ce72ce12b 100644 --- a/front_end/sources/ThreadsSidebarPane.js +++ b/front_end/sources/ThreadsSidebarPane.js @@ -16,7 +16,14 @@ Sources.ThreadsSidebarPane = class extends UI.VBox { this._list = new UI.ListControl(this._items, this, UI.ListMode.NonViewport); this.contentElement.appendChild(this._list.element); + this._availableNodeTargetsElement = this.contentElement.createChild('div', 'hidden available-node-targets'); + UI.context.addFlavorChangeListener(SDK.Target, this._targetFlavorChanged, this); + + SDK.targetManager.addEventListener( + SDK.TargetManager.Events.AvailableNodeTargetsChanged, this._availableNodeTargetsChanged, this); + this._availableNodeTargetsChanged(); + SDK.targetManager.observeModels(SDK.DebuggerModel, this); } @@ -25,7 +32,27 @@ Sources.ThreadsSidebarPane = class extends UI.VBox { */ static shouldBeShown() { var minJSTargets = Runtime.queryParam('nodeFrontend') ? 1 : 2; - return SDK.targetManager.models(SDK.DebuggerModel).length >= minJSTargets; + if (SDK.targetManager.models(SDK.DebuggerModel).length >= minJSTargets) + return true; + return !!SDK.targetManager.availableNodeTargetsCount(); + } + + _availableNodeTargetsChanged() { + var count = SDK.targetManager.availableNodeTargetsCount(); + if (!count) { + this._availableNodeTargetsElement.classList.add('hidden'); + return; + } + this._availableNodeTargetsElement.removeChildren(); + this._availableNodeTargetsElement.createTextChild( + count === 1 ? Common.UIString('Node instance available.') : + Common.UIString('%d Node instances available.', count)); + var link = this._availableNodeTargetsElement.createChild('span', 'link'); + link.textContent = Common.UIString('Connect'); + link.addEventListener('click', () => { + InspectorFrontendHost.openNodeFrontend(); + }, false); + this._availableNodeTargetsElement.classList.remove('hidden'); } /** diff --git a/front_end/sources/threadsSidebarPane.css b/front_end/sources/threadsSidebarPane.css index 6863de6d1e..f4a8d8fde5 100644 --- a/front_end/sources/threadsSidebarPane.css +++ b/front_end/sources/threadsSidebarPane.css @@ -4,6 +4,20 @@ * found in the LICENSE file. */ +.available-node-targets { + height: 22px; + display: flex; + align-items: center; + justify-content: flex-start; + padding-left: 20px; + border-top: 1px solid #eee; + font-style: italic; +} + +.available-node-targets > span { + margin-left: 5px; +} + .thread-item { padding: 3px 8px 3px 20px; position: relative;