JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://raw.github.com/djozsef/jquery.printarea.js/master/jquery.printarea.js"></script>
<script src="https://raw.github.com/MrRio/jsPDF/master/jspdf.js"></script>
<script src="https://raw.github.com/MrRio/jsPDF/master/dist/jspdf.min.js"></script>
<div id="test">
    <h1>Mon article</h1>
    <p>Bla bla bla bla</p>
    <TABLE BORDER="1" id="table"> 
        <CAPTION> Voici le titre du tableau </CAPTION> 
        <TR> 
            <TH> Titre A1 </TH> 
            <TH bgcolor="cyan"> Titre A2 </TH> 
            <TH> Titre A3 </TH> 
            <TH> Titre A4 </TH> 
        </TR> 
        <TR> 
            <TH> Titre B1 </TH> 
            <TD> Valeur B2 </TD> 
            <TD> Valeur B3 </TD> 
            <TD> Valeur B4 </TD> 
        </TR> 
    </TABLE>
</div>
<div id="editor"></div>

<button onclick="javascript:window.print()">Imprimer</button>
<button id="cmd">Générer PDF</button>
<button id="btntest">Test printAera</button>

CSS

td {
	background-color: yellow;
}

JavaScript

$(function(){
    var doc = new jsPDF();
    var specialElementHandlers = {
        '#editor': function (element, renderer) {
            return true;
        }
    };
    
    $('#cmd').click(function () {
        doc.fromHTML($('#test').html(), 15, 15, {
            'width': 170, 'elementHandlers': specialElementHandlers
        });
        doc.save('sample-file.pdf');
    });
            
$("#btntest").click(function(){
        $("#test").printArea( {mode: "popup", popClose: false, retainAttr : "style"} );
    });
    
});