Chrome DevTools: setting a breakpoint on document scroll change?

The way I use it to override/proxy the scroll functions and set a debugger in the new function.

I run the following snippet in the console, with the hope one of the scroll functions will be called:

const proxyFn = fnName => {
  const oldFn = window[fnName];
  window[fnName] = (...args) => {
    debugger;
    oldFn(...args)
  }
}

Object.keys(window).filter(c => c.includes("scroll")).forEach(c => proxyFn(c))
// or, if you want to "catch" the "scrollTo" function
proxyFn("scrollTo")

You can use a JavaScript event listener breakpoint. In the sources tab for Chrome developer tools, locate the "Event Listener Breakpoints" and then the "scroll" breakpoint is located under "Control".

How to add event breakpoint