Graph isn't displayed after PDF is generated.

[sharathm89]

The below screenshot shows graph rendered in browser.

The below 2 sample screenshots are from the PDF generated through code.

JS Code

Sending the pdfbuffer as an attachment in the mail

       const browser = await puppeteer.launch({
        args: ["--no-sandbox", "--disable-setuid-sandbox", "--disable-dev-shm-usage"],
        headless: "new",
    });

    try {
        const host = "http://localhost:3004";
        const path = `/mis-report`;
        const obj = ReportBuilder.browser(browser).remoteHost(host);

        await obj.report(path).pdf().build();

        return obj.result.get(path).pdf;
    } finally {
        await browser.close();
    }

If its returned to the browser directly even then it doesn't display the graph.

res.set({ "Content-Type": "application/pdf", "Content-Length": pdfBuffer.length });
return res.send(pdfBuffer);

[PejmanNik]

Can you please create a small repo/gist that helps me reproduce the issue?

[sharathm89]

@PejmanNik here is the github repo link

created node api-server and react report-app

you can refer to readme file to install and run the code.

Attaching the screenshots from above code.

React Website

API Response

[sharathm89]

@PejmanNik tried below code as well but the results are same. From existing repo you can run make pdf from api-server folder to test it.

const puppeteer = require("puppeteer");
const { ReportBuilder } = require("@jikji/generator");

async function build() {
    const browser = await puppeteer.launch({
        args: ["--no-sandbox", "--disable-setuid-sandbox", "--disable-dev-shm-usage"],
        headless: "new",
    });

    try {
        await ReportBuilder.browser(browser)
            .remoteHost("http://localhost:8024")
            .report("/")
            .pdf({
                path: "./out.pdf",
            })
            .build();
    } finally {
        await browser.close();
    }
}

build();

[PejmanNik]

I think the issue is related to the graph transition, probably at the time of converting to PDF the bars are still hidden, try to disable this animation or use useLayoutSuspension to delay the print time.

[sharathm89]

Disabling animation works.. Thanks...