feature: 按 `F12` 可以打开/关闭 `开发者工具` 了 (#355)

packages/gui/src/background.js

@@ -24,6 +24,39 @@ let hideDockWhenWinClose = DevSidecar.api.config.get().app.dock.hideWhenWinClose
 protocol.registerSchemesAsPrivileged([
   { scheme: 'app', privileges: { secure: true, standard: true } }
 ])
+
+let devToolsStatus = false
+
+function openDevTools () {
+  try {
+    log.info('尝试打开 `开发者工具`')
+    win.webContents.openDevTools()
+    devToolsStatus = true
+    log.info('打开 `开发者工具` 成功')
+  } catch (e) {
+    log.error('打开 `开发者工具` 失败:', e)
+  }
+}
+
+function closeDevTools () {
+  try {
+    log.info('尝试关闭 `开发者工具`')
+    win.webContents.closeDevTools()
+    devToolsStatus = false
+    log.info('关闭 `开发者工具` 成功')
+  } catch (e) {
+    log.error('关闭 `开发者工具` 失败:', e)
+  }
+}
+
+function switchDevTools () {
+  if (devToolsStatus) {
+    closeDevTools()
+  } else {
+    openDevTools()
+  }
+}
+
 // 隐藏主窗口，并创建托盘，绑定关闭事件
 function setTray () {
   // const topMenu = Menu.buildFromTemplate({})
@@ -32,17 +65,10 @@ function setTray () {
   // 通常被添加到一个 context menu 上.
   // 系统托盘右键菜单
   const trayMenuTemplate = [
-
     {
       // 系统托盘图标目录
-      label: 'DevTools',
+      label: 'DevTools (F12)',
-      click: () => {
+      click: switchDevTools
-        try {
-          win.webContents.openDevTools()
-        } catch (e) {
-          log.error('win.webContents.openDevTools() error:', e)
-        }
-      }
     },
     {
       // 系统托盘图标目录
@@ -161,7 +187,7 @@ function createWindow (startHideWindow) {
   if (process.env.WEBPACK_DEV_SERVER_URL) {
     // Load the url of the dev server if in development mode
     win.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
-    if (!process.env.IS_TEST) win.webContents.openDevTools()
+    if (!process.env.IS_TEST) openDevTools()
   } else {
     createProtocol('app')
     // Load the index.html when not in development
@@ -212,6 +238,14 @@ function createWindow (startHideWindow) {
     log.info('session-end:', e)
     await quit()
   })
+
+  // 监听键盘事件
+  win.webContents.on('before-input-event', (event, input) => {
+    // 按 F12，打开/关闭 开发者工具
+    if (input.key === 'F12' && input.type === 'keyUp') {
+      switchDevTools()
+    }
+  })
 }
 
 async function beforeQuit () {