Random Musings

April 27, 2009

IE 8 : Script Debugger

Filed under: IE Developer Toolbar — haditeo @ 10:30 pm

How to debug a page using IE 8 Script Debugger feature ?

1) First of all load the page containing javascript properly

2) Press “F12” to load the IE 8 Developer Tools

3) Choose the “Script” tab, beside the “Start Debugging” button, you can select the file that contains the javascript that will be debugged. In my example, it’s loading the “webform1.aspx”.

select-a-file-to-be-debugged

4) In the top right corner, there is a textbox containing the text “Search Script”. Search a particular method to be debugged by inserting the method name into the textbox and click the forward icon button

5) Place a breakpoint properly and click “Start Debugging”

start-debugging

6) Invoke an action that will trigger the method to be invoked by the javascript engine. In my example, i click an image button to trigger the invocation of the “LaunchLookup” method.

debugger-hit

7) When javascript engine hit the correct intended method, it will highlight the particular line. It’s very convenient to use the IE 8 Script Debugger. Previously, i need to place a “debugger” line to trigger the Visual Studio 2005/2008 IDE to hook into the particular method.

8 ) In the “Locals” tab, the relevant variables are shown here

local-window

9) Developer can also check the value of the custom variable in the “Watch” window

watch-variable

10) Here i would like to check the value of the sender parameter, as well as invoke a method (sender.get_id()) to check what is the instance name that trigger this method

sender-get-id

Advertisements

Leave a Comment »

No comments yet.

RSS feed for comments on this post. TrackBack URI

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Blog at WordPress.com.

%d bloggers like this: