Merge branch 'main' of github.com-frappet:Frappet/report-server-ts

test-run/lazy-load-puppeteer.ts

@@ -0,0 +1,91 @@
+import puppeteer, { Browser, PDFOptions } from 'puppeteer'
+function wait(ms: number) {
+    return new Promise(resolve => setTimeout(resolve, ms));
+}
+
+export default async function capture(browser: Browser, url: string) {
+    // Load the specified page
+    const page = await browser.newPage();
+    // if(!page) return
+    await page.goto(url, { waitUntil: 'load' });
+
+    /*
+    //force load page
+    for(let i=0; i< 50;i++){
+        await page.evaluate(_viewportHeight => {
+            window.scrollBy(0, _viewportHeight);
+        }, 1000);
+        await wait(500);
+    }*/
+
+    //force load page and find page height
+    const totalHeight = await page.evaluate(async (_viewportHeight, _ms, _loop) => {
+        const querySelector = ".scrollbar-view"
+        //const querySelector = "body"
+        let scrollableSection = document.querySelector(querySelector) ?? window
+        for (let i = 0; i < _loop; i++) {
+            scrollableSection.scrollBy(0, _viewportHeight);
+            await new Promise(resolve => setTimeout(resolve, 500));
+        }
+        return document.body.scrollHeight
+    }, 1000, 2000, 50);
+
+    // Get the height of the rendered page
+    const bodyHandle = await page.$('body');
+    if (!bodyHandle) return
+    const boundingBox = await bodyHandle.boundingBox();
+    if (!boundingBox) return
+    const { height } = boundingBox;
+    await bodyHandle.dispose();
+    console.log("height", height)
+    // Scroll one viewport at a time, pausing to let content load
+    const viewportHeight = page.viewport()?.height;
+    if (!viewportHeight) return
+    let viewportIncr = 0;
+
+
+    /*    
+        while (viewportIncr + viewportHeight < boundingBox.height) {
+            await page.evaluate(_viewportHeight => {
+                window.scrollBy(0, _viewportHeight);
+            }, viewportHeight);
+            await wait(300);
+            viewportIncr = viewportIncr + viewportHeight;
+        }
+    */
+    // Scroll back to top
+    await page.evaluate(() => {
+        window.scrollTo(0, 0);
+    });
+
+    // Some extra delay to let images load
+    await wait(100);
+
+    // return await page.screenshot({ path: '.output/url_pup.png',type: 'png',fullPage: true });
+    let pdfOption: PDFOptions = {
+        path: '.output/url_prop.pdf',
+        format: "A4",
+        width: 1200,
+        height: totalHeight,
+        printBackground: true,
+        scale: 1,
+        displayHeaderFooter: false,
+        margin: { top: 5, right: 5, bottom: 5, left: 5 }
+    }
+    const buffer = await page.pdf(pdfOption);
+    return buffer
+
+
+
+}
+
+(async () => {
+    const browser = await puppeteer.launch({
+        // executablePath: '/usr/bin/chromium',
+        headless: true,
+        //args: ['--no-sandbox', '--disable-setuid-sandbox', '--disable-gpu']
+    });
+
+    await capture(browser, "https://bma-dashboard.frappet.synology.me/d/ANtkJay4z/4Lic4Li54LmJ4Lie4Li04LiB4Liy4Lij?orgId=1&kiosk")
+    await browser.close();
+})();