28

I work with some very large and confusing JavaScript files that I did not write. Sometimes an alert will come up but I don't know where it's coming from.

You could search all files for the text contained in the alert but if that text is dynamic it won't work.

Is there a way to set a breakpoint in order to intercept an alert?

user1873073
  • 3,580
  • 5
  • 46
  • 81
  • 1
    Searching files isn't too hard especially for an alert. It's really not used a whole lot (mostly because javascript alerts are annoying). If you're on linux, use grep. If you're on mac, use grep. If you're on Windows, install Linux. – Joseph Marikle Jan 04 '13 at 14:49
  • That only works if you have the sources on disk. – mjaggard Jul 02 '19 at 15:14

4 Answers4

73

At the very top of your HTML:

window.alert = function() {
    debugger;
}

debugger is a statement that invokes any debugging functionality available. With developer tools open, you'll automatically hit a breakpoint whenever alert is called. You can then inspect the call stack to see exactly what called the custom alert function.

josh3736
  • 139,160
  • 33
  • 216
  • 263
  • This is amazing – nzaleski May 11 '18 at 14:57
  • And what if the alert is created by an extension (see https://stackoverflow.com/q/63911686/2532437)? – Benilda Key Sep 16 '20 at 01:02
  • 1
    @BenKey: It's a little trickier since extensions have multiple different js contexts to worry about, but I imagine you can just put `alert = function() { debugger; };` in your background and/or content script(s). – josh3736 Sep 16 '20 at 01:19
  • @josh3736 I think I understand. In the manifest.json file there is a background element that has a scripts child. The scripts child is set to an array of JS files. You mean to add the line to one of those. I will give that a try. – Benilda Key Sep 18 '20 at 19:55
  • @josh3736 This did not work. Did you mean "window.alert = function() { debugger; };"? – Benilda Key Sep 18 '20 at 22:09
8

It may or may not be helpful to you, but you can overwrite the alert function to do whatever you want with it. For example, instead of alert boxes, you could have it log the message to the console.

window.alert = function(msg) {
    console.log(msg);
}
alert('test');
Brian Glaz
  • 15,468
  • 4
  • 37
  • 55
6

I agree with Brian Glaz, but in order to get more details (line number) you might try to throw an error when alerting something and outputting the error on the console. this way, the console will point you to the right line number where the alert function was called.

Put this snippet at the top of your document and give it a try :

var originalAlert = window.alert;
window.alert = function(){
    try{
        throw new Error('alert was called');
    } catch(e){
      console.warn(e);
    }
    return originalAlert.apply(window, arguments);
}
gion_13
  • 41,171
  • 10
  • 96
  • 108
2

Open Chrome push F12 key and go to Sources. Then choose a script file Ctrl+F and search for alert. You can put breakpoint on any line you wish

kidwon
  • 4,448
  • 5
  • 28
  • 45
  • 2
    This doesn't work for me. I have several thousand scripts on the page (not mine!!) and chrome doesn't search them all. – mjaggard Jul 02 '19 at 15:13