Check existence of variable in webpage via content scrips - google-chrome

Question

I want to conditionally insert few javascript files inside the DOM of the webpage. I also want to add a dependency.
var load = function(filename, callback) {
fileref = document.createElement("script")
fileref.setAttribute "type", "text/javascript"
fileref.setAttribute "src", filename
document.getElementsByTagName("head")[0].appendChild fileref
if (typeof callback !== "undefined" && callback !== null) {
callback();
}
}
load("http://www.myserver.com/lib.js",
function() { load("http://www.myserver.com/core.js") }
)
But I want to check whether the 'lib.js' is actually executed. For that, I would want to wait till a variable inside lib.js is available. How do I do it?

Answer 1

Don't run your callback immediately. Because content scripts share the DOM with their page, you can wait for the load event on the DOM <script> element:
var load = function(filename, callback) {
fileref = document.createElement("script");
fileref.setAttribute("type", "text/javascript");
fileref.setAttribute("src", filename);
// fire callback when script loads
fileref.addEventListener("load", function() {
if (typeof callback !== "undefined" && callback !== null) {
callback();
}
});
document.getElementsByTagName("head")[0].appendChild(fileref);
}
load("http://www.myserver.com/lib.js",
// this callback will run only after lib.js has fully loaded
function() { load("http://www.myserver.com/core.js") }
)