Launching/Reloading Chrome debugger with a Breakpoint hangs
Describe the bug
The chrome debugger will hang when launched with react-scripts start
when there is a breakpoint enabled
Launching with no breakpoints enabled will succeed, however when a breakpoint is hit, subsequent Reload
's of the page will cause the browser load to hang.
There's no console output.
Did you try recovering your dependencies?
No applicable
Which terms did you search for in User Guide?
chrome, breakpoint, hang
Environment
Environment Info:
current version of create-react-app: 5.0.1
running from /Users/john.twigg/.npm/_npx/c67e74de0542c87c/node_modules/create-react-app
System:
OS: macOS 13.2
CPU: (10) arm64 Apple M1 Max
Binaries:
Node: 16.17.0 - ~/.nvm/versions/node/v16.17.0/bin/node
Yarn: 1.22.19 - ~/.nvm/versions/node/v16.17.0/bin/yarn
npm: 7.24.2 - ~/.nvm/versions/node/v16.17.0/bin/npm
Browsers:
Chrome: 111.0.5563.64
Edge: Not Found
Firefox: 110.0.1
Safari: 16.3
npmPackages:
react: ^18.2.0 => 18.2.0
react-dom: ^18.2.0 => 18.2.0
react-scripts: 5.0.1 => 5.0.1
npmGlobalPackages:
create-react-app: Not Found
Steps to reproduce
Very easy repro stepss
npx create-react-app test-debug
npm i
- To the
App.js
I added a button to simplify breakpoint invocation.
<button onClick={() => {
console.log("you clicked")
}}>Click Me</button>
- Ensure no breakpoints are enabled
- Run
npm run start
to launch withreact-scripts start
- Launch a VS Code's Debug configuration to launch
chrome
debugger
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}"
}
** The CRA launch page should load normally in the debug Chrome browser**
7. Verify reloading the page worked in the debugging browser.
** The CRA launch page should load normally in the debug Chrome browser**
9. Add a breakpoint on the console.log("you clicked")
10. Reload the page
** The page will hang when trying to reload **
NOTE: Removing the breakpoint now does nothing. The session is corrupted. NOTE: Variations are to launch with a breakpoint enabled, and it hangs as well. NOTE: Verified on 2 mutually exclusive computer setups.
Expected behavior
-
Reloading debugger with a breakpoint enabled should not hang the debugging session. Especially when the breakpoint is not likely hit, like in a click handler.
-
Reloading with a breakpoint on launch should invoke the breakpoint.
Actual behavior
Hangs and spins indefinitely.
Reproducible demo
(Paste the link to an example project and exact instructions to reproduce the issue.)