Debugging overview
Web Inspector lets you pause code execution, log messages, and catch errors with its debugging tools. Web Inspector debugging tools can be found in the Debugger tab, Resources tab, Console tab, and the Develop menu.
Debugger tab: Contains tools to deal with breakpoints (described below). In this tab you can also add a JavaScript breakpoint, edit a breakpoint, add conditions to a JavaScript breakpoint, and step through JavaScript code.
Resources tab: Contains tools to highlight type and code coverage during code execution.
Console tab: Allows you to log messages with the console.
Develop menu: Provides several options to mimic alternate web environments. See Develop menu.
About breakpoints
A breakpoint is an indication to the debugger to pause the execution of your code at a certain point. There are several different types of breakpoints that can be used in the Debugger tab:
Global breakpoints cause the debugger the pause at certain times regardless of where they occur in a resource. Global breakpoints cannot be deleted.
All Exceptions breakpoints pause the debugger whenever an exception is thrown, even if the exception would have been caught by a try-block. It pauses at the point where the exception was thrown. The exception can be inspected by using the special $exception variable in the Console.
Uncaught Exceptions breakpoints pause the debugger whenever an exception is thrown and reach global scope because the exception was not handled by any try-blocks. The exception can be inspected using
$exception
. All Exceptions and Uncaught Exceptions breakpoints are mutually exclusive.Assertion Failures global breakpoints pause the debugger whenever the condition argument in console.assert(condition, message, ...); evaluates to false. The debugger pauses at the expression where
console.assert
is evaluated.User-defined breakpoints appear below global breakpoints and are grouped by the resource in which they are set.
About the Scope Chain
The Scope Chain area in the right sidebar of the Debugger tab shows the chain of variable scopes that the current line of execution has gone through already when execution is paused. This includes local/block scopes, closure scopes, function scopes, and the global/window scope. Each scope lists the variable bindings introduced in that scope, and their current values. Variables are normal object trees and can be expanded or logged to console via shortcut menu commands.