Debug eval sources

You can debug JavaScript code that is evaluated dynamically, either as a string passed to eval() or as a string passed to the Function constructor.

To do this, you need to use the //# sourceURL directive to name the source:

var button = document.getElementById("clickme");
button.addEventListener("click", evalFoo, false);

var script = "function foo() {" +
             "  console.log('called foo');" +
             "}" +
             "foo();//# sourceURL=my-foo.js";

function evalFoo() {
  eval(script);
}

This names the script to "my-foo.js".

Once the string has been evaluated it will appear in the Debugger as a separate source, and will be fully debuggable like any other source. You'll also be able to pretty-print it:

Its name will also appear in stack traces appearing in the Web Console.

The debugger will also stop at debugger; statements in unnamed eval sources.