eKoopmans / html2pdf.js

Client-side HTML-to-PDF rendering using pure JS.
MIT License
4.12k stars 1.39k forks source link

html2pdf Blank Page issue - Chrome #518

Open suresh-ramasamy002 opened 2 years ago

suresh-ramasamy002 commented 2 years ago

Hi @eKoopmans, html2pdf fails to detects DOM elements and i was trying to download the pdf file and the pdf has only blank pages. This is happening on latest Chrome Version it seems but not on any other browsers. Please help me out with this

rajathegde98 commented 2 years ago

Try to remove the Grammarly extension, jsPdf has some issues while generating the PDF when using Grammarly.

danielgutin commented 2 years ago

Hi, @rajathegde98 any other solutions? I cant tell all of our customers to remove their chrome extensions.

rajathegde98 commented 2 years ago
//content is the angular child elem reference (if not, use **document.** methods to access div or class)
        html2canvas(content,{
          allowTaint:true,
          useCORS:true,
          scale:1
        }).then(canvas=>{
         // document.body.appendChild(canvas)
          var width = canvas.width;
          var height = canvas.height;
          var img = canvas.toDataURL("image/png")
          var doc = new jsPDF();
          doc.addImage(img,'PNG',0,0,600,200)
          doc.save()
        })

The above code looks fine. It's working for me, update the hardcoded values(width, height). I am using jsPDF and html2canvas instead. hope this helps you.

danielgutin commented 2 years ago

In the end, I took the following approach, removed the HTML tag that was injected by Grammarly & restored it after the creation of the PDF. image

rajathegde98 commented 2 years ago

@danielgutin thanks daniel, It's working for me but all the contents are present except images.