Add scroll to capture lazy loaded elements

Author: pinanks

package.json

@@ -37,6 +37,7 @@
     "fastify": "^4.24.3",
     "form-data": "^4.0.0",
     "listr2": "^7.0.1",
+    "scroll-to-bottomjs": "^1.1.0",
     "tsup": "^7.2.0",
     "which": "^4.0.0",
     "winston": "^3.10.0"

pnpm-lock.yaml

@@ -1,6 +1,7 @@
 import { chromium, firefox, webkit, Browser } from "@playwright/test"
 import { Context, WebStaticConfig } from "../types.js"
 import { delDir, ensureHttps } from "./utils.js"
+import scrollToBottom from 'scroll-to-bottomjs'
 
 const BROWSER_CHROME = 'chrome';
 const BROWSER_SAFARI = 'safari';
@@ -52,13 +53,15 @@ export async function captureScreenshots(ctx: Context, screenshots: WebStaticCon
                     screenshot.url = ensureHttps(screenshot.url)
                 }
                 await page.goto(screenshot.url, pageOptions);
-                await page.waitForTimeout(screenshot.waitForTimeout || 0)
+                
 
                 for (let k = 0; k < totalViewports; k++) {
                     let { width, height } = ctx.webConfig.viewports[k];
                     let ssName = `${browserName}-${width}x${height}-${screenshotId}.png`
                     let ssPath = `screenshots/${screenshotId}/${ssName}.png`
                     await page.setViewportSize({ width, height: height || MIN_RESOLUTION_HEIGHT })
+                    if (height === 0) await page.evaluate(scrollToBottom)
+                    await page.waitForTimeout(screenshot.waitForTimeout || 0)
                     await page.screenshot({ path: ssPath, fullPage: height ? false: true });
 
                     let completed = (i == (totalBrowsers-1) && j == (totalScreenshots-1) && k == (totalViewports-1)) ? true : false;