TypeScript debugging problems

I'm trying to get TypeScript debugging to work. I have had it working on and off, and see no rhyme or reason as to why. This application contains a server part (witten in Java) and a client part (written in Typescript). Java debugging works fine. TypeScript debugging in Chrome works fine (using source maps). Typescript editing and compilation works fine (especially since IntelliJ 15). However, cross debugging from IntelliJ into Chrome usually fails with the dreaded "Remote URLs for several files aren't specified so breakpoints won't work      in these files." popping up at the bottom of the screen, and breakpoints not working.

Note that I've had this working occasionally, so I know it can work. When it does, it's very nice. Then it stops working, seeminly without changing anything. I tried restarting Chrome and IntelliJ to no avail.

In the debug configuration I've done the following:

  • Selected Chrome as browser.
  • Entered the URL to launch in Chrome, pointing to the file to be debugged: http://localhost:8080/app/BlockListView.html
  • In the "Remote URLs" list, I've assigned "http://localhost:8080" as the Remote URL corresponding to the folder containing the "app" directory mentioned above.


I would assume IntelliJ being able to figure out all other URLs/paths relative to this root, since it all corresponds file-for-file from here down. I can't believe I have to manually set the corresponding URL for each and every .ts file under the app directory. Do I? (The "Remote URLs for several files..." message seem to imply that I do.)

What more do I need to configure to make this work reliably?

Mike

0
6 comments

looks as if specified Remote URL mapping is not correct...
You don't need to specify mappings for each file separately if there is file-to-file correspondance. You just need to make sure that the web root is mapped correctly. May be, correct mapping for app folder is  http://localhost:8080/app/, not http://localhost:8080/

0

This is the mapping I have, and the files I try to debug when I get the message "Remote URLs for several files aren't specified so breakpoints won't work..."

File/Directory Remote URL Note
someDir/project/resources/assets http://localhost:8080
someDir/project/resources/assets/app http://localhost:8080/app
someDir/project/resources/assets/app/BlockListView.html http://localhost:8080/app/BlockListView.html Debug Configuration URL
someDir/project/resources/assets/app/BlockEditor.ts Included TypeScriot file with breakpoint



Please let me know what I need to change to make this work. FYI, I tried removing the "Remote URLs" for all but the first entry, since I'd guess that should be the only one needed as the remaining ones can be determined given this "root"

As I mentioned, I did have debugging working for half an hour or so, with this very configuration. Then it stopped working. As far as I can recall, I didn't change anything related to debug settings. Now I just can't get breakpoints working again. Too bad, since it was really nice when it worked as advertised.

Mike

0

Looks correct at first glance.. And yes, a single mapping for root should normally be enough.
Unfortunately I need he project (may be just a reduced sample that shows up the configuration being used) to be able to advise on correct settings:(

0

Interestingly enough, breakpoints just started working again! I have not changed my configuration a bit. And it has worked before, as mentioned initially. This just appears to be "unreliable", fwiw. Note that I still get the message "        Remote URLs for several files aren't specified…" when starting debug, although this seems incorrect since it now seems to hit my breakpoints OK.

However, even though I do hit breakpoints in my TypeScript code, as desired, I often can't view local variables. The "Local" section in the "Variables" pane is twirled open (triangle pointing down), but nothing is displayed. If I click the triangle twice, the text "Collecting data…" appears, but no variables show up. See eenclosed "NoLocals" illustration.

I have also on a few occasions seen local variables show up here OK, but with incorrect variable names. Instead of showing the proper name of each variable, the name of some other local variable appears several times (but with different values, as th evalues seem correct - just not the associated names). Needless to say, this makes debugging rather hard.

I've tried "Invalidate Caches", since this appeared as some possible cache corruption to me, but it didn't help.

Note that this doesn't always happen when debugging. I can step into many functions where I do see locals OK. In the enclosed "OneLevelDown" screenshot you can see how locals appear OK after stepping into the getSelection() function. (And, no, the locals "upstairs" do not appeaar if I look up one stack frame level.)

Since this appears so random, I'd probably be hard pressed to come up with a simple test case that shows the problem.


Mike

PS: One more hint. When hovering over a local variable (with no locals appearing in the Variables pane), I get the message shown in the "LocalVarPeek" pixture. Seems to be somehing out of whack in your code, since it refers to Java code.



Attachment(s):
OneLevelDown.png
NoLocals.png
LocalVarPeek.png
0

'Collecting data' issue is tracked as https://youtrack.jetbrains.com/issue/WEB-16972, please follow it for updates


0

Thanks for letting me know!

Mike

0

Please sign in to leave a comment.