puppeteer: динамическая страница с использованием indexeddb не загружается

Question

Я пытаюсь сделать снимок экрана со страницей, которая использует indexeddb для генерации некоторого ее содержимого.

Мой код кукловода довольно прост:

(async() => {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    await page.setViewport({
        width: 1200,
        height: 1080
    });
    const relevantSite = 'http://example.com'; // <<-- replace this with the actual site
    await page.goto(relevantSite);
    await page.waitForSelector('#myContentSelector');
    console.log('Content is now loaded');
    await page.screenshot({path: 'dynamic-screenshot.png'});
    await browser.close();
})();

Приведенный выше код отлично работает для страниц, которые динамически генерируют контент, и НЕ использует indexeddb , но для страниц, которые это делают, я просто не могу понять, что мне нужно сделать, чтобы получить страница для загрузки правильно.

Должен ли я сделать что-то особенное, чтобы заставить indexeddb работать на страницах без головы, загруженных в кукловод?

Answer 1

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

await page.goto(relevantSite, { waitUntil: 'networkidle2' });
const navigationPromise = page.waitForNavigation();
await page.waitForSelector('#myContentSelector');
console.log('Content is now loaded');
await page.screenshot({path: 'dynamic-screenshot.png'});
await navigationPromise;

Использование параметров waitUntil для page.goto и с page.waitForNavigation

Answer 2

IndexedDB, кажется, прекрасно работает с кукловодом. Пример.

Я подозреваю, что ваша проблема на самом деле в том, что вы не даете странице время для загрузки и для заполнения контента.

await page.waitForSelector('#myContentSelector');

Является ли #myContentSelector чем-то вроде контейнера div, где фактическое содержимое заполняется позже (даже через 25 мс)

Попробуйте подождать секунду после загрузки страницы, прежде чем сделать снимок экрана?