Monitoring your site for JavaScript errors

One challenge in ensuring a flawless web experience for every user is that you have no visibility into browsers errors that users on your site experience .  With the wide variety of browsers, operating systems, and endless configuration options available to end users it is nearly impossible to catch all bugs during Quality Assurance efforts.

 

BrowserHawk solves this challenge by monitoring your web pages for JavaScript errors that occur "out in the wild".  This enables you to quickly identify and fix these otherwise hidden issues, which typically go either unnoticed or unreported by your web site visitors.

 

When JavaScript errors occur BrowserHawk will log details of the error to your database.  The details include the full path and name of the page where the error occurred,  a description of the error,  and line number where it occurred.

 

In addition, you can optionally assign several parameters to be logged along with the error record, such as the user ID and session ID under which the error occurred, and any other arbitrary data you wish.

 

Note: This feature requires the Enterprise Edition of BrowserHawk.

Configuring your web pages for error monitoring

To use BrowserHawk to monitor your web pages for JavaScript errors, each page on your site that you wish to monitor must be instrumented to enable BrowserHawk to track the page.  This is done by inserting a single line of JavaScript into your master page, master template, common include file, or other means used to add common elements (such as navigation) to all your pages.

Instrumenting your pages for error monitoring is a simple process, as follows:

  1. Set up and configure the BrowserHawk Reports Web Service (BRWS).  When JavaScript errors are detected, the errors are reported to the BRWS, which then logs the details to your database.

  2. Edit the bhawk_errortracker.js file that is distributed with BrowserHawk. Users of BrowserHawk for .NET or ActiveX can find this file in the \Program Files\cyScape\BrowserHawk\scripts directory.  Users of BrowserHawk4J can find the file in the zip file used to install BH4J.  Most importantly, you must update the "recordServer" variable in this script so that it points to your BRWS.  See the comments in the script file for more details, including other configuration options.

  3. Place a copy of the edited bhawk_errortracker.js file on your web server in a web directory that is part of your site. For example \inetpub\wwwroot\mysite\someFolder.

  4. Edit your master page, master template, or common include file to add the following line of code somewhere within your HEAD section of the HTML:
    <script src="/someFolder/bhawk_errortracker.js" type="text/javascript">&nbsp;</script>

    Note that you should change the path shown above to point to the actual web path of the directory where you placed the script.

    Note that the seemingly extra &nbsp; is purposeful - do not remove this.

After following these steps, JavaScript errors that occur on your web site will be now to logged to your database.

 

Tip: You can also call the bhawk_logerror() function in the error tracking script to log any custom error messages you wish.  For example, within the error handling code in your JavaScript you may wish to log a debugging or informational message to your database for troubleshooting or Quality Assurance purposes.  See the source of the bhawk_errortracker.js file for more information.

 

To test your configuration you can use the following sample web page, which purposely causes a JavaScript error to occur so that it is logged.  Remember to change the path below to match the path to where you placed the bhawk_errortracker.js script file:

 

<html>

<head>

<script src="/someFolder/bhawk_errortracker.js" type="text/javascript">&nbsp;</script>

</head>

<body>

<script>

   if (noSuchVar == true) ; // this will trigger an error since this var does not exist

</script>

Done - error about noSuchVar not being defined should now be logged to your database

</body>

</html>

 

See Also:

About BrowserHawk Reports

Detecting Page Load Times

Rules Enforcement Technology (RET)

Monitoring your site for JavaScript errors