cyrus-and / chrome-remote-interface

Chrome Debugging Protocol interface for Node.js
MIT License
4.28k stars 307 forks source link

Support running as an extension #391

Open benjamingr opened 5 years ago

benjamingr commented 5 years ago

Chrome extensions can connect to the devtools directly (chrome.debugger.attach)

It would be really useful to make this library "universal" in that it would run inside an extension - it doesn't sound like a ton of work :]

Would work towards this be welcome or is this explciitly a non-goal?

cyrus-and commented 5 years ago

Eh... it doesn't sound like a ton of work in theory, in practice (to avoid spaghetti code) that would require a pretty big code refactoring I guess. Also to be used from an extension, this library should be webpacked for the browser and that must coexist with the current setup, which is already obscure enough as it is.

I need to think about this...

june07 commented 5 years ago

This is hilarious and ironic in a way because I'm reading this now after NiM (A CHROMIUM EXTENSION) was just removed by @nodejs, the latest reason being just that... a solution running as an extension.

Remove recommendations of Chrome Extensions #2259

benjamingr commented 5 years ago

@june07 oh hi! I asked for this just because I thought it was a cool idea to get it to work since chrome.debugger already has the ability to attach a debugger. We wouldn't bundle this in extension mode in Node - I was thinking more in terms of "cool way to show people things about browsers" or "way to normalize using the debugger API in extension".

Ideally this would be exported as a library to be consumed from other extensions in extension mode rather than published.

sliminality commented 5 years ago

I have an extremely minimal proof-of-concept here: https://github.com/sarahlim/cri-extension

It's not documented at all, sadly, though that's on my todo list. Basically just:

  1. Clone the repo
  2. Install the extension like any other unpacked extension
  3. Open the background page inspector from chrome://extensions
  4. Navigate to a webpage and click the browser action icon (it looks kind of like the Reebok logo, long story)
  5. From the background page console, you should be able to do things like await DOM.getDocument()