Can I programmatically open the devtools from a Google Chrome extension?

JavascriptGoogle Chrome-ExtensionGoogle Chrome-Devtools

Javascript Problem Overview


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?

Javascript Solutions


Solution 1 - Javascript

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."

Solution 2 - Javascript

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

Solution 3 - Javascript

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.

Solution 4 - Javascript

Unfortunately, There is no way to do that...

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

Solution 5 - Javascript

One could try

chrome.developerPrivate.openDevTools

Solution 6 - Javascript

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)

Solution 7 - Javascript

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.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionPaul C NicholsView Question on Stackoverflow
Solution 1 - JavascriptlokeshskView Answer on Stackoverflow
Solution 2 - JavascriptDerek 朕會功夫View Answer on Stackoverflow
Solution 3 - JavascriptThe Final Cut CatView Answer on Stackoverflow
Solution 4 - JavascriptChristopheCVBView Answer on Stackoverflow
Solution 5 - JavascriptbluehipyView Answer on Stackoverflow
Solution 6 - JavascriptJ HeyerView Answer on Stackoverflow
Solution 7 - JavascriptAcunaView Answer on Stackoverflow