ngx-extended-pdf-viewer Error: Invalid Canvas Size after update to version 18.1.10

139 views Asked by At

I am running an Angular 15 application using ngx-extended-pdf-viewer, previously on version 16.2.16. I updated to 18.1.10 as I was encountering an unrelated bug, which the update fixed.

However, I am now encountering an error on some of the PDF documents that were working fine on 16.2.16. It's only a few of them but they are an important few. I have looked for a way to set, or set differently, the canvas size, but have not found one. I have played around with the zoom settings and even tried setting the PdfCompressionLevel to BelowNormal in the backend code. This did not help.

The PDFs are generated by my company's backend code and I can't post them (helpful, I know). It's a base64Src if that makes any difference. These are editable PDFs and they are rendering without any of the content, but when I change the zoom, I can briefly see the content before it all blanks out and the errors appear again.

viewer-3.10.552.min.js:44 renderView: "Error: Invalid canvas size"

and

An error occurred while rendering the page.

PDF.js v3.10.552 (build: 505fb2db1)
Message: Invalid canvas size
Stack: Error: Invalid canvas size
    at DOMCanvasFactory.create (http://localhost:4200/assets/viewer-3.10.552.min.js:23:98672)
    at CanvasGraphics.beginAnnotation (http://localhost:4200/assets/viewer-3.10.552.min.js:23:141685)
    at CanvasGraphics.executeOperatorList (http://localhost:4200/assets/viewer-3.10.552.min.js:23:120542)
    at InternalRenderTask._next (http://localhost:4200/assets/viewer-3.10.552.min.js:23:53900)
    at http://localhost:4200/assets/viewer-3.10.552.min.js:23:53727
    at timer (http://localhost:4200/polyfills.js:5522:41)
    at _ZoneDelegate.invokeTask (http://localhost:4200/polyfills.js:3523:31)
    at Zone.runTask (http://localhost:4200/polyfills.js:3295:47)
    at invokeTask (http://localhost:4200/polyfills.js:3604:34)
    at ZoneTask.invoke (http://localhost:4200/polyfills.js:3593:48)

Minimized HTML (I tried cutting it down to its most raw form just to eliminate any of the properties as the cause):

      <ngx-extended-pdf-viewer
        id="an-ngx-viewer"
        [base64Src]="document"
      ></ngx-extended-pdf-viewer>

Full HTML:

<ngx-extended-pdf-viewer
    id="an-ngx-viewer"
    [base64Src]="document"
    [ignoreKeys]="['R']"
    backgroundColor="#ffffff"
    [height]="isLaptop ? '67vh' : '71vh'"
    [useBrowserLocale]="true"
    [handTool]="false"
    [showHandToolButton]="true"
    [showOpenFileButton]="false"
    [showPrintButton]="false"
    [showPresentationModeButton]="false"
    [showRotateButton]="false"
    [showSecondaryToolbarButton]="false"           
    [filenameForDownload]="fileName"
    [zoom]="zoomSize"
    [showBookmarkButton]="false"
    (formDataChange)="updateForm()"
    (pageRendered)="delayedUpdateFormData()"
    (currentZoomFactor)="holdZoom($event)"
>
</ngx-extended-pdf-viewer>
0

There are 0 answers