reactjsgoogle-chromegoogle-chrome-devtools

Chrome DevTools Debugger freezing once it hits breakpoint


I have recently started working on a ReactJS webapp codebase that is bit out-dated and currently being tasked to modernize by upgrading to latest versions of dependencies and NodeJS 14 to LTS.

The problem I encounter is that sometimes, the Chrome Devtools debugger would freeze once it has hit the breakpoint, sometimes I will be able to see the stack trace calculated but cannot interact with the debugger anymore as it becomes unresponsive (even if I use keyboard shortcut F8 to try and resume)

One of my suspicion is that somehow it sees 2 folders in the Page > top > localhost:3000 I tried putting the 1st folder (C:/Dev/IntelliJ/xxx/src) into ignore list since those src files are misleading, ie. if you put breakpoints to those files, the debugger never hits them since the debugger is only looking at the 2nd folder (static/js)

enter image description here

However, I even if I put this in the ignore list, the debugger is still encountering freezing and would require me to close the tab itself as its unresponsive.

My chrome versions is up-to-date Version 127.0.6533.89 (Official Build) (64-bit)

Any help please?


Solution

  • Had this issue as well, I update to Chrome v.128.xxx.xxx. today (27th august) and no more errors. Check if your browser is equal or greater than this version.