'Dynamic API is not calling on a scroll in puppeteer
I am trying to take a screenshot of a page in which images are dynamically loading on scroll. Using puppeteer on a scroll, image API is not calling. So all images are not loading for a page. I am using below code. Please help for this.
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch({
headless: false
});
const page = await browser.newPage();
await page.goto('https://www.chapters.indigo.ca/en-ca/new-arrivals/?link-usage=Header%3A%20New&mc=NewArrivals&lu=Main/', { waitUntil: 'load' });
await page.setViewport({
width: 1200,
height: 800
});
await autoScroll(page);
await page.screenshot({
path: 'yoursite.png',
fullPage: true
});
await browser.close();
})();
async function autoScroll(page) {
await page.evaluate(async () => {
await new Promise((resolve, reject) => {
var totalHeight = 0;
var distance = 100;
var timer = setInterval(() => {
var scrollHeight = document.body.scrollHeight;
window.scrollBy(0, distance);
totalHeight += distance;
if (totalHeight >= scrollHeight) {
clearInterval(timer);
resolve();
}
}, 100);
});
});
}
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
