Small Feature Request: Full Page View &/ Chrome Headless

[yamenzk]

Hello! Really love the latest work on the designer, thank you so much for the constant improvement. While the designer now is almost WYSIWYG, it still gets a little buggy sometimes specially with page margins, font rendering and style cohesiveness across PDF & Prints.

I found out that rendering with Chrome Headless (for Frappe Cloud version, check my fork) solves 90% of all rendering and printing issues, and maintains the same layout, structure and styling on prints and PDF.

Chrome Headless also opens for endless possibilities, for example, I can @import my own fonts, or run Javascript code before printing to apply some dynamic changes, and much more... The best part, they will still render as good on prints & PDF (Given that the codes were passed as a Jinja HTML Block from the Custom Data section of the designer)

The only part that might be problematic for the designer (I haven't tested yet) is how headers, footers and page numbers render through Chrome Headless because I assume it needs puppeteer/pyppeteer.

I'm not sure if it's feasible to rework the designer to render through Chrome Headless instead of wkhtmltopdf but a hybrid option can be helpful.

If this.full_page_btn.hide() can be removed from print.js the user can benefit from browser printing which works perfectly with the HTML generated and rendered by the designer (and then can print to pdf). We can also have select boxes for every print format to choose which engine renders the print and which engine renders the PDF.

Example: using 'Poppins' from Google Fonts

View from Print Designer Preview / Print / PDF

View from Web (Full Page) / Print & Chrome Headless Generated PDF

[maharshivpatel]

@yamenzk header footer is the reason i haven't used chrome headless or puppeteer. i had considered it in the past but header footer is restricted in it.

[maharshivpatel]

@yamenzk browser rendering will not have repeated and or different header / footer