Presentation is loading. Please wait.

Presentation is loading. Please wait.

Debugged!.  You know that old line about an ounce of prevention?  It’s true for debugging.

Similar presentations


Presentation on theme: "Debugged!.  You know that old line about an ounce of prevention?  It’s true for debugging."— Presentation transcript:

1 Debugged!

2  You know that old line about an ounce of prevention?  It’s true for debugging

3  Place the JavaScript code in an external file (this will make line by line debugging match correctly as some browsers play games with line numbers)  Know what debugging is available in each browser and learn to use them well  Use alerts and assertions  Logging

4 Simply create another file where all of the JavaScripting will reside and place a link in the web page like the example below: This points the webpage to use the JavaScript file “java” available in the js folder. Now if things go south, debugging should point to this file on a line by line basis.

5  In IE, go to Tools > Internet Options and choose the Advanced tab. Check the box for "Display a notification for every script error.”  In Safari, it is hidden a bit. Type the following command in Terminal (with Safari NOT running): % defaults write com.apple.Safari IncludeDebugMenu 1 Open Safari again and a debug menu should be available To remove the menu, repeat the above code and use a “0” instead of the “1”

6  Mozilla Firefox requires the DOM Inspector option on the Tools menu. If this is not present, reinstall Firefox with the Developer Tools option turned on (Custom > Developer Tools).  Install the Web Developer Extension (available at: http://chrispederick.com/work/webdeveloper ) http://chrispederick.com/work/webdeveloper  Also install the JavaScript Debugger known as Venkman (available at: http://www.mozilla.org/projects/venkman ) http://www.mozilla.org/projects/venkman

7  Disable page cache (Tools >Web Developer >Disable> Disable Cache)  There are many settings under Tools >Web Developer> Options>Options.  Miscellaneous >Open the JavaScript console when the current page generates a warning— Not advised unless you can read at Evelyn Wood speeds as this returns a ton of messages when code is bad.  Sidebar >Open the DOM Inspector in the sidebar — A nifty little side window which can be useful.  Sidebar>Open the JavaScript console in the sidebar — Same type of sidebar.  View Source >View Source in a tab instead of a window - did not work for me.  When making changes to your options, remember to close and reopen Firefox to activate the changes.

8  Useful, but use sparingly at key points in the code to avoid having to close multiple windows if/when code goes wrong  Avoid nested alerts as things can get messy rather quickly  Make the alert message something that aids in understanding the script’s operation and where the issue might reside

9  A line of code that states basically, at this point, “X” must always be true.  Define the parameters  Place the assertion at points in the code where a certain expectation must be true or false

10  Almost every piece of code ever written and worth its binary weight has a logging mechanism  This is the preferred method to use instead of multiple alerts (save alerts for showstoppers)  Insert the log() function and create it such that any errors will write to an external file for later review, thus making corrections a little simpler

11  Write good code (of course, but no one’s perfect!)  Plan and prepare an external JavaScript file  Learn what debuggers are available for each browser you might use and familiarize yourself with their functionality  Write useful alerts and assertions  Use logging!!!

12


Download ppt "Debugged!.  You know that old line about an ounce of prevention?  It’s true for debugging."

Similar presentations


Ads by Google