Handling module load errors with YUI Loader
This information is accurate for YUI 3.5.0pr2 - there are cross browser issues with the following method on previous versions.
From time to time you may find yourself loading modules that aren’t available. Whether it be from a user supplied modules list or an unreliable source, the YUI instance confg gives you an easy way to check if there are any errors while loading your modules.
A common YUI config and use statement would look like the following.
YUI({
modules: { // Define your custom module meta data
'custom-module' : {
fullpath: 'path/to/module.js'
}
}
}).use('node', 'custom-module', function(Y) {
// Your code here
});
If for some reason the loader was unable to fetch a required module and you wanted to act on that event, the loader provides you with an onFailure method that is called with an object that has details about the modules it failed to fetch.
To use this method you would amend the above code to include that method.
YUI({
modules: { // Define your custom module meta data
'custom-module' : {
fullpath: 'path/to/module.js'
}
},
onFailure: function(error) {
// Error handling code
}
}).use('node', 'custom-module', function(Y) {
// Your code here
});
The error object is structured.
{
data: Array[], // Contains a list of the requested modules
msg: "Failed to load path/to/module", // A string error message
success: false // A bool representation of the success of the requests
}
It’s that simple, by setting up your onFailure callback you can easily handle any errors that may arise by an improperly structured config or use statement.
Warning
If there is a failure in your initial module request the onFailure callback will be called before the Y instance is set-up. This means that no YUI methods will be available and calls to them will cause your application to fail. In this case the this property will point to YUI.
More Reading
In the following example the onFailure callback will be called if at any time there is a failure while trying to load modules. You will need to keep this in mind if your doing any lazy loading of modules so that you can appropriately handle the errors.
YUI({
modules: { // Define your custom module meta data
'good-module' : {
fullpath: 'correct/path/to/good-module.js'
},
'bad-module' : {
fullpath: 'path/to/bad-module'
}
},
onFailure: function(error) {
// I'm going to be called when the request for bad-module is made
}
}).use('node', 'good-module', function(Y) {
Y.use('bad-module', function() {
// More code here
});
});
The error.msg property string will contain comma delimited messages about which values failed.
YUI({
modules: { // Define your custom module meta data
'wrong-module' : {
fullpath: 'path/to/wrong-module'
},
'bad-module' : {
fullpath: 'path/to/bad-module'
}
},
onFailure: function(error) {
console.log(error);
}
}).use('node', 'wrong-module', 'bad-module', function(Y) {
// Code here
});
{
data: Array[22],
msg: "Failed to load path/to/wrong-module,Failed to load path/to/bad-module",
success: false
}
This method only works if the module has been defined. You will not receive an error for the crazy-module.
YUI({
modules: { // Define your custom module meta data
'wrong-module' : {
fullpath: 'path/to/wrong-module'
}
},
onFailure: function(error) {
console.log(error);
}
}).use('node', 'wrong-module', 'crazy-module', function(Y) {
// Code here
});
You will however get a string error logged to the console in addition to the onFailure if the undefined module comes before the defined custom modules.
YUI({
modules: { // Define your custom module meta data
'wrong-module' : {
fullpath: 'path/to/wrong-module'
}
},
onFailure: function(error) {
console.log(error);
}
}).use('node', 'crazy-module', 'wrong-module', function(Y) {
// Code here
});
"yui: NOT loaded: crazy-module"