How to Debug Java script in Vs2003 and Vs2005.

Every one of us is well aware of problems we face when debugging client side script code. i find new techniques and troubleshooting tips that help debug client side script code efficiently in Visual studio 2003-2005.

Client side script code means that it can be VB Script Java script. Client side script is embedded in .aspx pages, .html files or inside .js files. Client side script is loaded by client application like Internet Explorer running on your local machine.

There are two different ways in which can debug client side scripts in Visual Studio
2005. They are :

• Visual Studio .Net IDE
  

• Microsoft Script Editor

1) Configuring machine to enable client side script debugging.

Enable client side script debugging in Internet Explorer. Go to Tools -- > Internet
Options and on advanced tab make sure that the Disable script debugging is unchecked.
Below listing highlights above step.

We create an small ASP.NET small web application that greets the user. Open Visual Studio 2003/2005 Environment and On the File menu create new web application with give name what you like.

Copy and paste below code in your script tag of head section.
function Greeting()

{

//debugger keyword invokes Script explorer
debugger;
var firstname;
var lastname;
var greeting;

firstname = document.all('txtName1').value;
lastname = document.all('txtName2').value;
greeting = "Hello" + " "+ firstname + " " + lastname + " " + "Have a great Day!";
alert(greeting);
return false;
}

Copy and paste below code and paste between your forms tags.

FirstName:
LastName:

Press F5 to start debugging. IEXPLORE.EXE process is attached automatically to debugger. We are using
IE to load the scripts so IEXPLORE.EXE is attached.

Note : You should always include keyword "debugger" as the first line of Java script code you wish to debug in Visual studio 2005.


This keyword automatically invokes Visual Studio client side debugger. When you run above code, we get the below output Screen 2 Go back to Visual Studio .Net environment and click Debug -- >Other windows-->Script Explorer and set the breakpoints at the desired places. Again return back to IE. Give the values for the first name and last name and click greeting button. You can see control returning to Script Explorer as shown in below listing. Use F10 to step over each line of code. Similarly, use F11 to step into each line
of code. In script explorer, you can set new breakpoints and use Locals Window to inspect values of local variables in the script. Immediate Window evaluates the values of variables. See the Data tips by hovering over the variables.

When you use a "Debugger;" in Java script.

Debugger keyword will create a breakpoint. When this breakpoint gets hit, your MSE will launch and you will see a message that says "An unhand led exception 'Script Breakpoint' occurred" in script.

Choose yes and remaining steps are same as discussed as above .Control is transferred to Script Editor IDE.

Visual Studio 2003/2005 Integrated debugger is very powerful and rich in features. You can now debug client side script code with the same flexibility as you used to have with debugging server
side code.

Now say Good Bye to alert statement .Cheers :-)

"SAVE PAPER - THINK BEFORE YOU PRINT!"