Scroll the people list in Facebook list doesn't work when mouse cursor is not on scrolling bar

Question

I would like to scroll down, up to the maximum end of the scroll on https://www.facebook.com/friends/requests page, but I quite don't understand how it works here.

When I scroll by myself my cursor have to be in the area of people friendship request so the scroll bar is visible here if I scrolled down myself and scroll bar is visible I can use

var element = document.querySelector('.x1p6kkr5'); element.scrollIntoView(); in browser console to make it scroll down, but if I didn't scrolled down it myself completely it doesn't work. Case it doesn't work at all is when scroll bar is invisible here I receive this:

VM1363:1 Uncaught TypeError: Cannot read properties of null (reading 'scrollIntoView')
    at <anonymous>:1:60

I wonder how I can make it scroll down without me needing to hold mouse cursor on friends request tab and make it scroll without my assistance on first scroll?

Answer 1

If I understand correctly you want to scroll down to the bottom of the friends request section. You can try this thing in console:

Firstly try to Copy JS path instead of using 'x1p6kkr5' class to find element.

//element = document.querySelector("..."); Right click on html tag Copy>Copy JS PATH element.scrollTop = element.scrollHeight;Scrolls down to bottom of the view

Problem is that if You have too long of a list of friends list, it only scrolls down to the point of initial number of friends. After the rest of friend requests load in you would have to execute this line again, or you can make ovserver that listens to changes of element.scrollHeight, and executes "scrolldown" code on change.

const observer = new MutationObserver((mutationsList, observer) => {
const oldHeight = observer.oldHeight || 0;
const newHeight = element.scrollHeight;

if (newHeight !== oldHeight) {
    element.scrollTop = element.scrollHeight;
    observer.oldHeight = newHeight;
    }
});
observer.observe(element, { childList: true, subtree: true });
element.scrollTop = element.scrollHeight;

Keep in mind that you have to Copy JS Path again every time, because Facebooks seems to change class names on every reload.