JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.4.1/jspdf.debug.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Export PDF</title>
</head>

<body>
    <div id="a4" style="height: 297mm; width: 210mm; border: 1px black solid; margin-left:20%;">
       Content
    </div>
    <button id="pdfExport" onclick="javascript:demoFromHTML();">Export PDF</button>
</body>
</html>

CSS

#a4{width: 100%;background: #ffffff;color: #000000;}

JavaScript

function demoFromHTML() {
            html2canvas(document.getElementById('a4'), {
                onrendered: function (canvasObj) {
                    var pdf = new jsPDF('P', 'pt', 'a4'),
                        pdfConf = {
                            pagesplit: false,
                            backgroundColor: '#FFF'
                        };
                    document.body.appendChild(canvasObj); //appendChild is required for html to add page in pdf
                    pdf.addHTML(canvasObj, 0, 0, pdfConf, function () {
                        document.body.removeChild(canvasObj);
                        //pdf.addPage();
                        pdf.save('Test.pdf');
                    });
                }
            });
        }