Simplify debugging

When we have a bug it is much prettier to put something like '^' (without quotes) in the end of line and gain debug output about every expression on this line (mostly it'll be a result of single expression).

Example:

const a = 1 + 2;^
const b = {^
    c: 12,
    d: "thirteen",
};
const [e, f] = [14, 15];^

Debug output should be like this:
'a: 3
b: {c:12, d:"thirteen"}
e: 14, f: 15'

And it is much more simple and nice to insert and delete '^' during debugging than insert and delete something long and annoying like 'console.log' and cover the expression in parentheses.

Have you tried using a debugger (in Chrome, in Firefox, …) for debugging, instead of adding logging statements? They can print out the result of every statement without even touching the code.

1 Like

Of course! I've taken this idea exactly from the debugger's inline output.

Here are the reasons I prefer using logging statements in most cases:

  1. They give the instant result (one do not need to care about any "steps")
  2. They give the opportunity to see & analyze debug output from multiple files (even if debugger saves history when switching files during single debug session, it is more comfortable to have all debug info in one tab).
  3. They show the debug info I exactly need, not the debug output about every assignment (in most cases it is too much of needless output that slows down the debugging process).

So, the logging statements give us the instant output of the info we really need and we can see all debug output in one console tab. And it'll be great if the syntax of this tool becomes concise and easy to use.

Hi please check out this https://github.com/tc39/proposal-standardized-debug

1 Like