How can I use jsPDF to render multiple pagination results (HTML to PDF)

I'm trying to print the result of multiple jsPDF.HTML(...). Each one of them runs in a different pagination of a list inside the same div. The PDF conversion of that div displays the first page multiple times even though I can see the items inside it changing in the UI before executing each jsPDF.HTML(...).

Is there a solution for this or at least an explanation of why it is happening?

async printReceipt() {
console.log('getting the number of pages in the pagination');
var lenArr = new Array(Math.ceil(this.receiptItems.length / 10));
var doc = new jsPDF('p', 'pt', [496, 702]);
var arrayBuffer: ArrayBuffer[] = [];
var fileURL;
console.log('creatting main doc');
for (let index = 0; index < lenArr.length; index++) {
console.log('Changing pagination to:', index + 1);
this.page = index + 1;
console.log('Converting page:', index + 1);
await new Promise<void>(async (resolve, reject) => {
doc.html(document.getElementById('receipt'), {
callback: async (res) => {
console.log('Adding page to buffer, page:', index + 1);
arrayBuffer.push(res.output('arraybuffer'));
if (lenArr.length - 1 == index) {
console.log('Printing');
await this.mergePdfs(arrayBuffer);
}
resolve();
},
});
});
}
}


logs order:



Continue reading...