Link to test case:
https://eventshub.pro/wpc-summary/?package_key=fo1j

Debugger code (debug.datatables.net):
n/a

Error messages shown:
n/a

Description of problem:
I have multiple dataTables on one page and would like to use a single PDF button to export all the tables to a single document. I thought that extending the pdf button would work, however, I'm only getting the first page exported (the first page is the first table in the page). I can see from my console.log statements that the PDF is being generated before it loops over all the tables. I have the code set up as an async function and the html2canvas in the loop uses await, but, alas there is no waiting. Thoughts?

<script type="text/javascript">
jQuery(document).ready(function($) {
    $('table').DataTable( {
        dom: 'Bfrtip',
        buttons: [
            {
                extend: 'pdfHtml5',
                customize: async function ( doc ) {
                    const options = {
                      pagesplit: true
                    };
                    const ids = document.querySelectorAll('table');
                    const length = ids.length;

                    for (let i = 0; i < length; i++) { 
                        const page = document.getElementById(ids[i].id);
console.log("here");
                        /* execute this function then exit loop */
                        await html2canvas(page, options).then(function (canvas) { 
                            doc.content.push({
                                image: canvas.toDataURL('image/png'),
                                margin: [0, 0, 0, 12]
                            });
console.log("adding");
                        });
                    };
                }
            }
        ]
    } );
} );
</script>