Electron：如何重新聚焦/恢复最小化的 DevTools 窗口

Question

我创建了一个全局快捷方式，用于Ctrl+Shift+I打开一个分离的 DevTools 窗口。但是，当 DevTools 窗口最小化时，按下Ctrl+Shift+I并没有任何作用。

我希望能够使用Ctrl+Shift+I快捷方式恢复/取消最小化最小化的 DevTools 窗口。该.focus方法通常适用于此类情况，但不适用于这种情况。我也尝试过对窗口使用“非停靠”模式。

我必须实现当前行为的代码是这样的：

if (focussedWindow.webContents.isDevToolsOpened()) {
      if (focussedWindow.webContents.devToolsWebContents !== null) {                            
              focussedWindow.webContents.devToolsWebContents.focus();
       }
}

我还应该补充一点，如果 DevTools 窗口在其他窗口后面，它会重新聚焦，只是在最小化时不会。

我在 Windows 10 专业版上使用 Electron 9.3.0。

Answer 1

情况

\n

在 Linux 上，BrowserWindow.webContents.devToolsWebContents.focus() 根据需要恢复最小化的分离 DevTools 窗口 \xe2\x80\x93。

\n

在 Windows 上，这不起作用（在 Win 7 上使用 Electron 9.3.0 和 10.1.1 进行测试）。最小化的分离 DevTools 窗口保持最小化状态。

\n

解决方法

\n

在尝试了许多在 Windows 上都不起作用的解决方法后，我发现了以下技巧：创建一个新的 BrowserWindow 供 DevTools 占用。有了这个参考，您现在可以简单地调用BrowserWindow.restore().

\n

const {app, BrowserWindow} = require("electron");\nconst url = require("url");\nconst path = require("path");\n\nlet mainWindow, newDevToolsWindow;\n\napp.on("ready", function() {\n    mainWindow = new BrowserWindow();\n\n    mainWindow.loadURL(url.format({\n        pathname: path.join(__dirname, "index.html"),\n        protocol: "file:",\n        slashes: true\n    }));\n\n    console.log("create new window for devtools")\n    newDevToolsWindow = new BrowserWindow();\n    mainWindow.webContents.setDevToolsWebContents(newDevToolsWindow.webContents);\n    mainWindow.webContents.openDevTools({mode: "detach"});\n\n    // Simulate OP\'s keypress\n    setInterval(() => {\n        console.log("restore the new window")\n        newDevToolsWindow.restore();\n    }, 4000);\n\n});\n

\n

笔记：

\n

\n
• 该解决方法已在 Win 7 上使用 Electron 9.3.0 和 10.1.1 进行了测试。
\n
• 如果您想在分离模式下复制标准 DevTools 窗口行为，您可能需要稍微调整 BrowserWindow。
\n
• 另请注意，isDevToolsOpened将返回false，因此您还需要调整您的检查。
\n

\n