Unbound breakpoint when debugging Electron renderer process in TypeScript

[abartho]

Issue Type: Bug

When debugging an Electron app written in TypeScript, I am not able to debug the renderer process because the breakpoints are unbound.

The problem only happens with the preview JavaScript debugger, i.e., if I turn off debug.javascript.usePreview, the breakpoints are hit.

Also, the problem is intermittent. After following #102493 and enabling tracing, the breakpoints were suddenly hit. Until they weren't anymore.

I get the same behaviour on Linux with Node versions 15.6 - 16.1, and on Windows with Node version 12.19.

I came across the problem while writing a tutorial how to set up Visual Studio Code to debug Electron applications written in TypeScript. This may serve as a minimal example to reproduce the issue.

How to reproduce:
Follow the steps on https://github.com/abartho/electron-typescript-vscode/#electron-typescript-vscode

Trace file:
vscode-debugadapter-f591828d.json.gz

VS Code version: Code 1.56.0 (cfa2e21, 2021-05-04T21:58:14.757Z)
OS version: Linux x64 4.4.0-31-generic

System Info

Item	Value
CPUs	Intel(R) Core(TM) i5-5200U CPU @ 2.20GHz (4 x 2499)
GPU Status	2d_canvas: enabled gpu_compositing: enabled multiple_raster_threads: enabled_on oop_rasterization: disabled_off opengl: enabled_on rasterization: disabled_software skia_renderer: enabled_on video_decode: disabled_software vulkan: disabled_off webgl: enabled webgl2: enabled
Load (avg)	1, 0, 1
Memory (System)	7.54GB (0.43GB free)
Process Argv	--no-sandbox --unity-launch
Screen Reader	no
VM	0%
DESKTOP_SESSION	cinnamon
XDG_CURRENT_DESKTOP	X-Cinnamon
XDG_SESSION_DESKTOP	cinnamon
XDG_SESSION_TYPE	undefined

Extensions (18)

Extension	Author (truncated)	Version
namespace	adr	1.1.2
github-markdown-preview	bie	0.0.2
markdown-checkbox	bie	0.1.3
markdown-emoji	bie	0.1.0
markdown-preview-github-styles	bie	0.1.6
markdown-yaml-preamble	bie	0.0.4
xml	Dot	2.3.2
json-tools	eri	1.0.2
dotnet-test-explorer	for	0.5.4
csharpextensions	jch	1.3.0
language-haskell	jus	2.6.0
docomment	k--	0.1.2
vscode-docker	ms-	1.10.0
csharp	ms-	1.23.9
debugger-for-chrome	msj	4.12.12
classynaming	ref	1.1.1
partial-diff	ryu	1.3.0
haskelly	UCL	0.5.5

[vscodebot]

(Experimental duplicate detection)
Thanks for submitting this issue. Please also check if it is already covered by an existing one, like:

• Debug stopped working - getting Unbound Breakpoint -VSCode 1.56 (#123148)

[connor4312]

In the log you shared it looks like you were able to hit the breakpoint. I would need to see a log where that doesn't happen to figure out what's going wrong.

The only real timing-based thing is that breakpoints can take a few moments to be set, since the renderer is attached to. The renderer could start running and pass the breakpoint location (if the breakpoint is set in code that runs early in startup) before the debugger attaches and applies the breakpoint.

[abartho]

Hello Connor, thanks for looking into the issue.

While I was careful to attach the correct log, I cannot guarantee I didn't make a mistake. But this time I'm definitely attaching the right log.
I don't believe I'm running into the timing-based problem because the breakpoint is supposed to be hit after a button click.

I've added a screencast showing what I did. In the video, I'm running two debug sessions. In the first session, the preview debugger is disabled and the breakpoint is hit as expected. In the second session, the preview debugger is enabled and the breakpoint is unbound.

https://user-images.githubusercontent.com/1980015/117711643-6bcce680-b1cb-11eb-9a62-f357958240e2.mp4
vscode-debugadapter-51c53908.json.gz

[connor4312]

Hi, thanks for the logs. It looks like it's the same issue as #111857 (comment), which seems to be something in Electron not allowing us to attach to the browser. Unfortunately I've never been able to reproduce this on any device. It looks like you're using the latest Electron version, so that should be fine.

@deepak1556 any ideas on what could be happening here in the electron/chromium side of things?

[abartho]

Have you tried the sample application I referenced in the initial comment?
If you are able to hit the breakpoint in renderer.ts, well, that would make it hard to find the problem.
If I can help you with any debugging, please let me know (would be my first time debugging VSCode or an extension, though).

[connor4312]

If you are able to hit the breakpoint in renderer.ts, well, that would make it hard to find the problem.

Yea, I'm able to do so (thanks for the repro, I didn't get one on the other issue and this helps)

[connor4312]

Actually, I found the repro! You're correct that it's a timing issue.

There are two endpoints on which inspect data is published -- /json/version and the older /json/list. We check /json/version and, if that fails, query /json/list. If it happens that /json/version fails but /json/list comes up when we go to try that, we'll connect to a bad session.