/electron-debug

Adds useful debug features to your Electron app

Primary LanguageJavaScriptMIT LicenseMIT

electron-debug

Adds useful debug features to your Electron app

Features

DevTools

Toggle DevTools.

  • macOS: Cmd Alt I or F12
  • Linux: Ctrl Shift I or F12
  • Windows: Ctrl Shift I or F12

Reload

Force reload the window.

  • macOS: Cmd R or F5
  • Linux: Ctrl R or F5
  • Windows: Ctrl R or F5

Element Inspector

Open DevTools and focus the Element Inspector tool.

  • macOS: Cmd Shift C
  • Linux: Ctrl Shift C
  • Windows: Ctrl Shift C

Activates DevTools extensions

Just install any of these extension and they'll be activated for you:

Install

$ npm install electron-debug

Requires Electron 5 or later.

Usage

const {app, BrowserWindow} = require('electron');
const debug = require('electron-debug');

debug();

let mainWindow;
(async () => {
	await app.whenReady();
	mainWindow = new BrowserWindow();
})();

API

Only runs when in development, unless overridden by the isEnabled option. So no need to guard it for production.

electronDebug([options])

Install keyboard shortcuts and optionally activate DevTools on each created BrowserWindow.

options

Type: object

isEnabled

Type: boolean

showDevTools

Type: boolean
Default: true

Show DevTools on each created BrowserWindow.

devToolsMode

Type: string
Default: 'undocked'
Values: 'undocked' 'right' 'bottom' 'previous' 'detach'

The dock state to open DevTools in.

devTools([window])

Toggle DevTools for the specified BrowserWindow instance or the focused one.

window

Type: BrowserWindow
Default: The focused BrowserWindow

refresh([window])

Reload the specified BrowserWindow instance or the focused one.

window

Type: BrowserWindow
Default: The focused BrowserWindow

openDevTools([window])

Open DevTools for the specified BrowserWindow instance or the focused one.

window

Type: BrowserWindow
Default: The focused BrowserWindow

Related