JavaScript source maps for debugging

Monkey Targets Forums/HTML5/JavaScript source maps for debugging

Pixelati(Posted 2013) [#1]
So I was thinking...

JavaScript "Source maps" are gaining popularity in languages that compile to JavaScript like CoffeeScript, TypeScript. It seems like a good fit for Monkey, given that there's no integrated debugger.

(A source map is like a JavaScript equivalent of symbolic debugging info. It tells the browser how to map back from the JavaScript to the original source file, so that you can step through the original source code in the original language.)

Monkey could generate the map as part of the compile to html5. Or failing that it should be possible to automate something to scan the JavaScript for the err_info= lines generated in debug mode.

Sound reasonable?


blabz(Posted 2013) [#2]
Hey Pixelati,

It's a neat idea but wouldn't it still only allow you to debug the original javascript and not MonkeyCode?

IE has some pretty powerful debugging tools for javascript, including break points, stepping through, watching variables, and the console. A lot of the same features found in visual studio are also in IE's debugger.

In IE just press F12, go to scripts, Choose Monkey's Main.js file, set a break point then click start debugging.


Pixelati(Posted 2013) [#3]
Actually no, that's the point :-). The source map tells the browser what the original source file is, and which source lines map to which JavaScript ones. So you see and step through your original source code, place breakpoints etc.

Debugging the JavaScript isn't too hard, this would just make it a little bit nicer.