Catching module loading errors and processing them - javascript

I am trying to load some content using require.js. If the content doesn't exist I'd like to catch the error and notify the user.
In firebug I can see two errors:
"NetworkError: 404 Not Found
...and then a few seconds later:
var e = new Error(msg + '\nhttp://requirejs.org/docs/errors.html#
Load timeout for modules: modules/messages/messages
http://requirejs.org/docs/errors.html#timeout
My code resembles:
require([path], function(content){
//need to catch errors as this will not be called;
});
How would one bind to requirejs events? Any idea?

It is also possible to use errbacks to have customized error handling appropriate to the specific use of require. Errbacks are documented here http://requirejs.org/docs/api.html#errbacks. Basically, you can add to require a function to be called if the load fails. It comes right after the function to be called if the load is successful.
Chin's case could be handled as:
require([path], function(content){
//need to catch errors as this will not be called;
}, function (err) {
//display error to user
});
Here's an example that tries loading from multiple places:
require([mode_path], onload, function (err) {
if (mode_path.indexOf("/") !== -1)
// It is an actual path so don't try any further loading
throw new Error("can't load mode " + mode_path);
var path = "./modes/" + mode_path + "/" + mode_path;
require([path], onload,
function (err) {
require([path + "_mode"], onload);
});
});
In this example onload would be the function called once the required code loads, and mode_path is a string identifying the mode. What you see there is code attempting to load a mode module for an editor from 3 different locations. If mode_path is foo, it will try to load foo, then ./modes/foo/foo and then ./modes/foo/foo_mode.
The example at requirejs.org shows how one might handle a case where they want to try multiple locations for a resource they want to make available with a well-known identifier. Presumably the entire code-base in that example requires jQuery by requiring "jquery". Whatever location jQuery happens to be located at, it becomes available to the whole code-base as "jquery".
My example does not care about making the mode known to the entire code-base through a well-known identifier because in this specific case there's no good reason to do so. The onload function stores the module it gets into a variable and the rest of the code base gets it by calling a getMode() method.

set the requirejs onError function:
requirejs.onError = function (err) {
if (err.requireType === 'timeout') {
// tell user
alert("error: "+err);
} else {
throw err;
}
};
If you want to setup an event you could bind to and trigger a global object. Such as:
$("body").bind("moduleFail",function(){
alert("Handling Event")
});
requirejs.onError = function (err) {
if (err.requireType === 'timeout') {
$("body").trigger({type:"moduleFail",err:err})
} else {
throw err;
}
};
require(["foo"],function(foo){
alert("loaded foo" + foo)
})

Did you try to override the requirejs.onError like shown here?
It worked for me after setting catchError as true like this:
require.config({catchError:true});
before calling any define() or require() functions.

You can use the requirejs.onError function as :
requirejs.onError = function (err) {
if (err) {
//Reload
}
else {
throw err;
}
};
You can also use err.requireType to catch specific errors like timeouts

Related

Is there a way to stub/intercept a javascript statement 'throw' in vanilla javascript?

We can stub any function or class like this,
class ErrorStub{
constructor(message){
// do whatever with 'message'
}
}
Error = ErrorStub
new Error('This will go to ErrorStub now')
Similar to this, is there any way we can intercept a 'throw' statement. So that whatever exception is thrown across whole website, can be handled in one place?
Wouldn't this satisfy your needs? You would need to listen to the error event, handle it the way you want and return false
function interceptError(exception) {
// Here you can write code which intercepts before
// the error gets triggered and printed in the console
alert(`Exception occured: ${exception.message}`)
}
window.addEventListener("error", function (e) {
interceptError(e);
return false;
})
throw new Error('Test exception');

Check if file exists before using require in NodeJs [duplicate]

I need to check if file/(custom)module js exists under some path. I tried like
var m = require('/home/test_node_project/per');
but it throws error when there is no per.js in path.
I thought to check with
fs if file exists but I don't want to add '.js' as suffix if is possible to check without that.
How to check in node if module exists and if exists to load ?
Require is a synchronous operation so you can just wrap it in a try/catch.
try {
var m = require('/home/test_node_project/per');
// do stuff
} catch (ex) {
handleErr(ex);
}
You can just try to load it and then catch the exception it generates if it fails to load:
try {
var foo = require("foo");
}
catch (e) {
if (e instanceof Error && e.code === "MODULE_NOT_FOUND")
console.log("Can't load foo!");
else
throw e;
}
You should examine the exception you get just in case it is not merely a loading problem but something else going on. Avoid false positives and all that.
It is possible to check if the module is present, without actually loading it:
function moduleIsAvailable (path) {
try {
require.resolve(path);
return true;
} catch (e) {
return false;
}
}
Documentation:
require.resolve(request[, options])
Use the internal require() machinery to look up the location of a module, but rather than loading the module, just return the resolved filename.
Note: Runtime checks like this will work for Node apps, but they won't work for bundlers like browserify, WebPack, and React Native.
You can just check is a folder exists by using methods:
var fs = require('fs');
if (fs.existsSync(path)) {
// Do something
}
// Or
fs.exists(path, function(exists) {
if (exists) {
// Do something
}
});

requiredjs fall to load fallback

When using requirejs, we do this:
require(['jquery','bootstrap','history','nanoscroller','noty','noty-theme','bootbox'],function(){
//run code
}
But how can I know when requirejs fail to load any of the plugin and show an alert box with message?
Pass a callback function as the third parameter and that will be called if one of the dependencies fails to load.
require(['jquery','bootstrap','history','nanoscroller','noty','noty-theme','bootbox'],
function(){
//run code
},
function (err) { // callback for dependency load failure
alert(err);
}
);
See the documentation for more details.
Note you can also use a global error handler. The following is an excerpt from the documentation:
To detect errors that are not caught by local errbacks, you can override requirejs.onError():
requirejs.onError = function (err) {
console.log(err.requireType);
if (err.requireType === 'timeout') {
console.log('modules: ' + err.requireModules);
}
throw err;
};

Stop the function and callback instead of throwing error

I have a huge parsing function, if the file is correct, it work well, but I can t handle error correctly.
function parse (pathname, callback){
//Some variables
fs.open(pathname, 'r', function(err, fd){
if (err){console.log('Error Opening the file'); callback(-1);}
console.log('Begin the parsing');
//Do the parsing
But if I give a invalid pathname, I get the message of Error, and the function continue until a fatal error when reading.
I thought callback was ending the function, but it seem I m wrong.
I could do something like:
function parse (pathname, callback){
//Some variables
fs.open(pathname, 'r', function(err, fd){
if (err){console.log('Error Opening the file'); callback(-1);}
else{
console.log('Begin the parsing');
//Do the parsing
But there s a lot of error handling in it, and the function is quite huge.
In other s code I usually see
if (err){throw err;}
But I never suceed in doing anything, even simple, with event, so I d like to avoid this too, and if I don t handle it, it end up closing the app, wich I don t want too.
Is there a neat way to let me handle the error in another way?
You could make the function parse return which will interrupt the function execution.
if (err) {
console.log('Error opening the file');
callback(-1);
return; // Alternatively return false or anything you want
}
Calling callback(-1) does not end the function since it is a simple function call just like console.log() or any other function.

How do I capture JavaScript errors generated in a page fetched by PhantomJS?

I have a PhantomJS script that loads a local HTML file, injects some javascript files, then executes some javascript in the context of the page. The javascript that runs generates an exception, but I only get output from the console, which doesn't seem to distinguish between an error and a normal log and doesn't have file, line numbers or a stacktrace.
What I need is a way to capture or otherwise distinguish these errors. I have already tried:
Wrapping my PhantomJS script in a try-catch
Result: nothing is thrown far enough to be caught by this
Define a window.onerror function
Result: nothing happens. WebKit does not implement an onerror event on the window
I would prefer to be able to retrieve the error object itself so that I can retrieve the stacktrace.
I think there were issues with window.onerror not properly working in WebKit (https://bugs.webkit.org/show_bug.cgi?id=8519). Don't know if this has been fixed at all, and if so, if the QT WebKit version is already up-to-date.
However, you should be able to catch the exceptions thrown in your code. If you are using something like webPage.evaluate(...)to run your code, you cannot wrap the complete call in a try/catch block, since the script is evaluated in a different context and the errors will not appear in the main execution context. Insteadyou will need to catch the errors in page execution context. Unfortunately, there is no way of accessing any functions defined in the main context, we therefore have to explicitly write the wrapping code around your code to be executed.
The following is a modified example of the phantomwebintro.js file as included in the PhantomJS source. It loads an HTML page, inserts a script and then runs some code in the page context (here with a line throwing a type error). This code is wrapped with a try/catch block and will return the wrapped result or error object to the main context.
...
// Load an HTML page:
page.open("http://www.phantomjs.org", function(status) {
if (status == "success") {
// Inject some scripts:
page.includeJs("http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js", function() {
// Run your own code in the loaded page context:
var resultWrapper = page.evaluate(function() {
var wrapper = {};
try {
// Your code goes here
// ...
var x = undefined.x; // force an error
// store your return values in the wrapper
wrapper.result = 42;
} catch(error) {
wrapper.error = error;
}
return wrapper;
});
// Handle the result and possible errors:
if (resultWrapper.error) {
var error = resultWrapper.error;
console.log("An error occurred: " + error.message);
// continue handling the error
// ...
} else {
var result = resultWrapper.result;
// continue using the returned result
// ...
}
...
});
}
});
...
The solution? return true!
// Error tracking
page.onError = function(msg, trace) {
console.log('= onError()');
var msgStack = [' ERROR: ' + msg];
if (trace) {
msgStack.push(' TRACE:');
trace.forEach(function(t) {
msgStack.push(' -> ' + t.file + ': ' + t.line + (t.function ? ' (in function "' + t.function + '")' : ''));
});
}
console.log(msgStack.join('\n'));
// Consider error fully handled
return true;
};

Categories