CODEWITHSUNDEEP
javascriptnode.jspdfpuppeteer
Nithin
Nithin

Reputation: 1477

Full page PDF in Puppeteer

I am trying to get a full page PDF using puppeteer and my code is like this, But the resultant is multiple pages with the height equal to that of the page.

How do i resolve this? TIA.

const puppeteer = require("puppeteer");

function sleep(ms) {
    return new Promise(resolve => {
        setTimeout(resolve, ms);
    });
}

(async () => {
    const browser = await puppeteer.launch({
        headless: true
    });

    const page = await browser.newPage();

    await page.goto("http://localhost:3000/longpage", {
        waitUntil: "networkidle2"
    });

    let height = await page.evaluate(
        () => document.documentElement.offsetHeight
    );

    console.log("Height", height);

    await page.pdf({
        path: "hni.pdf",
        printBackground: true,
        margin: "none",
        height: height + "px"
    });

    await browser.close();
})();

Upvotes: 5

Views: 18220

Answers (1)

Thomas Dondorf
Thomas Dondorf

Reputation: 25280

The page you linked uses Bootstrap, which has the following rule in its set (you can find it here):

@page{size:a3}

This will limit the height of the page to the size of a3.

You can either remove the rule (or Bootstrap altogether) from the website or add the following code before calling page.pdf:

await page.addStyleTag({
    content: '@page { size: auto; }',
})

Upvotes: 11

Related Questions