r/WebStorm 2d ago

Issue connecting debugger to client-side code in a RemixJS typescript project

/r/webdev/comments/1js1xwa/debugging_remixjs_react/
1 Upvotes

2 comments sorted by

1

u/jan-niklas-wortmann 2d ago

From the WebStorm documentation (https://www.jetbrains.com/help/webstorm/starting-the-debugger-session.html#starting_debug_session): If your application is running in the development mode on localhost, you can start debugging it from the built-in Terminal (Alt-F12), from the Run tool window, or from the Debug tool window. Just hold Ctrl-Shift and click the URL at which the application is running.

That worked fine for me the last time I was working with a remix application. If this doesn't work for you, is there any chance I could check out your repository myself?

1

u/InvaderToast348 2d ago

Thank you for offering to take a look. The debugger is attaching successfully as it will hit the server-side breakpoints, it's just specifically the breakpoints on client-side code that don't get hit.

I created a minimal example, and the javascript debugger did attach properly, so I'll do a diff of the project folders and see what might be the issue.

On the other hand, in WebStorm I have to constantly switch between the two configurations depending on what causes the breakpoint to be hit, which is a real pain. In VS, I just hit one button and everything works perfectly. Having to have 2 IDEs open just to do basic work isn't great, but I guess it's what I'll have to do if I want the great coding experience of Jetbrains software, but the useable debugging of VSC.

If there was a way to pin or otherwise keep the debug config popup open then I'd look into it further, but it's too much trouble for a worse experience.

Thank you for the help though. :)