Breakpoint right before page refresh?

Question

I\'m debugging some 3rd-party minified Javascript that somewhere is triggering a browser page refresh. However, I can\'t figure out what part of the code is causing the refresh.

Answer 1

In Firefox (not Chrome, it's important; UPD 2020: it now works in Chrome as well) Developer Tools, go to the console, enter addEventListener('beforeunload',()=>{debugger}), and execute your code. After the debugger stops at the debugger statement, look at the call stack. You'll see what triggered the event. Chrome didn't have it there.

At least, this worked for me.

Answer 2

Try this:

1. Open your Chrome Dev Tools
2. Navigate to the "Sources" tab
3. On the right panel, expand "Event Listener Breakpoints"
4. Expand the "Load" tree
5. Check the beforeunload and unload options

See if that helps; screenshot below.

Edit: Alternately, if that doesn't work, you can use Chrome to search all loaded scripts for the code that might be responsible. There's apparently a lot of ways to refresh the page with JavaScript but they mostly have a few common strings like "navigator", "location", "reload", "window".

Finally, if there's a link to the same page you are on, it's possible some JS is triggering a click on it-- unlikely, but worth exploring if nothing else has worked thus far...

(Please excuse the formatting as I'm on mobile...)

NOTE: It seems occasionally, for reasons I don't yet fully understand, this solution fails to actually cause the debugger to pause; in this situation, I found that thorn̈'s answer to this question did the trick for me.