Code Decorations

After executing an application with Dbux enabled, all executed code is decorated with ↳ ↱ ↳ ƒ etc.

• These decorations allow us to better understand which parts of the code actually executed, and covey some basic properties of how the code executed.
• You can toggle decorations via the Dbux: Hide Decorations and Dbux: Show Decorations commands:

Interpreting Decorations

• Example: f()↱; - the function f was executed and recorded, and we can step into it.
• Example: g()↱; - the function g was executed but not recorded, and we cannot step into it. This means that g is a native function or not recorded for other reasons.
• All code decorations and their meanings are defined in dbux-code/src/codeDeco/traceDecoConfig.js.

Examples

In this buggy code, we can see that line 6 never executed, just from the code decorations:

TODO: more examples