0

Is there a way to set breakpoints when specific functions are about to execute?

It needn't be an explicit breakpoint - I just want execution to pause when a console.log() is about to be called.

Or should I resort to this method.

I prefer to accomplish this without modifying my code, or manually setting breakpoints at every console.log.

Community
  • 1
  • 1
pushkin
  • 9,575
  • 15
  • 51
  • 95
  • 1. As that topic said, put `debbuger;` before the `console.log`. 2. Open the dev-tool, switch to `Sources` tab and find that `console.log` in your code, click on its line number at the left and it should set a break point for you. – fuyushimoya Jul 14 '15 at 15:04
  • I was just wondering if there was a way of doing it without modifying my code. But I suppose I'll use `debugger;`. – pushkin Jul 14 '15 at 15:10
  • I think the second way do not modify your code? – fuyushimoya Jul 14 '15 at 15:11
  • That is true. Sorry I wasn't clear. I don't want to modify the code, but also I don't want to have to manually click on every `console.log`. I was hoping Chrome Dev Tools had a way of just telling it to break in front of all `console.log` calls. – pushkin Jul 14 '15 at 15:14

2 Answers2

1

Yes that's the trick. Create a custom logging function, put debugger in it and call console.log and you have what you wanted:

function log(message) {
    debugger;
    console.log(message) ;
}

Edit:

You can also replace console.log by a similar fonction that calls the original:

var clog = console.log;
console.log = function(message) {
    if(message == '...') {
        debugger;
    }
    clog.apply(console, arguments);
}

This code will affect all log calls within your page. The check is to catch a certain message. Remove it to stop always.

manji
  • 47,442
  • 5
  • 96
  • 103
  • What about breaking before `console.log` in code I didn't write. Like in a `backbone.js` that's hidden away somewhere. Is there a way of targeting those logs as well without editing the files? – pushkin Jul 14 '15 at 15:12
  • I suppose I'd have to manually set those breakpoints in Dev Tools. – pushkin Jul 14 '15 at 15:15
1

How about call this at the very start that add a pause break for your every console.log?

This replace the original console.log, pause break first, then call the orignal console.log for you. And this will be apply on all console.log calls.

(function () {
  var oldLog = console.log;
  console.log = function() {
    debugger;
    oldLog.apply(console, arguments);
  }
})();

console.log('hello');
fuyushimoya
  • 9,715
  • 3
  • 27
  • 34
  • Is there a way to make it break at the original call rather than inside that function? Granted, I could just step a couple times to get back to where I was, so it's not a big deal. – pushkin Jul 14 '15 at 15:44
  • Oh, I guess I can't, because it breaks where `debugger;` is. Nevermind. – pushkin Jul 14 '15 at 15:46
  • I'm afraid not, but a good news, when paused, you can see there's a `Call Stack` on the right of the panel, should be just below `Watch`, you can click on it to jump out of current scope, and back to scope where it is just about to be called. – fuyushimoya Jul 14 '15 at 15:46
  • 1
    For example, when see the stop on this snippet, you should see first line is `console.log`, and 2nd line is `(anonymous function)`, click on the second, you should see chrome dev guide you back out of `console.log` to the point its about to be called. – fuyushimoya Jul 14 '15 at 15:48