I am using JsPDF along with HTML2Canvas to convert the HTML to PDF in my Angular 8 project. It was working perfectly fine until the new Chrome update came this week (87.0.xxxx.). The issue I noticed is, that the value in the Input filed(textbox/date picker/drop-down ) in HTML is not getting reflected into the generated PDF. This functionality is working fine with Chrome version 86.xxxx. Not sure if the issue is with Chrome or JSpdf or HTML2Canvas library
Any thoughts or help is much appreciated.
Below is the code snippet I'm using for this process.
var data = document.getElementById('myhtmlform');
var HTML_Width = $(".myhtmlform").width();
var HTML_Height = $(".myhtmlform").height() + 10;
var top_left_margin = 15;
var PDF_Width = HTML_Width + (top_left_margin * 2)
var PDF_Height = (PDF_Width * 1.5) + (top_left_margin * 2);
var canvas_image_width = HTML_Width;
var canvas_image_height = HTML_Height;
var totalPDFPages = Math.ceil(HTML_Height / PDF_Height) - 1;
var pdf = new jsPDF('p', 'pt', [PDF_Width, PDF_Height]);
html2canvas(data, { allowTaint: true }).then(canvas => {
canvas.getContext('2d');
var imgData = canvas.toDataURL("image/jpeg", 1.0);
pdf.addImage(imgData, 'JPG', top_left_margin, top_left_margin + 10, canvas_image_width, canvas_image_height);
pdf.setFillColor(255, 255, 255);
for (var i = 1; i <= totalPDFPages; i++) {
pdf.addPage(PDF_Width, PDF_Height);
pdf.addImage(imgData, 'JPG', top_left_margin, -(PDF_Height * i) + (top_left_margin * (2 * i + 1)), canvas_image_width, canvas_image_height);
pdf.setFillColor(255, 255, 255);
pdf.rect(0, 0, PDF_Width, top_left_margin, 'F');
pdf.rect(0, (PDF_Height - top_left_margin) - 15, PDF_Width, top_left_margin + 15, 'F');
}
var file = pdf.output('datauri');
}