 | JavaScript | |||
|---|---|---|---|---|
| Prev | Home | Up | Next |
When you are trying to debug client side code, there are not many ways you have available for seeing what is going on. Usually, you have to resort to placing a document.write() into the body of the page or perhaps putting up an alert box when the script runs.
In Netscape , you can bring up a debugging console by typing the string 'javascript:' into the location box and pressing return. Because you have not indicated any action to be passed to the interpreter, it opens the debugging window by default.
Another way to do some very effective debugging is to trap the onError event handler with your own debugger script. You would implement the debugging error handler as something that opens a window and places HTML into it. Then you attach the handler to the current window with the self.onerror property.
You might find it useful to open a document window with a "text/plain" MIME type so you can simply use document.writeln() actions to display some debugging text.
A useful technique when debugging form handlers is to loop through all the elements in the form, presenting them in an alert() box for inspection. Of course this is useful for all kinds of collections, not just forms.
The example script illustrates three different ways to do debugging. There are lots of other techniques too.
The first example simply uses document.write() and alert() methods to feed information back to the user.
The second example is more sophisticated and attaches an error handler to the onError event hook. This works in MSIE. In Netscape , it was expected to work, but as of the pre-release version PR3 it still would not catch the errors. Since Netscape is very likely to undergo rapid and frequent updates for the foreseeable future, this might start to work quite soon. Nevertheless, Netscape provides the JavaScript console which may be helpful too.
The third example is based around a call to the embedded Java VM and requests that it prints a message on its console display surface. Again, whether this works may be browser and platform dependent but it is a starting point for custom building your own suite of debugging tools.
The fourth example shows how to debug form values without causing a form submit or page refresh.
<!-- Simple debugging example -->
<HTML>
<BODY>
<SCRIPT LANGUAGE="JavaScript:>
// Write text into the document body at this point
document.write('Your text here');
// Present a dialog box with a message
alert('Your other text here');
</SCRIPT>
</BODY>
</HTML>
---------------------------------------------------------------
<!-- Custom debugging example -->
<HTML>
<HEAD>
<SCRIPT>
function debugHandler(aMessage, aURL, aLineNumber)
{
myText = "An error has occurred\n\nThe message is\n\n";
myText += aMessage + "\n\n at URL\n\n";
myText += aURL + "\n\non line number ";
myText += aLineNumber;
alert(myText);
return true;
}
</SCRIPT>
</HEAD>
<BODY>
<SCRIPT>
// Note that this may not work in Netscape
self.onerror = debugHandler("This is an example error", "local site", 21);
myError = null.open();
</SCRIPT>
</BODY>
</HTML>
----------------------------------------------------------------
// Java console debugging
// Calls the Java console output to print a debug message
function consoleDebug(errMessage)
{
java.lang.System.out.println(errMessage);
}
// Call the console debug output like this
if(someError)
{
consoleDebug("Display this text on the Java Console");
}
----------------------------------------------------------------
// A form debugger provided by Jon Stephens
// This can pasted into the location window if it is prefixed
// with javascript: and if all the line breaks and extra
// spaces are removed
function formDebug()
{
var output = "";
for(var i = 0; i < document.forms.length; i++)
{
for(var j = 0; j < document.forms[i].elements.length; j++)
{
output += "Form: " + i
+ " Elem: " + j
+ " Type: "
+ document.forms[i].elements[j].type + "; "
+ document.forms[i].elements[j].name + ": "
+ document.forms[i].elements[j].value + "<br>"
}
};
var newWin = window.open("","newWin","width=350,height=350");
with(newWin.document)
{
open();
write(output);
close();
}
}http://msdn.microsoft.com/scripting/default.htm?/scripting/debugger/ http://developer.netscape.com/tech/javascript/index.html?content=/software/jsdebug.html
| Prev | Home | Next |
| debugger | Up | Debugging - server side |
JavaScript Programmer's Reference, Cliff Wootton Wrox Press (www.wrox.com) Join the Wrox JavaScript forum at p2p.wrox.com Please report problems to support@wrox.com © 2001 Wrox Press. All Rights Reserved. Terms and conditions. | ||
