Skip to content

Commit 2b33738

Browse files
jasonLasterjasonLaster
authored
Update Node (firefox-devtools#1295)
Upgrade to using the json/list http endpoint. This makes the Node setup more consistent with chrome
1 parent c02348e commit 2b33738

15 files changed

Lines changed: 137 additions & 78 deletions

File tree

‎configs/application.json‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,13 @@
1515
},
1616
"chrome": {
1717
"debug": true,
18-
"webSocketPort": 9222
18+
"host": "localhost",
19+
"port": 9222
20+
},
21+
"node": {
22+
"debug": true,
23+
"host": "localhost",
24+
"port": 9229
1925
},
2026
"firefox": {
2127
"webSocketConnection": false,

‎configs/development.json‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,13 @@
1515
},
1616
"chrome": {
1717
"debug": true,
18-
"webSocketPort": 9222
18+
"host": "localhost",
19+
"port": 9222
20+
},
21+
"node": {
22+
"debug": true,
23+
"host": "localhost",
24+
"port": 9229
1925
},
2026
"firefox": {
2127
"webSocketConnection": false,

‎packages/devtools-local-toolbox/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@
3838
"babel-register": "^6.18.0",
3939
"body-parser": "^1.15.0",
4040
"check-node-version": "^1.1.2",
41-
"chrome-remote-debugging-protocol": "0.0.10",
41+
"chrome-remote-debugging-protocol": "0.0.11",
4242
"classnames": "^2.2.5",
4343
"co": "=4.6.0",
4444
"css-loader": "^0.25.0",

‎packages/devtools-local-toolbox/src/clients/chrome.js‎

Lines changed: 54 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -16,20 +16,18 @@ Array.prototype.peekLast = function() {
1616

1717
let connection;
1818

19-
function createTabs(tabs) {
20-
19+
function createTabs(tabs, {type, clientType}) {
2120
return tabs
2221
.filter(tab => {
23-
const isPage = tab.type == "page";
24-
return isPage;
22+
return tab.type == type;
2523
})
2624
.map(tab => {
2725
return Tab({
2826
title: tab.title,
2927
url: tab.url,
3028
id: tab.id,
3129
tab,
32-
browser: "chrome"
30+
clientType
3331
});
3432
});
3533
}
@@ -41,48 +39,83 @@ function connectClient() {
4139
return Promise.resolve(createTabs([]))
4240
}
4341

44-
const webSocketPort = getValue("chrome.webSocketPort");
45-
const url = `http://localhost:${webSocketPort}/json/list`;
42+
const port = getValue("chrome.port");
43+
const host = getValue("chrome.host");
44+
const url = `http://${host}:${port}/json/list`;
45+
4646
networkRequest(url).then(res => {
47-
deferred.resolve(createTabs(JSON.parse(res.content)))
48-
}).catch(() => deferred.reject());
47+
deferred.resolve(createTabs(
48+
JSON.parse(res.content),
49+
{clientType: "chrome", type: "page"}
50+
))
51+
}).catch(err => deferred.reject());
4952

5053
return deferred.promise;
5154
}
5255

