Troubleshooter JavaScript Debugger Tab

From Lianjapedia
Jump to: navigation, search

The Troubleshooter

The Troubleshooter provides a tabbed interface bringing together debugging, tracing and performance metrics to assist you in testing and tuning your Apps.

Troubleshooter


The JavaScript Debugger Tab

The JavaScript Debugger Tab contains the JavaScript Debugger. The tabbed upper container contains an Output panel and the files currently loaded in the JavaScript Debugger. The lower tabbed container has the following:

  • Command Window
  • Breakpoints Grid
  • Watches Grid
  • Call Stack Grid
  • Globals Grid
  • Locals Grid

Below these are: a message line showing the current operation and an actionbar.

Activating the Debugger

As with all Troubleshooter tabs, the JavaScript Debugger Tab can be selected by clicking on its tab.

It can also be activated automatically, when a running script issues the debugger command:

Debugger Command


or the debug() function:

Debug() Function


Loading Files in the Debugger

Scripts can be loaded into the JavaScript Debugger from the Apps Workspace. Open the file (double-click the filename) in the Script Editor then click the Open file in Debugger toolbutton.

Open file in Debugger


Right-clicking on the tab containing the script name displays the context menu, which also includes an option to Open File In Debugger.

Open file in Debugger


Alternatively, in the Pages Workspace, clicking on the 'flag' icon in the header of a Section loads the JavaScript Scripting Libraries and/or source code (WebView or Custom) for that Section into the JavaScript Debugger.

Debug the code for this section


Right-clicking in a loaded file displays the context menu:

Context Menu


Note: some menu options only operate when the file is in edit mode. See actionbar below for how to switch mode.

While the debugger is active, hovering the mouse over a variable will display its datatype, size and current value.

Variable


Output

The Output panel displays program and Command Window output.

Output


Right-clicking in the Output panel displays the context menu:

Context Menu


Command

The Debug Console contains a JavaScript Command Window.

Output and errors are displayed in the Output panel.

Breakpoints

Breakpoints cause execution of the running program to pause before the line of code set as a breakpoint is run.

Breakpoints can be set and unset using the actionbar or by clicking in the line number column to the left of the selected line.

Breakpoints


The Breakpoints grid shows the filename and line number for currently set breakpoints. Double-clicking on a grid row will clear that breakpoint.

Click Remove All Breakpoints in the actionbar to clear all current breakpoints.

Remove All Breakpoints


Watches

Watches (or 'watchpoints') cause execution of the running program to pause after the value of a field or memory variable set as a watchpoint changes. Watches are set using the actionbar:

Watches


The Watches grid shows the name, data type and current value for currently set watchpoints. Double-clicking on a grid row will clear that watchpoint.

Click Remove All Watches in the actionbar to clear all current watchpoints.

Remove All Watches


Call Stack

The Call Stack grid shows the filename and line number for each program in the current stack.

Call Stack


Globals

The Globals grid shows details of global objects and variables.

Globals


Locals

Not currently used.

Actionbar

Action Description
Run/Continue Run or continue running the program to the next breakpoint or watchpoint or to the end if no breakpoints or watchpoints are set.
Stop Stop debugging.
Edit Code Put the currently selected file into edit mode.
Save Code Displayed when edit mode (Edit Code above) has been selected. Click to save any changes and exit edit mode.
Revert Code Displayed when edit mode (Edit Code above) has been selected. Click to cancel any changes and exit edit mode.
Refresh all files Refresh all files in the debugger. This will update them with any changes made using the Script Editor in the Apps Workspace.
Step Over Move to the next line of code without running the current line.
Step Into Run the current line of code then move to the next line.
Step Out Run until returning to the calling program, then move to the next line.
Add Conditional Breakpoint Not currently supported.
Toggle Breakpoint Set a breakpoint on the current line, or unset the breakpoint if one already exists.
Toggle Watch Set a watchpoint on the currently selected variable or field, or unset the watchpoint if one already exists.
Remove All Breakpoints Remove all breakpoints.
Remove All Watches Remove all watchpoints.
Clear Clear the Output window.