The Chrome debugging tools are great most of the time, but lately I've been annoyed with errors that are rethrown. There doesn't seem to be any way to see the call stack unless you have it set to pause on caught exceptions, but then you run into gobs of errors from other libraries. It makes pausing on exceptions pretty useless if you want to display errors nicely.
Consider this example (http://jsfiddle.net/redbmk/83y8L/1/):
HTML:
<button id="push-me"></button>
Javascript:
function beDangerous() {
var one = 1, rand = parseInt(Math.random() * 2);
if (rand === one) console.log("You Win");
else if (rand === zero) console.log("You Lose");
}
function warnUser(error) {
alert("Hey, something went wrong! Refresh the page");
throw error;
}
function runCode() {
try {
beDangerous();
} catch (e) {
warnUser(e);
}
}
document.getElementById("push-me").addEventListener("click", runCode);
When you run into an error, the call stack shows you that warnUser
threw an error and was called by runCode
. There's no way to trace it back to beDangerous and see what the variables were at that point. You can see the stack trace, but only by looking at error.stack
, and that doesn't give you any context. Replacing throw error
with debugger
doesn't seem to help (and that wouldn't allow you to turn off debugging).
Is there a better way to do this? It's been bugging me for a while now.
By the way, this question says to throw error.stack
, but that doesn't work for me (and as I understand it the stack
property is non-standard anyway, so this wouldn't work correctly for other browsers). This question says it's a known bug in Chrome that is marked as being fixed in version 19, but this is happening for me on version 35.