Menu
I'm researching the possibility of automated on-page error detection via Javascript. I have found several questions where the answer allows you to catch Javascript compilation and runtime errors globally via window.onerror, but no answers mention other types of non-Javascript errors that are often reported in browser error consoles. I'm primarily interested in network errors (invalid URI's, SSL errors, HTTP errors, timeouts) and resource interpretation errors (mismatching types resulting in aborting the interpretation of the resource, parsing errors on loaded resources, etc).
I checked the performance.getEntries method, but I'm baffled to find that it does not seem to contain network requests that resulted in errors (I checked only in Chrome 29...)
I don't need full cross browser compatibility.. as long as it works on some browsers, and doesn't break the others, that's fine.
277
JavaScript provides error-handling mechanism to catch runtime errors using try-catch-finally block, similar to other languages like Java or C#. try: wrap suspicious code that may throw an error in try block. catch: write code to do something in catch block when an error occurs.
A try / catch block is basically used to handle errors in JavaScript. You use this when you don't want an error in your script to break your code.
The try statement allows you to define a block of code to be tested for errors while it is being executed. The catch statement allows you to define a block of code to be executed, if an error occurs in the try block. The JavaScript statements try and catch come in pairs: try { Block of code to try.
JavaScript Errors and generic handling. throw new Error('something went wrong') — will create an instance of an Error in JavaScript and stop the execution of your script, unless you do something with the Error.
The window.onerror handler catches Javascript errors in Chrome 13+, Firefox 6.0+, Internet Explorer 5.5+, Opera 11.60+ and Safari 5.1+. There's already a really good answer on StackOverflow which provides a lot of information about it. It does not catch failures to load resources, though.
As far as other elements (such as images) are concerned, jQuery provides an .error() method to attach an error event handler to alert the user when an image or external script fails to load. If you can't use jQuery, then another option is to preload all images / external resources via XMLHttpRequest and listen to the status (the HTTP response code) of the request (anything other than 200 OK or 304 Not Modified is something you'll want to return an error). The downside to this is that, since event handlers and such have to be attached before the page is fully loaded, anyone who has JavaScript disabled is going to be looking at a fragmented, possibly blank page.
Invalid URIs and HTTP errors are best handled server-side. A well-formed .htaccess file, combined with Apache's mod_rewrite (or an equivalent) can provide a lot of cushioning for bad requests to the server.
124
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
