HtmlToPdfConverter - Last row in html table is cut of after page break

Hi Sven,

Thank you for contacting Syncfusion support.

We are unable to reproduce the reported issue on our end. However, we have attached the sample and output for your reference.

Sample:  https://www.syncfusion.com/downloads/support/directtrac/general/ze/HtmlToPDF_Blink-989594227

Output:  https://www.syncfusion.com/downloads/support/directtrac/general/ze/outputDoc-1439155469

Kindly try the sample and let us know the result. If still you are facing issues, we kindly request you to share the modified sample, complete code snippet, package name, package version, and environment details (OS, RAM, bit version and culture settings) to check this on our end. It will be helpful for us to analyze and assist you further on this.

Regards,

Karmegam

Hi Karmegam,

thank you very much.

I tested your solution and added my settings to it. The Project is attached. 
I could find the difference and the issue happens when you add the setting MediaType = MediaType.Print.

We use this setting because we want to show up the table header after a page break again. 

Is their a way to fix it?

Best 

Sven

Thank you for providing the sample project.

We are able to reproduce the reported issue on our end. Currently, we are validating this and will update further details on January 24th, 2024.

The reported issues still need a lot more in-depth research; thus we are looking into them. On January 25th, 2024, further information will be updated.

On our further validation, we have internally using Chrome headless browser for converting HTML to PDF in our Blink converter. It will preserve the PDF document like how the input HTML/URL is displayed in the Chromium-based web browsers (chrome, print preview).  The text cut-off issue occurs in the Chrome print preview itself with the provided input HTML file.

However, as a workaround, we have modified the input HTML file to adjust the table content and preserve the text properly. We have attached the output pdf, modified HTML, and sample for your reference,

Output: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Output_7218198295

Modified HTML: https://www.syncfusion.com/downloads/support/directtrac/general/ze/526-638410037208257144-154118628

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/pdf_test-30679404

Kindly try the provided sample and let us know the result.

Hey, 

thanks for the response, the clarification about the cause and the presented workaround! 

What exactly was the change you did to preserve the text in the table? We need to know what we have to modify in our code. Our customers create many files per day and we need a solution to implement in our html generation code. So when we have other html documents that they also look good on pdf.

Kind regards 

We have attached the modified content in HTML files screenshots for your reference. 

Please let us know if you need further assistance on this.

Hi,

thanks for the answer. Is there no other way as manipulating the html? Because this is very dynamic and every invoice look different.

Also your solution breaks the table header background, as you can see in the screen shot.

Best 

Sven

I now run the code with you updated html and compared it to the old one.

I do not see any improvement. The result is even worse.

Upon further analysis, the Blink rendering engine internally uses a chrome headless browser for converting HTML to PDF. It will preserve the PDF document like how the input HTML/URL is displayed in chromium-based web browsers (chrome, print preview). The same behavior was replicated in our converter.

The reported issue occurs from the Blink rendering engine itself. We have ensured this by setting the same margin in the Chrome print preview. We have attached a screenshot for your reference.

Please make the necessary changes to your input HTML according to your requirements and ensure it by using the Chrome print preview feature.

Ok, this means I need to open a Bug Ticket on the Google Blink Platform?

Actually we found the issue. There was an overflow: hidden set in our css.

Thanks for your help.

Best Sven

We are glad to hear that issue has been resolved on your end. please let us know if you need any other assistance.