I'm using Headless Chrome to print out PDF files by using the printToPDF CDP method. If the document has a large number of pages, then if I print the PDF file actually out, or print out to another PDF file, then the quality of pages get worse, as the number of pages increase.
Why is this happening, and how could I fix this?
I'm using Google Chrome 69.0 in headless mode, on Win10, with Node.js v8.11.3.
For example, we would like to print out the following HTML content, without any extra printToPDF settings.
<div class="lorem">
1) Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur aliquet sem sed neque faucibus dignissim. Sed congue sodales ex, vel bibendum dolor placerat vel. Curabitur ultricies luctus dui, a accumsan purus placerat a. Nullam ut lectus ultricies, mattis enim non, rutrum erat. Nulla sodales tellus in bibendum vehicula. Aenean aliquam tellus eu magna semper rutrum. Donec ultrices vestibulum varius. Suspendisse posuere arcu augue, at varius odio dignissim nec. Vestibulum nec orci faucibus, commodo ante vitae, porta mi. Nunc non efficitur mauris. Vestibulum quis sapien nisl. Duis quam odio, faucibus at posuere eget, egestas nec augue. Aliquam finibus felis felis, ut tincidunt erat gravida pretium.<br><br>
2) Ut nec consectetur neque. Ut ornare tristique libero in vehicula. Quisque eget finibus est. Phasellus id enim lacus. Integer vestibulum nisi nec leo lacinia fermentum. Mauris mattis posuere massa, in mattis ligula molestie sed. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse imperdiet, urna eu tincidunt viverra, ipsum ligula placerat erat, at pulvinar nunc sapien et risus. Aenean pharetra pharetra libero ut euismod. Etiam sit amet tellus rutrum ante lobortis suscipit suscipit sit amet leo. Fusce id ipsum orci. Nulla suscipit malesuada massa. Vestibulum vitae vehicula diam.
</div>
If we print out the PDF file with a printer, then the quality is good. The following sceenshot shows the result:
Now add the following <div>
just after the <body>
tag, before the #lorem <div>
:
<div style="height: 1999900vh; margin: 0; padding: 0; border: 0; display: block;"></div>
This makes 19999 empty pages before the #lorem <div>
. Now print out the file with the 'pageRanges': '20000-'
setting. If we open the PDF file, it looks fine, but when we print it out from an Adobe Reader, for example with a Foxit Reader PDF Printer, then it looks very poor:
I've tried to add --disable-accelerated-2d-canvas
flag to improve quality, but it didn't help. I've also tried to add --use-system-default-printer
flag and print out PDF files with Foxit, but it didn't work. It would be important to me, to print exactly rendered pages, regardless where they are in the actual layout. I also don't understand why is this happening.
I've expected that the pages have the same quality, regardless where they are in the document.
When I open the PDF file in Adobe Reader or Foxit Reader, then it looks good. When I print out from Adobe Reader with a printer or with Foxit to another PDF file, then the quality is very poor.
Any ideas are welcome to resolve this issue.