I'm using jsPdf and HTML2canvas to download TinyMCE6 content as a PDF, but the PDF is always blank.
function generatePdf(content) {
console.log('Content is:', content)
const { jsPDF } = window.jspdf;
const doc = new jsPDF('p', 'mm', 'a4');
const container = document.createElement('div');
container.style.display = 'none';
document.body.appendChild(container);
container.innerHTML = content;
console.log('content as inner.html', content);
setTimeout(() => {
html2canvas(container).then(canvas => {
const imgData = canvas.toDataURL('image/jpeg', 1.0);
doc.addImage(imgData, 'JPEG', 10, 10, 190, 250);
doc.save('generatefile.pdf');
document.body.removeChild(container);
});
}, 500);
}
document.getElementById('generatePdfButton').addEventListener('click', function() {
const contentToSave = tinymce.get('myTextarea').getContent(); // Replace 'myTextarea' with your editor's ID
console.log('content to save', contentToSave);
generatePdf(contentToSave);
});
The debugging statements are:
content to save <p>HI</p>
htmleditor.html:47 Content is: <p>HI</p>
htmleditor.html:59 content as inner.html <p>HI</p>
However the PDF downloaded is blank. Even though I restarted browser, typed different content with images, the debugging statements are printed but PDF is always blank
I want my the content from my text editor to be saved as PDF with images and styles from the editor content