Debug the Javascript script of the Atlas Client
Dflying Chen
Microsoft MSN TC
April 2006 English version: http://dflying.dflying.net/1/archive/115_atlas_client_side_javascript_debugging.html is applied:
Microsoft ASP. Network 2.0
Microsoft ASP. NET Atlas March CTP
Microsoft Visual maxcompute 2005
IntroductionWriting Atlas JavaScript scripts will be more challenging than writing C #, because JavaScript does not have a compile-time check and there is no smart awareness prompt during coding. You also need to track the network communication between the server and the client at runtime. At present, there is no very powerful JavaScript ide To help you share the complicated work. I have been using Atlas for about half a year at work. I have accumulated some knowledge and experience in debugging the Atlas program and hope to share it with you. Please correct me for any omissions.
Capture HTTP
Communication contentIn any Ajax program development, it is very important to monitor the communication content between the server and the client. In this way, you can know what the server actually sends and what the server actually returns to me. When your atlas program encounters problems, you must first check the communication between the client and the server to see if the communication content is what you expect. Here, the recommended tool is fiddler (which can be downloaded at http://www.fiddlertool.com/fiddler ). Fiddler is an HTTP debugging proxy that records all HTTP Communication content (including Header, cookie, and communication content) between your computer and the Internet, and sets breakpoints, modify incoming/outgoing data. Fiddler is much simpler than similar software such as NetMon or Achilles, and provides a simple but powerful JScript. Net-based event script subsystem. Fiddler supports Internet Explorer and other browsers. The following is the running time of Fiddler:
Use Atlas debug helper classIf your atlas program runs in debug mode, Atlas automatically generates a debug helper class for you. This debug helper class is a global object named
DebugCan be accessed in any part of your code. By using this debug object method, you can dump an object at runtime (display the internal status of the object at the end of the page in readable form) and display trace information, use assertion and break to the debugger. If the Visual Studio script debugger (see below) has been attach to this Internet Explorer, the output window of Visual Studio also displays trace information. This debug helper class provides the following methods:
- Debug. Assert (condition, message, displaycaller)
AssertionsConditionTrue or not. IfConditionIs false, this method will displayMessage. IfDisplaycallerIf this parameter is set to true, the caller information is displayed.
- Debug. cleartrace ()
Clear trace output.
- Debug. Dump (object, name, recursive, indentationpadding)
Display at the end of the page in readable formObjectThe internal status of the object.NameThe value is used to display the name of the object. IfRecursiveIf this parameter is set to true, information of all contained objects in the object is displayed recursively.IndentationpaddingValue is used to specify the start text of each output line.
- Debug. Fail (Message)
Break to the debugger. (Applies only to Internet Explorer)
- Debug. Trace (text)
SetTextOutput parameters to the trace.
To demonstrate how to use DEBUG. Dump (), see the reference document.
Set Visual Studio
Script debugger attach
To Internet ExplorerYou can use the Visual Studio script debugger to debug your JavaScript code. Although this debugger has limited functionality and many bugs, I think it is already the best JavaScript debugger on the market. You must install Visual Studio 2005 and Internet Explorer 6.0 or later to use the Visual Studio script debugger. By default, Internet Explorer ignores all Javascript script errors. You need to manually set some properties for Internet Explorer to enable debugging. Open the Internet Explorer window
ToolsSelect
Internet Options, In
AdvancedLabel, do not select
Disable script debugging (Internet Explorer)And
Disable script debugging (other)And select
Display a notification about every Script ErrorItem. You need the attach debugger to the Internet Explorer process to start debugging. Use F5 in Visual Studio to start debugging. Alternatively, you can attach the Visual Studio script debugger to an Internet Explorer process that is already running:
ViewUnder the menu, expand
Script DebuggerMenu item, select
Open. In the displayed dialog box, select a running Visual Studio or start another Visual Studio.
Script debugger skills and existing bugsNote the following when debugging the Atlas application:
- After the Visual Studio script debugger attach to Internet Explorer, you can see that the Atlas client class library uses webresource. axd ?... Such a resource file appears in the script browser. This is dynamically generated on the server side by the Microsoft. Web. Atlas. dll assembly. One known bug here is that Visual Studio may prevent you from Opening this file when debugging is started. That is to say, when you double-click the file, there is no response, or an error message is displayed. The solution is to open another Javascript file and try again. (Pay attention to this webresource. axd ?... Is a large file and it takes a while to open it .)
- Visual Studio does not allow you to set breakpoints in JavaScript code in the aspx file. There are three solutions: one is to track the Javascript in aspx step by step from the external JavaScript function. Once the debugger stops in the Javascript in the aspx file, then you can set a breakpoint in a line below. The second is to add Debug. Fail () Where break is needed, so that when the Visual Studio script debugger break arrives here, you can set breakpoints elsewhere. Third, place all your custom JavaScript code in an external file and reference it in Aspx.
- Visual Studio does not allow you to set breakpoints on the first line of an anonymous method (similar to this. func = function. You can add meaningless code (such as var a = 3) before the first line to make the first line become the second line, in this way, you can set the corresponding breakpoint in the second line.
- During the debugging process, when you move the mouse over a variable in Javascript, the variable value may be incorrect. For details, refer to the following: the length is 0, it should actually be 10.
In this case, you should select (highlight) All statements from the object to the attribute, and then move the mouse over the selected content to get the correct value. See:
- Sometimes, after a debug, you can findScript DebuggerWhen the menu item disappears, you can open an Internet Explorer window to retrieve the lost menu item.
Some basic content of ASP. NET Ajax debugging collected
