Прокрутите до нижних решений, не всегда переходя на абсолютный конец страницы

Question

сценарий

Я собираю комментарии со страницы видео на YouTube с помощью Puppeteer. Вызов ajax для получения большего количества комментариев вызывается, когда мы прокручиваемся до абсолютной нижней части страницы, поэтому мне нужно прокрутить до нижней части.

проблема

Проблема в том, что я не могу; даже если я применяю прокрутку к нижнему решению, он иногда не прокручивается до конца страницы, это означает, что он переходит к низу, но не к абсолютному дну, оставляя некоторый пробел ниже, из-за которого не вызывается вызов ajax

решения, которые я пробовал

1. функция page.scroll () puppteer [ошибка].
2. document.querySelector('body').scrollIntoView({block: "end"}) [не работает на страницах YouTube, работает только на некоторых веб-сайтах]
3. document.scrollingElement.scrollTop =(document.scrollingElement.scrollHeight) [временами не доходят до абсолютного дна]
4. document.scrollingElement.scrollTop =(document.scrollingElement.scrollHeight) + 999999 [то же, что и выше]
5. window.scrollBy() & window.scrollTo()

Могло быть одно или несколько решений JS, которые я пробовал и не смог решить проблему.

PS, так как я работаю над кукольником, совместимость браузера с другими браузерами, такими как firefox или IE, не требуется, я полагаю

Answer 1

Вот что я сделал

Когда вы сначала загружаете страницу видео на YouTube и прокручиваете вниз, первое, с чем вы сталкиваетесь (и последний элемент в данный момент), это поле для комментариев с селектором ytd-comments#comments, а затем, когда начинается загрузка комментариев, элемент последнего комментария с селектор ytd-comment-thread-renderer.style-scope.ytd-item-section-renderer - это последний элемент на странице (на данный момент).

Таким образом, вместо прокрутки страницы (и получения подсказки из комментария @mplungjan) я прокрутил до этих элементов этот код

var flag_a =0, flag_b=0;

const COMMENTS_SCROLL_SELECTORS ={
    COMMENT_BOX: 'ytd-comments#comments',
    COMMENT_LAST: 'ytd-comment-thread-renderer.style-scope.ytd-item-section-renderer'
}

page.on('response', response => {
    if (<the url which brings comment>){
        ++flag_b;
    }
});

setInterval(() => {
    scrollToBottom();
}, 5000);


async function scrollToBottom(){
    if(flag_a == flag_b){
        await page.evaluate((COMMENTS_SCROLL_SELECTORS) => {
            var ele = document.querySelector(COMMENTS_SCROLL_SELECTORS.COMMENT_LAST);

            if(ele){
                //first scroll already performed, so perform subsequent scrolls
                var length = document.querySelectorAll(COMMENTS_SCROLL_SELECTORS.COMMENT_LAST).length;
                ele = document.querySelectorAll(COMMENTS_SCROLL_SELECTORS.COMMENT_LAST)[length - 1];
                ele.scrollIntoView();
            }else{
                //perform first scroll
                ele = document.querySelector(COMMENTS_SCROLL_SELECTORS.COMMENT_BOX);
                ele.scrollIntoView();
            }

        }, COMMENTS_SCROLL_SELECTORS);

        ++flag_a;
    }else{
        process.exit()
    }
}

Answer 2

Попробуйте выполнить следующее:

let previousHeight;
while (true) {
  try {
    previousHeight = await page.evaluate('document.body.scrollHeight')
    await page.evaluate('window.scrollTo(0, document.body.scrollHeight)')
    await page.waitForFunction(`document.body.scrollHeight > ${previousHeight}`)
    // .....
    // Something
    // .....
  } catch (e) {
    console.log('Scroll End Page')
    break
  }
}