This content originally appeared on DEV Community and was authored by wwereal
I cloned the Chrome devtools frontend source code and ran npx http-server .
. Then I visited http://127.0.0.1:8080/front_end/devtools_app.html?ws=localhost:8899
, which connects to my backend WebSocket server (localhost:8899
). The server listens for messages from the frontend and responds using the Chrome DevTools Protocol. However, the console panel displays nothing. How can I activate the console so it displays messages?
This is my backend code:
const { WebSocketServer } = require('ws');
const wss = new WebSocketServer({ port: 8899 });
wss.on('connection', function connection(ws) {
ws.on('message', function message(data) {
console.log('received: %s', data);
const message = JSON.parse(data);
if (message.method === 'Runtime.enable') {
ws.send(
JSON.stringify({
method: 'Runtime.consoleAPICalled',
params: {
args: [
{
type: 'string',
value: 'MESSAGE THAT I WANT TO SHOW IN THE CONSOLE PANEL'
}
],
executionContextId: 27,
timestamp: new Date().getTime(),
},
})
);
}
});
});
This content originally appeared on DEV Community and was authored by wwereal

wwereal | Sciencx (2024-06-24T07:39:14+00:00) WHY CAN’T I get Chrome devtools frontend to display message in the console panel through Chrome Devtools Protocol?. Retrieved from https://www.scien.cx/2024/06/24/why-cant-i-get-chrome-devtools-frontend-to-display-message-in-the-console-panel-through-chrome-devtools-protocol/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.