How to capture Javascript errors

Introduction

Why let some bugs slip through the cracks when they're so easy to identify? This article explains how to trap all those pesky Javascript errors that would otherwise take much longer to find. Early detection before release is the key to keeping development costs low, and early detection after release helps rein in support costs.

The Root of the Problem

You can usually count on your test team to find serious rendering problems or 50x server errors -- they're too obvious to overlook.

However, Javascript errors often go unnoticed before release. Testers can forget to turn on error notification in all the browsers they're using to test the new web site code. Overall test coverage is usually lower in the less-popular browsers. New browser variants can gain popularity before your team can react.

After release, you're counting on customers to tell your support team about the problems they see. However, most browsers by default do not show error alerts. Certainly customers aren't bothered by seeing the yellow shield in the status bar. What if there's functionality they can't see because of the errors? What if it's a serious issue -- do you really want to wait through the support lag to find out?

The Solution

By adding a little bit of code to your web pages and building or using an existing error-capturing service, you can collect all of the errors that testers and real users are encountering.

All you need to do is:

1) Add code to your page that triggers on the first error event.
2) Have that code send the details of the error to a web service. See the description of the ScriptCanary.com code below to get started.
3) Create a web service that captures the error reports and saves them in a database.
4) Develop a reporting mechanism so that your team knows when there's a new error to review.

For steps 3) and 4), use any platform and technology you prefer. Or, sign up with ScriptCanary.com and skip those steps completely.