Debugging on Windows

    See also: There’s a wealth of information on debugging Chromium, much of which also applies to Electron, on the Chromium developers site: Debugging Chromium on Windows.

    • A debug build of Electron: The easiest way is usually building it yourself, using the tools and prerequisites listed in the . While you can attach to and debug Electron as you can download it directly, you will find that it is heavily optimized, making debugging substantially more difficult: The debugger will not be able to show you the content of all variables and the execution path can seem strange because of inlining, tail calls, and other compiler optimizations.

    • Visual Studio with C++ Tools: The free community editions of Visual Studio 2013 and Visual Studio 2015 both work. Once installed, configure Visual Studio to use Electron’s Symbol server. It will enable Visual Studio to gain a better understanding of what happens inside Electron, making it easier to present variables in a human-readable format.

    To start a debugging session, open up PowerShell/CMD and execute your debug build of Electron, using the application to open as a parameter.

    Then, open up Visual Studio. Electron is not built with Visual Studio and hence does not contain a project file - you can however open up the source code files “As File”, meaning that Visual Studio will open them up by themselves. You can still set breakpoints - Visual Studio will automatically figure out that the source code matches the code running in the attached process and break accordingly.

    Relevant code files can be found in .

    If Electron is running under a different user account, select the check box. Notice that depending on how many BrowserWindows your app opened, you will see multiple processes. A typical one-window app will result in Visual Studio presenting you with two Electron.exe entries - one for the main process and one for the renderer process. Since the list only gives you names, there’s currently no reliable way of figuring out which is which.

    Code executed within the main process (that is, code found in or eventually run by your main JavaScript file) will run inside the main process, while other code will execute inside its respective renderer process.

    You can be attached to multiple programs when you are debugging, but only one program is active in the debugger at any time. You can set the active program in the toolbar or the Processes window.

    For an introduction to ProcMon’s basic and advanced debugging features, go check out provided by Microsoft.