Recently, a weird front end error got us stuck. The browser console was showing lots of red error messages on window resize, yet no actual exceptions were thrown.
Problem was, this low level function is called A LOT, and in most cases with valid arguments. Only very infrequently the value of the second argument "e" is something that gets cast as "NaN". How do we set a breakpoint that stops on this line, but only for specific value of "e"?
Use conditional breakpoints!
Run the code, and it does stop only if the second argument is "NaN".
Now I could go up the stack to find the source of invalid argument.
We don't have to stop at the conditional break point. Sometimes we just want to log argument
values, for example. In this case, we can set the conditional breakpoint with simple
console.log('arg is', arg) expression. Every time the function runs, the value is
I do not think you can modify the variables from the conditional expression though. The breakpoint expression seems to be evaluated in an isolated context, thus changing "e" for example does not work. For example, trying to set "e" to 0 leaves it unchanged.
String(e) === 'NaN' && e = 0 && e
To learn more Chrome DevTools tips and tricks, read the long and excellent Tips And Tricks.