jpablobr / simple-auto-scroll

A speed-customizable auto-scroll Google Chrome extension.
84 stars 30 forks source link

One site not scrolling #17

Open dancinbutterfly opened 5 years ago

dancinbutterfly commented 5 years ago

I've got an issue you on the Chrome extension not scrolling on just one site. I know that Google-related sites do not work but I've been trying to use it on archiveofourown.org which is on independently operated servers using open-source code and all of sudden this extension no longer works on it. However, this still works on various other sites. What should I be looking for in terms of why it isn't working for me? I am very much a beginner when it comes to code so I'm not sure where to start.

wejesuss commented 4 years ago

I know that your comment is very old, but I'd been testing this site now and I obtained a good result with this extension, maybe it is a problem with your chrome.

campbellgoe commented 3 years ago

It looks like in https://github.com/jpablobr/simple-auto-scroll/blob/master/js/background.js

function upurl(id){
  chrome.tabs.executeScript({
    code: `document.documentElement.scrollTop+=1;`
  });
}

The scrolling is achieved by incrementing document scrollTop. Perhaps a more general solution would be to querySelect the top most element which has 'overflow: auto' or 'overflow: scroll' instead of just the document. You could also try out window.scrollBy(0, 1) which might automatically detect the top most scroll container (I'm not sure).

campbellgoe commented 3 years ago

OK so selecting overflow css is harder than it seems, so this just brute forces a way to find the largest element on the page by height that has overflow / overflowY as scroll or auto. I only tested it on Gmail where it worked. So, you could try this.

const overflowElements = Array.from(document.querySelectorAll('*')).filter(a => {
    const styles = getComputedStyle(a);
    const overflowProps = ['overflowY', 'overflow']
    const overflowValues = ['scroll', 'auto']
    return overflowProps.some((prop) => overflowValues.includes(styles[prop]))
});
const scrollableEl = overflowElements.reduce(([largest,el],b) => {
  const height = b.getBoundingClientRect().height
  return height > largest ? [height, b] : [largest, el]
},[-Infinity, null])[1]

scrollableEl.scrollTop += 1

That doesn't work on other sites though, where document.documentElement.scrollTop+=1; does, so need a bit more logic to get both working in tandem.