Last active
August 29, 2015 14:18
-
-
Save majido/929eb68d37727d928455 to your computer and use it in GitHub Desktop.
Small script to help detect what is causing scrolls on the page (requires chrome >= 43)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(function(){ | |
// Override function in given prototype to add a log statement | |
function logMethod(prototype, fname) { | |
if (!(fname in prototype)) { | |
console.warn("Warning: can't instrument " + prototype.constructor.name + '.' + fname); | |
return; | |
} | |
var original = prototype[fname]; | |
prototype[fname] = function() { | |
// Want single line output but with optional callstack - abuse 'error' for this. | |
// console.trace is also good but expands the callstack by default.' | |
console.error(prototype.constructor.name + '::' + fname + ' invoked with ' + JSON.stringify(Array.prototype.slice.call(arguments))); | |
// debugger; | |
original.apply(this, arguments); | |
}; | |
} | |
// Override property setter to add a log statement | |
function logSetter(prototype, property) { | |
var original = Object.getOwnPropertyDescriptor(prototype, property); | |
if (!original) { | |
console.warn("Warning: can't instrument " + prototype.constructor.name + '.' + property + | |
'. Chrome 43+ required (http://crbug.com/43394)'); | |
return; | |
} | |
Object.defineProperty(prototype, property, { | |
set: function(v) { | |
var changed = v !== this[property]; | |
console.error(prototype.constructor.name + '::' + property + ' set to:' + v + (changed?' (changed)':' (not changed)')); | |
// debugger; | |
if ('set' in original) | |
original.set.call(this, v); | |
else | |
original.value = v; | |
}, | |
get: function() { | |
return 'get' in original ? original.get.call(this) : original.value; | |
} | |
}); | |
} | |
for (var m of ['scrollBy', 'scrollTo', 'scroll']) | |
logMethod(window, m); | |
// Firefox only | |
for (var m of ['scrollByLines', 'scrollByPages']) | |
if (m in window) | |
logMethod(window, m); | |
for (var p of ['scrollX', 'scrollY']) | |
logSetter(window, p); | |
for (var m of ['scrollIntoView', 'scrollIntoViewIfNeeded', 'focus']) | |
logMethod(Element.prototype, m); | |
for (var p of ['scrollTop', 'scrollLeft']) | |
logSetter(Element.prototype, p); | |
})(); |
I've made a handful of improvements / additions here: https://gist.github.com/RByers/688d8b0ca8d03e17053a. WDYT?
Great improvements. I was also making it work in Firefox too. I will add it to a git repo so that it is easier to pull in changes and keep updated.
Here it is: https://github.com/majido/scroll-utils/blob/master/detectProgrammaticScroll.js
I fixed scrollX, scrollY issue based on discussion on that bug.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Nice, very handy! But "Chrome version >= 44" should say ">= 43". See http://crbug.com/43394