A catch-all for JavaScript errors

Question

I've lost count of the number of times I've had to ask my users if there are any errors in the browser's console, and every time I have to go through the process of asking what browser they're using, no not the operating system, the browser. Google is a search engine, what browser are you using? Have you tried another? Are your browsers up to date? You haven't updated since 2009? Okay, you've updated now? Still not working. Hmm. Are you sure you're even on the right page? Okay, so there was no problem, you were just expecting it to do something it wasn't going to do anyway.

What I'd like is for a way to catch all JavaScript errors and have them presented on the page in some way, for instance a notification popup that says "hey, an error happened, copy this stuff and it can get fixed!"

Any... any pointers? Before I go completely insane?

Answer 1

You have a couple options:

1. Exception handlers allow you to catch exceptions at higher levels of your code that were not handled locally.

2. Also window.onerror(fn) will catch some errors in the page and you can log them when that event fires.

3. Along with any error, you can also retrieve the browser information from the user agent string and log that too so you don't have to ask the user stuff they don't always know.

4. Many desktop programs offer a diagnostic screen that reports a whole bunch of system info that tech support often wants to know. You could create such a similar page for your web app if you wanted. it could gather everything it can discern about the individual system and put it all in one copyable text field. In a pinch the user could either read info from that screen or email it to someone in support.

You can combine all of these with some sort of internal logging system (perhaps the last N errors to Local Storage) and some UI to see them.