instrumentation-demo

Debugging with Source Code Instrumentation - Demo

Creating a closure

The following JavaScript code snippet creates a closure with hidden state.

The debugger can invoke the closure but it will not be able to step into the closure and access the bound variable unless the original code was instrumented.

lively.createCounter = function() {
    var i = 0;
    return function() { return ++i; };
}
lively.myCounter = lively.createCounter();

Run Code

Instrument and Run Code

var a = lively.myCounter();
var b = lively.myCounter();

Debug Code

Capturing a complex call stack

The execution of instrumented code can be stopped at any point and the complete call stack including local variables will be visible in the debugger. It is even able to resume the execution of the code after the breakpoint was reached.

function a(callback) {
    var i = 23 + 42;
    callback(i);
}
function b() {
    var prev = 5;
    a(function(result) {
        debugger;
        alert(prev + result);
    });
}
b();

Run Code

Instrument and Run Code

Click either on "Run Code" or on "Instrument and Run Code" and then try to debug the following code. The debugging experience is different depending on whether the snippet above was instrumented or not.

Disconnected