Debug eval sources

This page describes the JavaScript Debugger as it appears before Firefox 52.

See what it looks like from Firefox 52 onwards.

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.

Document Tags and Contributors

 Contributors to this page: wbamberg
 Last updated by: wbamberg,