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.

4
  • 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. Commented Jul 14, 2015 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
    Commented Jul 14, 2015 at 15:10
  • I think the second way do not modify your code? Commented Jul 14, 2015 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
    Commented Jul 14, 2015 at 15:14

2 Answers 2

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.

2
  • 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
    Commented Jul 14, 2015 at 15:12
  • I suppose I'd have to manually set those breakpoints in Dev Tools.
    – pushkin
    Commented Jul 14, 2015 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');

4
  • 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
    Commented Jul 14, 2015 at 15:44
  • Oh, I guess I can't, because it breaks where debugger; is. Nevermind.
    – pushkin
    Commented Jul 14, 2015 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. Commented Jul 14, 2015 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. Commented Jul 14, 2015 at 15:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.