108

I have a chrome extension which hooks into the devtools. Ideally I want a badge that, when clicked, opens up the devtools on the new tab which I created. Is there any way to do this from the background page?

Paul C Nichols
  • 1,181
  • 2
  • 8
  • 5
  • where you able to find an answer to the problem? – GeorgeU Aug 01 '11 at 15:04
  • 1
    This would still be really nice wouldn't it - any updates? – underrun May 11 '12 at 13:38
  • I've posted (and will be adding a bounty to) a related, but slightly different, question here: http://stackoverflow.com/questions/16660325/open-safari-google-chrome-developer-tools-programmatically-from-javascript – ELLIOTTCABLE May 21 '13 at 00:32
  • See: https://stackoverflow.com/questions/36311191/how-to-open-chrome-developer-console-in-selenium-webdriver-using-java – Michael Bakker Jul 13 '18 at 13:49
  • 2
    In case you're curious like me what Chrome uses itself to open the devtools when you click the "backgroung page" link on an extension page, it's [`chrome.developerPrivate.openDevTools()`](https://developer.chrome.com/apps/developerPrivate#method-openDevTools) – felixfbecker Feb 21 '19 at 10:28

7 Answers7

29

It seems unlikely that this is possible or will ever become possible,

check this: https://code.google.com/p/chromium/issues/detail?id=112277

which says: "We only allow explicit devtools opening."

lokeshsk
  • 443
  • 4
  • 9
7

Yes you can (or not) using the experimental APIs chrome.experimental.webInspector.
http://code.google.com/chrome/extensions/experimental.html
You can even change the content and panels of it.
Note that you will not able submit extensions that use experimental APIs.

Derek 朕會功夫
  • 92,235
  • 44
  • 185
  • 247
  • However, it's worth noting that you can [host these outside of the extensions gallery](http://code.google.com/chrome/extensions/external_extensions.html) if you are determined. Although this would mean that users would also have to use the [dev channel](http://www.chromium.org/getting-involved/dev-channel) and enable the [Experimental Extension APIs flag](http://code.google.com/chrome/extensions/experimental.html#using). – neocotic Jul 28 '11 at 14:35
  • 22
    [`experimental.webInspector`](http://code.google.com/chrome/extensions/trunk/experimental.webInspector.html) is now called [`chrome.experimental.devtools`](http://code.google.com/chrome/extensions/trunk/experimental.devtools.html). Some of the APIs are not experimental any more, and they are listed under [`chrome.devtools`](http://code.google.com/chrome/extensions/trunk/devtools.html). **Unfortunately, there is no way to automatically open the Dev tools** via a Chrome extension. – Rob W Mar 13 '12 at 17:35
  • @Rob W, Didn't notice `chrome.devtools.*` APIs have become outside of experiment APIs. – Derek 朕會功夫 Mar 14 '12 at 01:26
3

There is no way to do that.

The chrome://chromewebdata link only works if an instance of DevTools is already opened.

Paolo
  • 20,112
  • 21
  • 72
  • 113
ChristopheCVB
  • 7,269
  • 1
  • 29
  • 54
2

This is quite old but since I stumbled upon it now searching for a solution I figured others might have too. Since Chrome 28 you can use the devtools.* API. This allows you to open and manipulate DevTools panels. It is also notable no longer expirimental.

The Final Cut Cat
  • 57
  • 1
  • 4
  • Do you remember what method is used to progammatically open the devtools from the background script? All other answers (from stackoverflow) seem to suggest that it's impossible... – teg_brightly Jun 07 '20 at 09:47
  • @Sentero-esp12 just click right button on needed page and select "Inspect" from it) – Acuna Jul 29 '20 at 23:25
  • 7
    This doesn't answer the question. The devtools.* APIs are for building extensions to the developer tools. They don't provide a way to launch it programatically. And the question was how to do it programmatically, so "just click right" isn't an answer. – John Nov 03 '21 at 19:05
1

One could try

chrome.developerPrivate.openDevTools

bluehipy
  • 381
  • 2
  • 5
1

Perhaps, the extension could kick off a Selenium script and you could use the "send_keys()" function as something like this:

ActionChains(driver).key_down(Keys.CONTROL).key_down(Keys.SHIFT).\
            send_keys('J').key_up(Keys.CONTROL).key_up(Keys.SHIFT).perform()

... as "Ctrl+Shift+J" is the default keybind to open dev-tools (as of Jul 08, 2021)

J Heyer
  • 51
  • 2
0

It's not impossible with side extension, but if the reason is that you've tired to click Ctrl + Shift + I again and again every time - you can simply open the right button menu on needed page and select "Inspect" from it, it'll open the console like extension button, and also you don't need to search for its icon every time you need it, which is more conviniently than using an extension.

Acuna
  • 1,741
  • 17
  • 20