Check where/which line or document a script gets called

Question

I'm having a JavaScript debugging question. I would like to know, how it would be possible to find out in which file/line a new script is loaded and called. My website has several scripts which are appended via document.write(), and I would like to find a way to find the function call in all attached scripts of the website.

I would prefer either Firebug or Chrome Dev tools.

Thanks!

Answer 1

Neither Firebug nor the Firefox or the Chrome DevTools currently allow to debug code inserted via document.write(). I created bug 1122222 for the Firefox DevTools and issue 449269 for the Chrome DevTools requesting to be able to debug such scripts. As upcoming Firebug versions will be based on the Firefox DevTools, it will offer this feature once the Firefox bug is fixed, so there's no need to create a separate issue for it.

Until the above bugs are fixed you need to use another method to inject your script in order to be able to debug it within the browser.

Method 1: using eval()

You can use the eval() function to evaluate arbitrary code dynamically. Note that the eval() only evaluates JavaScript code, it must not be surrounded by any HTML.

Example:

eval("console.log('Hi!')");

Method 2: injecting a <script> tag

You can add a <script> tag to the page and then add contents to it.

Example:

var script = document.createElement("script");
script.textContent = "console.log('Hi!');";
document.body.appendChild(script);

Method 3: using new Function()

You can create a new function via the Function constructor.

Example:

(new Function("console.log('Hi!');"))();

---

Note that JavaScript won't be executed using innerHTML or insertAdjacentHTML() due to security reasons.