Debugging browser-window.js

We are having great difficulties in getting our electron app to run locally on Windows. The app was made by an external contractor and while they where able to build on Windows and ship the packaged app to us, we can not get it to work with the checked-in source code.

I would like to debug the app in vscode and are able to step into our main.js file but what I would really like to see is what happens in the .loadURL() method of BrowserWindow. Unfortunately, vscode tells me that it is:

Unable to open ‘browser-window.js’: Unable to read file (Error: File not found (c:\Users\dotnet\Projects\napp\sales-app\node_modules\electron\dist\resources\electron.asar\browser\api\browser-window.js)).

I understand that an .asar file is simply concatenated files without compression. So I tried to unpack it via asar extract but this of course broke electron.

I am installing prerequisites as listed in the build instructions but I am hoping there is a simpler way to debug electron (not the electron app). I am, so far, only interested in the .js files and not the native (C++) executables.

I have encountered the same problem as you. Have you solved this problem now? If it is solved, can you share it?
I want to figure out how the electron works, so I want to debug the code inside electron.asar directly.

Hi @biiaidt.

Unfortunately no. I gave up. I concluded that the only way to debug an asar bundle is to teach the vscode debugger about .asar bundles/files. That is a way bigger problem to solve, so I gave up.
I could be wrong. Perhaps there is another way. I just don’t know it.

I have a another idea.

I tried to recompile Electron. Then I thought that electron.asar would load in electron. If I found the place where electron.asar was loaded, try to let him read the file after decompression. Then vscode would be works.

What do you think?


I found a way to easily achieve this. I can debug the code of electron.asar using VSCode by modifying now.

I did following things:

  1. unpack the electron.asar to the same directory and name the folder electron.
  2. Modify code. is in C:\OpenSource\electron-gn\src\electron\atom\common\ on my disk. open the file and then search “electron.asar”, and change it to electron. Finally recompile electron.exe.

Here is code:

  base::FilePath script_path =
  resources_path.Append(FILE_PATH_LITERAL("electron"))     // Here.
      args.insert(args.begin() + 1, script_path.AsUTF8Unsafe());

So… enjoy it.

That is awesome! I’m gonna give it a try