Visual Studio Hacks [Electronic resources]

Andrew Lockhart

نسخه متنی -صفحه : 172/ 68
نمايش فراداده

Hack 39. Debug Scripting Code

Visual Studio isn't just a great IDE, it's a great debugger for all sorts of Windows programming tasks. You can even use it to debug VBScript or JavaScript as it runs inside your web browser.

I spent a lot of time writing web applications without the benefit of Visual Studio. Before ASP.NET, I would usually use a web tool like HomeSite to write web applications. When ASP.NET came out and I started using Visual Studio, I got very spoiled using the debugging capability of Visual Studio for my ASP.NET code, but I always wished I could do the same for JavaScript or VBScript. Thankfully, Visual Studio provides this exact functionality. This hack details how you can set up Visual Studio to debug VBScript and JavaScript while it runs in your browser.

The first thing you have to do to enable debug scripting is to enable script debugging in Internet Explorer 6:

Open Internet Explorer.

Navigate to Tools Internet Options.

Select the Advanced tab, which is shown in Figure 5-18.

Uncheck the box titled "Disable script debugging (Internet Explorer)".

Figure 5-18. Internet Options dialogAdvanced tab

After this checkbox is unchecked, script debugging will be enabled in Internet Explorer.

It is important to understand that when debugging script code, you are debugging the actual code run by the browser, not your ASP.NET server-side code. When debugging script code, you will be looking at the code the same as you would if you used View Source in the browser.

Once script debugging has been enabled, you can start debugging a script in a number of different ways. The first option is two menu items that are available in Internet Explorer under the View Script Debugger menu. From this menu, you can choose Open and you will then be able to jump into the debugger and place breakpoints in your document. The second option is Break at Next Statement, which will cause Internet Explorer to break into the debugger whenever the next piece of script is run.

You can also debug from inside Visual Studio. Open your Web Project in Visual Studio and start the debugger. (You can start the debugger using the Play button, which will launch a new browser, or you can attach to an already existing Internet Explorer instance [Hack #41] .) Once the debugger is started, you need to access the Running Documents window. This can be done through the Debug Windows Running Documents or by using the shortcut key Ctrl-Alt-N (Debug.RunningDocuments).

The Running Documents window shows a list of all the currently running web documentsusually this contains only a single document. (In the case of frames or iframes, more than one document can show up here.) The Running Documents window is shown in Figure 5-19.

Figure 5-19. Running Documents window

In this window, you need to select the document you want to debugthe rendered HTML output of that document will be shown as a normal HTML file. You will then be able to set breakpoints and step through client-side script just as if it were any other code file, as shown in Figure 5-20.

Figure 5-20. Debugging client-side script

Web applications are constantly trying to behave more like their Windows client brethren, and this means more and more client-side scripting. The ability to debug client-side script can save tremendous amounts of time when trying to find bugs in it or when simply trying to understand the flow of the application.