53-
function connectTab(tab) {
54-
return connect(tab.webSocketDebuggerUrl).then(conn => {
55-
connection = conn;
56+
57+
function connectNodeClient() {
58+
const deferred = defer();
59+
60+
if(!getValue("node.debug")) {
61+
return Promise.resolve(createTabs([]))
62+
}
63+
64+
const host = getValue("node.host");
65+
const port = getValue("node.port");
66+
const url = `http://${host}:${port}/json/list`;
67+
68+
networkRequest(url).then(res => {
69+
deferred.resolve(createTabs(
70+
JSON.parse(res.content),
71+
{clientType: "node", type: "node"}
72+
))
73+
}).catch(err => {
74+
console.log(err);
75+
deferred.reject();
5676
});
77+
78+
return deferred.promise;
5779
}
5880

59-
function connectNode(url) {
60-
return connect(url).then(conn => {
61-
connection = conn;
62-
});
81+
function connectTab(tab) {
82+
return connect(tab.webSocketDebuggerUrl, {type: "browser"})
83+
.then(conn => { connection = conn });
84+
}
85+
86+
function connectNode(tab) {
87+
return connect(tab.webSocketDebuggerUrl, {type: "node"})
88+
.then(conn => { connection = conn });
6389
}
6490

65-
function initPage(actions) {
91+
function initPage(actions, { clientType }) {
6692
const agents = connection._agents;
6793

68-
setupCommands({ agents: agents });
69-
setupEvents({ actions, agents })
94+
setupCommands({ agents, clientType });
95+
setupEvents({ actions, agents, clientType })
7096

7197
agents.Debugger.enable();
7298
agents.Debugger.setPauseOnExceptions("none");
7399
agents.Debugger.setAsyncCallStackDepth(0);
74100

75101
agents.Runtime.enable();
76-
agents.Runtime.run();
77102

78-
agents.Page.enable();
103+
if (clientType == "node") {
104+
agents.Runtime.runIfWaitingForDebugger()
105+
}
106+
107+
if (clientType == "chrome") {
108+
agents.Page.enable();
109+
}
110+
79111

80112
connection.registerDispatcher("Debugger", clientEvents);
81113
connection.registerDispatcher("Page", pageEvents);
82114
}
83115

84116
module.exports = {
85117
connectClient,
118+
connectNodeClient,
86119
clientCommands,
87120
connectNode,
88121
connectTab,

‎packages/devtools-local-toolbox/src/clients/chrome/events.js‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ let pageAgent;
66
function setupEvents(dependencies) {
77
actions = dependencies.actions;
88
pageAgent = dependencies.agents.Page;
9+
clientType = dependencies.clientType;
910
}
1011

1112
// Debugger Events
@@ -17,6 +18,10 @@ function scriptParsed(scriptId, url, startLine, startColumn,
1718
return;
1819
}
1920

21+
if (clientType == "node") {
22+
sourceMapURL = undefined;
23+
}
24+
2025
actions.newSource(Source({
2126
id: scriptId,
2227
url,
@@ -46,13 +51,18 @@ async function paused(
4651
type: reason
4752
}, data);
4853

49-
pageAgent.setOverlayMessage("Paused in debugger.html");
54+
if (clientType == "chrome") {
55+
pageAgent.setOverlayMessage("Paused in debugger.html");
56+
}
5057

5158
await actions.paused({ frame, why, frames });
5259
}
5360

5461
function resumed() {
55-
pageAgent.setOverlayMessage(undefined);
62+
if (clientType == "chrome") {
63+
pageAgent.setOverlayMessage(undefined);
64+
}
65+
5666
actions.resumed();
5767
}
5868

‎packages/devtools-local-toolbox/src/clients/firefox.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ function createTabs(tabs) {
3838
url: tab.url,
3939
id: tab.actor,
4040
tab,
41-
browser: "firefox"
41+
clientType: "firefox"
4242
});
4343
});
4444
}

‎packages/devtools-local-toolbox/src/clients/index.js‎

Lines changed: 18 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,9 @@ const chrome = require("./chrome");
44
const { debugGlobal } = require("../utils/debug");
55
const { createSource } = require("./firefox/create");
66

7-
let clientType;
7+
let clientType = null;
88
function getClient() {
9-
if (clientType === "chrome") {
9+
if (clientType === "chrome" || clientType === "node") {
1010
return chrome.clientCommands;
1111
}
1212

@@ -22,10 +22,19 @@ function startDebugging(connTarget, actions) {
2222
return startDebuggingTab(target, connTarget.param, actions);
2323
}
2424

25-
function startDebuggingNode(url, actions) {
26-
clientType = "chrome";
27-
return chrome.connectNode(`ws://${url}`).then(() => {
28-
chrome.initPage(actions);
25+
function startDebuggingNode(tabId, actions) {
26+
return Task.spawn(function* () {
27+
clientType = "node";
28+
29+
const tabs = yield chrome.connectNodeClient();
30+
const tab = tabs.find(t => t.id.indexOf(tabId) !== -1);
31+
32+
yield chrome.connectNode(tab.tab);
33+
chrome.initPage(actions, { clientType });
34+
35+
debugGlobal("client", chrome.clientCommands);
36+
37+
return { tabs, tab, client: chrome };
2938
});
3039
}
3140

@@ -34,12 +43,13 @@ function startDebuggingTab(targetEnv, tabId, actions) {
3443
const tabs = yield targetEnv.connectClient();
3544
const tab = tabs.find(t => t.id.indexOf(tabId) !== -1);
3645
yield targetEnv.connectTab(tab.tab);
37-
targetEnv.initPage(actions);
3846

3947
clientType = targetEnv === firefox ? "firefox" : "chrome";
48+
targetEnv.initPage(actions, { clientType });
49+
4050
debugGlobal("client", targetEnv.clientCommands);
4151

42-
return { tabs, client: targetEnv };
52+
return { tabs, tab, client: targetEnv };
4353
});
4454
}
4555

‎packages/devtools-local-toolbox/src/components/LandingPage.js‎

Lines changed: 7 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,9 @@ const ImPropTypes = require("react-immutable-proptypes");
1010

1111
const githubUrl = "https://github.com/devtools-html/debugger.html/blob/master";
1212

13-
function getTabsByBrowser(tabs, browser) {
13+
function getTabsByClientType(tabs, clientType) {
1414
return tabs.valueSeq()
15-
.filter(tab => tab.get("browser") == browser);
15+
.filter(tab => tab.get("clientType") == clientType);
1616
}
1717

1818
function firstTimeMessage(title, urlPart) {
@@ -67,7 +67,7 @@ const LandingPage = React.createClass({
6767
},
6868

6969
renderFirefoxPanel() {
70-
const targets = getTabsByBrowser(this.props.tabs, "firefox");
70+
const targets = getTabsByClientType(this.props.tabs, "firefox");
7171
return dom.div(
7272
{ className: "center" },
7373
this.renderTabs("", targets, "firefox-tab"),
@@ -76,7 +76,7 @@ const LandingPage = React.createClass({
7676
},
7777

7878
renderChromePanel() {
79-
const targets = getTabsByBrowser(this.props.tabs, "chrome");
79+
const targets = getTabsByClientType(this.props.tabs, "chrome");
8080
return dom.div(
8181
{ className: "center" },
8282
this.renderTabs("", targets, "chrome-tab"),
@@ -85,18 +85,11 @@ const LandingPage = React.createClass({
8585
},
8686

8787
renderNodePanel() {
88+
const targets = getTabsByClientType(this.props.tabs, "node");
8889
return dom.div(
8990
{ className: "center" },
90-
dom.div(
91-
{ className: "center-message" },
92-
dom.a(
93-
{
94-
href: `/?ws=${document.location.hostname}:9229/node`
95-
},
96-
"Connect to Node"
97-
)
98-
),
99-
firstTimeMessage("Node", "nodejs")
91+
this.renderTabs("", targets, "node-tab"),
92+
firstTimeMessage("Node", "node")
10093
);
10194
},
10295

‎packages/devtools-local-toolbox/src/index.js‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ function renderRoot(_React, _ReactDOM, component, _store) {
7979

8080
function getTargetFromQuery() {
8181
const href = window.location.href;
82-
const nodeMatch = href.match(/ws=([^&#]*)/);
82+
const nodeMatch = href.match(/node-tab=([^&#]*)/);
8383
const firefoxMatch = href.match(/firefox-tab=([^&#]*)/);
8484
const chromeMatch = href.match(/chrome-tab=([^&#]*)/);
8585

@@ -98,9 +98,9 @@ function bootstrap(React, ReactDOM, App, appActions, appStore) {
9898
const connTarget = getTargetFromQuery();
9999
if (connTarget) {
100100
return startDebugging(connTarget, appActions)
101-
.then(({ tabs, client }) => {
101+
.then(({ tab, client }) => {
102102
renderRoot(React, ReactDOM, App, appStore);
103-
return { connTarget, client };
103+
return { tab, connTarget, client };
104104
});
105105
} else {
106106
const { store, actions, LandingPage } = initApp();
@@ -111,6 +111,9 @@ function bootstrap(React, ReactDOM, App, appActions, appStore) {
111111
console.log("Connect to chrome:");
112112
console.log("https://github.com/devtools-html/debugger.html/blob/master/CONTRIBUTING.md#chrome");
113113
});
114+
chrome.connectNodeClient().then(tabs => {
115+
actions.newTabs(tabs);
116+
});
114117
return firefox.connectClient().then(tabs => {
115118
actions.newTabs(tabs);
116119
});

‎packages/devtools-local-toolbox/src/reducers/tabs.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ function update(state = initialState, action) {
3636

3737
function getTabId(tab) {
3838
let id = tab.id;
39-
const isFirefox = tab.browser == "firefox";
39+
const isFirefox = tab.clientType == "firefox";
4040

4141
// NOTE: we're getting the last part of the actor because
4242
// we want to ignore the connection id

0 commit comments

Comments
 (0)