Google chrome devtools 如何在scrollTop更改时中断?

Google chrome devtools 如何在scrollTop更改时中断?,google-chrome-devtools,breakpoints,Google Chrome Devtools,Breakpoints,我网站上的一个js导致不必要的滚动到页面顶部。当js正在更改scrollTop属性时,如何在Chrome开发者工具中取得突破?粘贴下面的代码,然后运行垂直滚动(function(){debugger}) 请注意,只有通过JavaScript显式设置滚动位置时,才会暂停。例如,如果一个大元素暂时从页面中消失并导致视口跳转,则不会触发该事件 function onVerticalScroll(fnOnScroll){ var originalScrollTop = getPropertyDe

我网站上的一个js导致不必要的滚动到页面顶部。当js正在更改scrollTop属性时,如何在Chrome开发者工具中取得突破?

粘贴下面的代码,然后运行垂直滚动(function(){debugger})

请注意,只有通过JavaScript显式设置滚动位置时,才会暂停。例如,如果一个大元素暂时从页面中消失并导致视口跳转,则不会触发该事件

function onVerticalScroll(fnOnScroll){
    var originalScrollTop = getPropertyDescriptor(HTMLElement.prototype, "scrollTop");
    Object.defineProperty(HTMLElement.prototype, "scrollTop", {
        get: function(){
            return originalScrollTop.get.apply(this, arguments);    
        },
        set: function(){
            fnOnScroll();
            return originalScrollTop.set.apply(this, arguments);
        }
    });

    var originalScrollTo = window.scrollTo;
    window.scrollTo = function(){
        fnOnScroll();
        return originalScrollTo.apply(this, arguments);
    }
    var originalScrollBy = window.scrollBy;
    window.scrollBy = function(){
        fnOnScroll();
        return originalScrollBy.apply(this, arguments);
    }

    function getPropertyDescriptor(object, propertyName){
        var descriptor = Object.getOwnPropertyDescriptor(object, propertyName);
        if (!object){
            throw new Error("descriptor not found");
        }
        if (!descriptor) {
            return getPropertyDescriptor(Object.getPrototypeOf(object), propertyName);
        }
        return descriptor;
    }
}

不幸的是,这在Safari上似乎不起作用:(