Debugging a Renderer Process In Electron
I finally figured out how to load up the DevTools in Electron to debug a renderer process. I don't know why it took me so long to find this, but I inspected the source code of another project that uses Electron and finally stumbled upon the following line in the main.js process:
mainWindow.openDevTools();
After you have created your BrowserWindow, if you call openDevTools() you get the same tools you get when you hit F12 in Chrome as you can see here:
When you have these tools open you can set break points in your JavaScript and refresh the page using F5. This gives me the minimum functionality I need to debug things in renderer processes.
I am certain there is probably a way to attach the debugger in Visual Studio Code to the JS executing in a renderer processes, but I haven't quite figured that out yet. Let me know if you have any solutions for me! :)