Webstorm debugging - Coffeescript breakpoint not hit

Question

I am trying to debug coffeescript code using Webstorm and Chrome. Compilation and source map generation is done by coffee-script-redux.

main.html

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="main.js"></script>
</head>
<body>Hello World!</body>
</html>

main.coffee

f = 1

main.js

// Generated by CoffeeScript 2.0.0-beta7
void function () {
  var f;
  f = 1;
}.call(this);

//# sourceMappingURL=main.js.map

main.js.map

{
    "version":3,
    "file":"unknown",
    "sources":["stdin"],
    "names":["f"],
    "mappings":"AAAA;;;EAAAA,CAAA,GAAI"
}

When I open main.html and click "Debug main.html" it will open the page in Chrome (JetBrains IDE Support chrome extension is connected with Webstorm). But the breakpoint in the coffescript file is not hit and it does not have an arrow on the red circle.

Note: I can debug the generated javascript file without problems.

Using Webstorm 7.0.2, Chrome 31.0.1650.48 m, JetBrains IDE Support 1.27

lena lena · Accepted Answer · 2013-11-13T12:26:30

Please use the standard coffeescript compiler instead of redux - it does much better job if the sourcemaps are concerned. Here is what the map prodiced with it looks like:

{
  "version": 3,
  "file": "main.js",
  "sourceRoot": "",
  "sources": [
    "main.coffee"
  ],
  "names": [],
  "mappings": ";AAAA,CAAA,GAAA;;AAAA,CAAA,EAAI"
}

both 'files' and 'sources' are known, plus the generated URL comment better conforms to spec

Note also that breakpoints in your code won't work in WebStorm 7 due to the known issue: sourcemap backed breakpoints do not work until page is loaded. The issue is fixed in WebStorm 8 daily builds. Please vote for http://youtrack.jetbrains.com/issue/WEB-6413 to be notified on any update

Webstorm debugging - Coffeescript breakpoint not hit

1 Answers