问题
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.
Is there a way to put a breakpoint in Chrome that will be hit just before a page refresh so I can inspect the call stack to see what caused it?
回答1:
Try this:
- Open your Chrome Dev Tools
- Navigate to the "Sources" tab
- On the right panel, expand "Event Listener Breakpoints"
- Expand the "Load" tree
- Check the
beforeunloadandunloadoptions
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...)
回答2:
In Firefox (not Chrome, it's important) 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.
回答3:
In the devtool, network pane, toggle the "Preserve log", carefully check the initiator column.
回答4:
You don't specify what's the 3rd party library does.
If it is a ui component like an ad or something similar, just place it inside an iframe with the sandbox attribute configured as you need.https://developer.mozilla.org/en/docs/Web/HTML/Element/iframe (Scroll down to the sandbox attribute section)
If it is something triggered by an event, just use (in chrome dev tools only) the getEveneListener() function and follow the listener trail... (hard, but possible)
Example:
The listener property will lead you to the actual functions that will be invoked. You can than search them in the obfuscated code and add debugger to understand it's purpose.
There are many other scenarios - if you can specify more.
回答5:
navigate to Chrome > Inspect Element > Source > Choose your minified Javascript file (Donot forgot to click on the {} option for better understanding, click the below link for screenshot) , then put the break point and process the rest.
CLICK FOR SCREENSHOT
来源：https://stackoverflow.com/questions/39065562/breakpoint-right-before-page-refresh