How to debug electron production binaries

Question

I can\'t open devtools in the built version of my electron app. Therefore i want to find another solution to log any errors that only occur in the production version.

Is

Answer 1

https://github.com/bytedance/debugtron

Debugtron is an app to debug in-production Electron based app. It is also built with Electron.

Answer 2

Enabling the Chrome devtools in production can be done in various ways:

1. A environment variable:
   • E.g. under Windows set ELECTRON_ENV=development&& myapp.exe
2. Pass a special parameter to your app
   • E.g. myapp.exe --debug
3. Debug mode via user settings (if you have persistent settings)
4. Menu entry to open the devtools
   • Can be combined with 1.-3. to only have that menu entry when in debug mode

You can just check if 1.-3. are set and if they are, you simply open the devtools via mainWindow.webContents.openDevTools()

Personally I use a combination of 1., 3. and 4. I simply unlock a developer menu that allows me to open the devtools or opens the userdata folder for me.

---

If you also want to log critical errors, then electron-log looks like a rather popular option for electron.

Answer 3

Here's what worked for me on Mac.

1. In terminal type lldb path/to/build.app
2. In the opened debugger type run --remote-debugging-port=8315. It should open a window of your app.
3. Open Chrome at http://localhost:8315/
4. Click on the name of the app. For example, Webpack App.
5. If you don't see anything in the opened tab, focus on the window of your app.

Answer 4

In the main/index.js at the end of section app.on('ready') just add:

mainWindow.webContents.openDevTools();

Just for debugging, when electron opens an empty window, but the development version works fine, this way is very helpful for me.

Answer 5

On Mac just run open /Applications/WhatsApp.app --args --remote-debugging-port=8315 and then open https://localhost:8315

Answer 6

Launch your Electron application with the --remote-debugging-port=8315 flag set and navigate to chrome://inspect/#devices in Chrome 80+. Then click Configure... and add localhost:8315 as a discovery server.

Then, wait for your Electron instance to appear in the devices list and click inspect.