Await the proxied onProgress inside the worker

Author: carlobeltrame

pdf/src/PdfComponent.js

@@ -8,14 +8,14 @@ export default {
     totalContents: { type: Number, default: 0 },
     type: { type: String, default: '' },
   },
-  beforeCreate() {
+  async beforeCreate() {
     Object.entries(this.$options?.pdfStyle || []).forEach(([selector, rules]) => {
       styleStore[selector] = styleStore[selector] || {}
       Object.assign(styleStore[selector], rules)
     })
 
     if (this.index !== -1) {
-      this.$onProgress('assembleContent', {
+      await this.$onProgress('assembleContent', {
         content: this.index + 1,
         totalContents: this.totalContents,
         type: this.$tc(`print.${camelCase(this.type)}.title`),

pdf/src/renderer/reactPdfRenderer.js

@@ -8,14 +8,14 @@ const fontStore = new FontStore()
 export async function renderPdfStructureToReactPdf(
   pdfStructure,
   compress = true,
-  onProgress = () => {}
+  onProgress = async () => {}
 ) {
   await onProgress('layoutDocument')
 
   let page = 0
-  addEventListener('layoutPage', () => {
+  addEventListener('layoutPage', async () => {
     page++
-    onProgress('layoutPage', { page })
+    await onProgress('layoutPage', { page })
   })
 
   const layout = await layoutDocument(pdfStructure, fontStore)
@@ -37,9 +37,9 @@ export async function renderPdfStructureToReactPdf(
     pageMode,
   })
 
-  ctx.on('pageAdded', () => {
+  ctx.on('pageAdded', async () => {
     page++
-    onProgress('renderingPdfPage', { page, totalPages })
+    await onProgress('renderingPdfPage', { page, totalPages })
   })
 
   return renderPDF(ctx, layout)

pdf/src/renderer/vueRenderer.js

@@ -3,7 +3,7 @@ import { nodeOps } from './nodeOps.js'
 // eslint-disable-next-line vue/prefer-import-from-vue
 import { createRenderer } from '@vue/runtime-core'
 
-export function renderVueToPdfStructure(root, props = {}, onProgress = () => {}) {
+export function renderVueToPdfStructure(root, props = {}, onProgress = async () => {}) {
   // We need a "root container" (normally the <div id="app"> DOM element).
   // Vue uses this to keep track of which running Vue app this is.
   const container = {}