Javascript debbuging not matching breakpoints on Chrome new tabs
Answered
IntelliJ IDEA 2024.2
I'm normally using Javascript debugging with Chrome, but if application open a new tab it doesn't match any breakpoint on the page opened in the new tab. If I get the page link and open it in the previous tab, the breakpoint it's matched perfectly.
Is this an expected behavior or am I missing some setting?
Notes: Tried server port, mapping local folders (this issue does not happens in VS Code)
Please sign in to leave a comment.
I am afraid that the issue is not completely clear to me. Could you please share a video that demonstrates this process? Thank you in advance.
This is currently on a corporate app, I can't record a video of it. I'll try to make a video on a testing app. Meanwhile let me try to explain better:
I'm debugging a JS web app on localhost:3000 on tab A, I'm on page localhost:3000/page1 and I have a breakpoint placed in page localhost:3000/page2 .
After an action, app opens a new tab B with page2 , breakpoints are not matched anytime on IDEA.
If I get the localhost:3000/page2 and put it in tab A , breakpoints are matched correctly.
Thanks for clarification. This is expected - the debugger is only attached to the tab that is opened when you start the debug configuration with this tab URL, there is no way to auto-attach it to the arbitrary tab/window opened during the code execution.
You have 2 possible solutions here:
- create a different JavaScript debug run configuration for your other page URL.
- attach to a tab in a running Chrome.
In the latter case, you need starting Chrome with
–remote-debugging-portoption and use Attach to Node.js\Chrome run configuration to attach the debugger.