A website that I'm using has an annoying pop-up that randomly appears on the screen every x minutes. Inside the Chrome developer tool bar using the 'break on subtree modifications' option, I can see that it's calling insertBefore and removeChild functions inside of jquery-2.0.3.min.js. Specifically the following.
before: function() {
return this.domManip(arguments, function(e) {
this.parentNode && this.parentNode.insertBefore(e, this)
})
},
after: function() {
return this.domManip(arguments, function(e) {
this.parentNode && this.parentNode.insertBefore(e, this.nextSibling)
})
},
remove: function(e, t) {
var n, r = e ? x.filter(e, this) : this, i = 0;
for (; null != (n = r[i]); i++)
t || 1 !== n.nodeType || x.cleanData(mt(n)),
n.parentNode && (t && x.contains(n.ownerDocument, n) && dt(mt(n, "script")),
n.parentNode.removeChild(n));
return this
},
On the website itself it generates a div with a random css id, hangs around for a minute then disappears.
It doesn't look like any particular event is causing this to fire.
Do you have any tips on how I can find out more about what's happening and how I can block it? I believe I should be able to block this using something like greasemonkey.
Any insight would be much appreciated, plus this has been a valuable learning experience so far.
Thanks for taking the time to read this.
In the browser's debugger, you can typically see a stack trace view in the right panel. This tells you what called the jQuery functions.
If you can't see the trace, e.g. the stack trace mysteriously begins from some async code or requestAnimationFrame, set a breakpoint as early as possible in the code, then patch window.setTimeout and window.setInterval to have a debugger; statement - that way you can find all locations that call those functions.
Or, in that early breakpoint, call monitor(setTimeout) in Chrome's devtools' console to monitor all calls.