I understand the concept of using source maps with JavaScript to make debugging easier with minified scripts, etc. What I don't get is how source-level debugging works like it does for TypeScript in Visual Studio (http://blogs.msdn.com/b/typescript/archive/2012/11/15/announcing-typescript-0-8-1.aspx).
For example, if I create my own language that compiles/translates to JavaScript, how do I interface with browsers to provide this kind of source-level debugging? Is there a standard protocol for this? How does Visual Studio do it?
Update
To clarify even more, let's say I invent a language called Caffeinated Beverage Script that compiles to JavaScript. I build an IDE for my language and I want to be able to set breakpoints, step through code, inspect variables, etc. in my IDE while the JavaScript runs in a browser. How do I get my IDE to communicate with the browser on this level?
You might consider WebKit's remote debugging API:
https://developers.google.com/chrome-developer-tools/docs/protocol/1.0/index
I believe that's what Sublime Web Inspector uses.