Skip to page content or Skip to Accesskey List.

Work

Main Page Content

Javascript Debugging Part 1 Of 3

Rated 3.56 (Ratings: 3)

Want more?

  • More articles in Code
 
Picture of Jeff Howden

Jeff Howden

Member info

User since: 14 Dec 1998

Articles written: 21

Undoubtedly, when writing a new script or trying to tweak a once-working script to suit your needs better, you've run into instances where your attempts have gone up in a fiery ball of flames; maybe you misspelled a variable, were trying to reference an object that didn't yet exist, or were using a reserved word. Whatever the problem, the quickest way to finding out where the problem lies is to see the errors your script produced. Using the information in the error, you can locate it easier and understand better what you need to fix. There are different ways of going about determining the errors depending on the browser you're using. I will attempt to cover all the tricks you'll need to get this working in Netscape Navigator 4.06/4.5+ (The JavaScript Console was introduced with JavaScript 1.3 in Netscape Navigator 4.06 & 4.5) and Internet Explorer 4+ to suit your needs and particular working style.

By default, the JavaScript console/alerts aren't displayed in either of the browsers we're covering, unlike earlier versions of Internet Explorer and Netscape Navigator 4. While this makes for a smoother viewing experience, it will make your development process very frustrating. The only clue you'll have that an error occurred is an error warning in the status bar (see below). However, if you prefer to have the errors automatically displayed, there are four easy ways in Netscape Navigator and two easy ways in Internet Explorer to view JavaScript errors.

Netscape Navigator JavaScript Error Warning

Netscape Navigator JavaScript Error Warning



Internet Explorer JavaScript Error Warning

Internet Explorer JavaScript Error Warning

Using Netscape 4+

  1. Type JavaScript: into the location bar of your browser.


  2. Drag the link below to your Personal toolbar. To see any errors, simply click the Display Errors button on your Personal toolbar.
    1. Display Errors


  3. Edit your preferences so the new JavaScript console automatically opens when an error occurs.
    1. Quit Communicator before doing this, otherwise your changes will be lost.
    2. Open your Navigator preferences file (prefs.js), normally located in whichever folder your user profile is stored.
    3. Add the following line to the file:

      user_pref("javascript.console.open_on_error",true);
    4. Save and restart Communicator.


  4. Edit your preferences so the traditional JavaScript alert window automatically opens when an error occurs.
    1. Quit Communicator before doing this, otherwise your changes will be lost.
    2. Open your Navigator preferences file (prefs.js), normally located in whichever folder your user profile is stored.
    3. Add the following line to the file:
      user_pref("javascript.classic.error_alerts",true);
    4. Save and restart Communicator.

Using Internet Explorer 4+

  1. You can double click the status bar to find out what the error was and what line it occurred on if you notice one of the messages below and a warning icon as illustrated above.
    1. Done
    2. Error on page
    3. Done, but with errors on page


  2. If you'd prefer to get notification of every error, then turn error notification on.
    1. Make sure Display a notification about every script error under the Advanced tab of your Internet Options is checked.
    2. Make sure Disable Script Debugging under the Advanced tab of your Internet Options is unchecked.

That's all for this installment, however, in the near future I will be posting two more articles about debugging JavaScript. The next article will cover the different types of JavaScript errors and common coding mistakes. The third article in this series will be an advanced JavaScript debugging article, which will discuss suppressing errors for all users, catching errors, and hidden error reporting.

Jeff Howden (.jeff) is a web developer working for Vos & Howden, LLC in Portland, Oregon where he's partnered with long-time colleague, Anthony Vos. His skills include ColdFusion, JavaScript, CSS, XML, relational databases, and much, much more. His biggest professional accomplishments include, but are not limited to:

  • building a ColdFusion-based e-commerce solution for Mt. Bachelor that transacted over $1.62 million dollars in September 2001 with 0 (yes, that's zero) ColdFusion errors and then an almost completely rebuilt version transacted $2.86 million dollars in September 2002.
  • being asked to be a Technical Editor for the ColdFusion MX book, Inside ColdFusion MX from New Rider's Publishing company.
  • being asked by BrainBench to perform quality control on their JavaScript 1.5 certification test after receiving the highest beta test score out of 200 testees.
  • managing the server that hosts evolt.org and withstanding a slashdotting that brought over 1,000,000 hits to the site, over 10 gigs of data transfer, and an average in excess of 2300 unique visitor sessions per hour, all within a 24-hour period and the server never hiccuping once.

The access keys for this page are: ALT (Control on a Mac) plus:

evolt.org Evolt.org is an all-volunteer resource for web developers made up of a discussion list, a browser archive, and member-submitted articles. This article is the property of its author, please do not redistribute or use elsewhere without checking with the author.