SourceMap on Firefox: source debugging for languages compiled to JavaScript [update: WebKit, too]

[2011-07-10] dev, firefox, javascript

Update 2011-09-16: Source maps are coming to WebKit, too. Mozilla and WebKit implementers might even agree on a common format.

More and more languages are compiled to JavaScript. Mozilla has plans to let you debug those languages in their source code (no need to look at JavaScript).

Examples of languages that are compiled to JavaScript:

Google Web Toolkit (GWT): compiles Java to JavaScript which allows one to use Java on both server and client and to do web development with a great IDE (as in “Eclipse without plugins”).
Minification [1]: tranforms a JavaScript program into a more compact version of itself without changing what it does. The measure taken here are: stripping out comments and newlines, using shorter variables names, etc.
CoffeeScript [2]: is an improved version of JavaScript with a syntax for people who hate braces.
Google Traceur [3]: compiles a variant of ECMAScript.next to JavaScript, on the fly.

There are several problems with using these languages:

Exceptions report lines in the generated code, not in the original.
Output in the console links back to generated code.
You have to debug the generated code.

That is why Mozilla’s new project “SourceMap” is exciting: For all generated code, it keeps a map from input source locations to generated source locations. It uses that map to report errors using the input line numbers and to link to the input source from the console. Support for working with a debugger in the input language will come later (see “Next Steps & Open Issues”).