ChromeDevTools / debugger-protocol-viewer

DevTools Protocol API docs—its domains, methods, and events
https://chromedevtools.github.io/devtools-protocol/
Other
862 stars 172 forks source link

where can i use this API? it's not clear to me. #39

Closed faceyspacey closed 8 years ago

faceyspacey commented 9 years ago

Say, I want to build a Chrome extension, is this API just plainly available to me there? How would be able to do:

Debugger.enable()

in a chrome extension?

How about in a remote debugger outside of a chrome extension a (i.e. via Node say in a Node-Webkit app)?

I think if your documentation had a section about how to implement this API (perhaps even as the first page) it would do wonders for it.

kdzwinel commented 9 years ago

Extensions have a nice API for that - chrome.debugger . So, if you want to call Debugger.enable() you can do it like so:

chrome.debugger.attach({
  tabId: tabId
}, '1.1', () => {
  if (chrome.runtime.lastError) {
    // oh no!
  }
  // we are good
});

chrome.debugger.sendCommand({
  tabId: tabId
}, 'Debugger.enable', {}, (response) => {
  if (response.error) {
    // oh no!
  }
  // we are good
});

As for everything else (electron app, node, etc.) you have to run chrome with debugging port exposed (--remote-debugging-port=9222 flag). Go to the http://localhost:9222/json and grab web socket url for the tab that you'd like to debug. Connect to that socket and start sending commands e.g.

var ws = new WebSocket('ws://localhost:9222/devtools/page/123')
ws.onmessage = msg => console.log(JSON.parse(msg.data));
ws.send('{"id":1,"method":"Debugger.enable"}') 

@paulirish WDYT about putting some examples/useful links for people who want to play with remote debugging protocol in the Readme.md ? Or maybe even put that on the main page - https://chromedevtools.github.io/debugger-protocol-viewer/ ?

faceyspacey commented 9 years ago

and there is no js lib for all that--you have to send raw sockets messages?

..as for the Chrome extension, do they have APIs for everything you can do over sockets, and if not can you use sockets in the the chrome extension?

I imagine a library with your amazingly-documented interface available in both places as the goal here.

kdzwinel commented 9 years ago

and there is no js lib for all that--you have to send raw sockets messages?

Using a raw websocket connection is not that complex, but if you prefer a nodejs library check out chrome-remote-interface.

..as for the Chrome extension, do they have APIs for everything you can do over sockets, and if not can you use sockets in the the chrome extension?

See the docs that I linked. Debugger API provides only attach/detach/sendCommand methods. You can send all commands that are defined by the remote debugging protocol using sendCommand.

I imagine a library with your amazingly-documented interface available in both places as the goal here.

debugger-protocol-viewer is an attempt to create a better documentation for the protocol.

faceyspacey commented 9 years ago

ah, I got it...Still could be great for marketing to have a library you can use in both places. give it a nice splash page et al.

...what about debugging node? Does the protocol that Node-Inspector use to communicate to your node app look the same? How difficult do you see it being to write a converter between the 2, is there 1 to 1 matching with most the commands?

kdzwinel commented 9 years ago

Node-Inspector is based on Chrome DevTools, I'm pretty sure they are using Chrome Debugging Protocol. They may have made some adjustments though. If you are curious take a pick under the hood ;)

faceyspacey commented 9 years ago

Thanks, you can see exactly what they are doing here:

https://github.com/node-inspector/node-inspector/blob/master/lib/DebuggerAgent.js

and how it matches the API you have documented, but how it is in fact a client of the Node debugger api: https://nodejs.org/api/debugger.html

Would be nice to abstract all that out, and make the lib I'm talking about so more contribution could occur. I feel like Node Inspector needs to move a lot faster (it's buggy as hell)--perhaps that more has to do with Node itself.

kdzwinel commented 9 years ago

Would be nice to abstract all that out, and make the lib I'm talking about so more contribution could occur

That's a nice idea. Feel free to create said library!

I feel like Node Inspector needs to move a lot faster (it's buggy as hell)--perhaps that more has to do with Node itself.

https://github.com/nodejs/node/issues/2546 :)

faceyspacey commented 9 years ago

as far as debugger web GUIs, do you know any open sources ones using the Chrome Debugging Protocol that are small and not a clone of all dev tools like Node-Inspector? Like, Cloud 9 IDE has their own debugger. I'm wondering if anyone has abstracted just that part out of perhaps Node-Inspector or built their own. Node Inspector is a pretty big project, I'd like to look at something a lot smaller dealing with just the debugging aspects.

kdzwinel commented 8 years ago

Closing as this is not a valid issue. If you have any questions regarding the protocol, you can ping me at kdzwinel@gmail.com

awesome194 commented 4 years ago

:)

whygithub7 commented 4 years ago

chrome.debugger work only inside extensions ?