Question

In the following code, I intentionally throw an error, but in Chrome (used simply for testing purposes) it does not roll up to the catch. How can I roll up the error into the parent’s scope?

try {
  setTimeout(function() {
    console.log("Throwing Error...");
    throw({message:"Ouch!"});
  }, 500);
} catch(e) {
  console.log(e.message);
}

Chrome replies with:

Uncaught #<Object>
  (anonymous function)

Here is the full example I’m working with; when I require “bob” it (intentionally) times out. I want to catch the requirejs error so I could use my application’s error system, which is more robust, to notify the learner.

(function() {
try {
  var scriptVersion = "1.0.0.1"
  window.onload = function() {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "//content.com/pkg/" + scriptVersion + "/require-jquery.js";
    script.async = false;
    script.done = false;
    // OnReadyStateChange for older IE browsers
    script.onload = script.onreadystatechange = function() {
      if(!(this.done) && (!this.readyState || this.readyState == "loaded" || this.readyState == "complete")) {
        this.done = true;
        require.config({
          baseUrl: "//content.com/pkg/" + scriptVersion
        });
        require(["bob"]);
      }
    }
    document.getElementsByTagName("head")[0].appendChild(script);
  }
} catch(e) {
  console.log(e);
}
})();

Answer 1

See the edit below for how to solve the actual problem with requireJS.

The problem is that the setTimeout() function runs in the parent’s scope and completes without error. It schedules (with the system) a future callback event, but when that callback occurs in the future, the parent’s scope of execution has finished and the callback is initiated from the system at the top level much like a new system event (e.g. a click event handler).

While the parent closure still exists because the anonymous function inside the setTimeout() can still reference those variables, the actual execution of the parent scope is done, thus the scope of the try/catch is done.

The execution context of the setTimeout() anonymous function is top level (initiated by the system) so there is no parent context that you can put a try/catch in. You can put a try/catch within the anonymous function, but throwing from there will just go back to the system which is what called the setTimeout() callback.

To have your own code catch any exceptions that occur inside the setTimeout() callback, you will need to put a try/catch inside the callback.

  setTimeout(function() {
    try {
        console.log("Throwing Error...");
        throw({message:"Ouch!"});
    } catch(e) {
        console.log(e.message);
    }
  }, 500);

If you explained what the real problem is that you’re trying to solve (rather than this manufactured test case), we may be able to offer some useful options.

---

Edit now that you’ve shown what problem you’re really trying to solve. The require.js library initiates every error by calling the onError method. The default implementation of the onError method is what throws the exception. You can assign your own onError handler and handle the errors in a callback rather than with exceptions. This sounds like the right way to go.

From the requirejs source:

/**
 * Any errors that require explicitly generates will be passed to this
 * function. Intercept/override it if you want custom error handling.
 * @param {Error} err the error object.
 */
req.onError = function (err) {
    throw err;
};