mPDF version 7 Progress bar workaround

I upgraded mPDF to version 7 and I noticed that progress bar functionality was removed.

I'm looking for something simple: show some html information to the user (i.e. "Processing file...") while mPDF processes the output file.

This is a simplified version of the code and it is working properly:

$mpdf = new Mpdf();

$html_for_pdf = "<p>Hi, this is the html content to render the PDF file</p>";

$mpdf->WriteHTML( $html_for_pdf );
$mpdf->Output();

In order to get what I want, so far I tried:

a) Echo the "Processing file..." html info to screen, but (due to buffering I guess) nothing shows during the processing until the output PDF file finally comes up. The code I tried is this:

$mpdf = new Mpdf();

$html_for_pdf = "<p>Hi, this is the html content to render the PDF file</p>";

$html_processing = "<p>Processing file...</p>";
echo $html_processing;

$mpdf->WriteHTML( $html_for_pdf );
$mpdf->Output();

b) Handle the output buffering with ob_flush(), which shows the "Processing file..." html on screen but the mPDF file rendering breaks and the output file neves shows. The code I tried is this:

$mpdf = new Mpdf();

$html_for_pdf = "<p>Hi, this is the html content to render the PDF file</p>";

$html_processing = "<p>Processing file...</p>";
echo $html_processing;
ob_end_flush();
ob_flush();
flush();
ob_start();

$mpdf->WriteHTML( $html_for_pdf );
$mpdf->Output();

I googled a lot to get any kind of workaround for this without any luck.

Is there any chance to make this work?

Thanks!

Solution

Trying to do this during PDF generation in the same document does not make much sense.

Even the ProgressBar in mPDF 6.x updated the information with javascript.

The easiest way would be to process the HTML in a separate request with "Ajax". Any of options to send a request is possible, Fetch API, XMLHttpRequest, jQuery.ajax()…

You would then update content of the original HTML document with javascript:

On sending the request you would set "Processing file..." text,
On request completion you would either change this text to link to the generated PDF, or send the PDF to the user directly to download.

A simplified example using the Fetch API:

<script>
    
// this code would be executed on a link click or form submit
document.getElementById('status').innerText = 'Processing file...';
fetch('http://example.com/pdf.php')
  .then((response) => {
    // check response.ok
    document.getElementById('status').innerText = 'File processed';
    // handle contents of the document
  })
    
</script>