Add option to open DevTools

[Andrea Parodi]

The more I use electron-debug, the more I'm annoyed by this use case.
I open DevTools with toggle shortcut, then often it got covered by other windows, but still open.
After a while, I often forgot it is open and I press toggle key to show DevTools, but since it's already opened, it close.

I think it should be useful to add an option to just open it if closed, or otherwise focus it.
I don't think there is a specific method in electron to focus, we could ask for it (or maybe it could suffice to re-open it, I have to try).

[Sindre Sorhus]

Can't say that's been an issue for me, but I'm open to adding something for this. The downside of adding it as an option is that it would permanently remove ability to close dev tools from the keyboard. Wouldn't it be better to just add an alternative keyboard shortcut?

I don't think there is a specific method in electron to focus

I think you can focus this http://electron.atom.io/docs/v0.36.8/api/web-contents/#webcontentsdevtoolswebcontents

[Andrea Parodi]

Wouldn't it be better to just add an alternative keyboard shortcut?

Yes, I mean to add a new shortcut, keeping all existing stuff, that is still useful

[Andrea Parodi]

I think you can focus this http://electron.atom.io/docs/v0.36.8/api/web-contents/#webcontentsdevtoolswebcontents

Already tried, but BrowserWindow.fromWebContents always return null for a DevTools window, so no luck there.

[Sindre Sorhus]

Already tried, but BrowserWindow.fromWebContents always return null for a DevTools window, so no luck there.

Ok. Can you open an Electron issue and cross-link it here?

[Sindre Sorhus]

Yes, I mean to add a new shortcut, keeping all existing stuff, that is still useful

👍

[Andrea Parodi]

Ok. Can you open an Electron issue and cross-link it here?

Sure!

[Andrea Parodi]

My issue on Electron appear to be blocked by this other.

I done some experiments here but they are unfortunate...

I published a version of the method that close and re-open DevTools directly on debug-menu, I will refactor that when upstream issue is solved and then move it to electron-debug.

[Vincent Taverna]

@parro-it If I read this issue correctly, all you want to do is open dev tools when they are closed, focus them when they are open.

I do this in my app already, see below.

const firstWindow = BrowserWindow.getAllWindows()[0]
if (!firstWindow) return

const isDevToolsOpened = firstWindow.isDevToolsOpened()
const isDevToolsFocused = firstWindow.isDevToolsFocused()

if (isDevToolsOpened && isDevToolsFocused) {
  firstWindow.closeDevTools()
} else if (isDevToolsOpened && !isDevToolsFocused) {
  firstWindow.devToolsWebContents.focus()
} else {
  firstWindow.openDevTools()
}

You could remove the first test if you don't want it closing on you. I use this with the Shift+Ctrl/Cmd+I shortcuts and it hasn't given me any trouble so far.

[Sindre Sorhus]

Alright, let's do this by default when the DevTools is undocked. Apparently, that's how the native Chrome DevTools work too.