vue-pdf icon indicating copy to clipboard operation
vue-pdf copied to clipboard

Weird problem with messageHandler

Open FAbrahamDev opened this issue 1 year ago • 1 comments

Hello everyone, maybe someone experienced this issue before or has a hint. I'm not sure if its a bug.

So i'm trying to use this pdf library in combination with @tanstack/vue-virtual to virtualize the pages. Which works fine so long until it doesn't and I get this error without

When I load the PDF, the PDFDocumentLoadingTask promise resolves but the pdf isn't rendered. It only happens on some PDFs and i cant pinpoint the difference between these pdf's.

The error that's on the initial load:

{
    "message": "Cannot read properties of null (reading 'getPage')",
    "name": "UnknownErrorException",
    "details": "TypeError: Cannot read properties of null (reading 'getPage')"
}

The error that occurs when scrolling and new VuePDF instances are loaded.

@tato30_vue-pdf.js?v=8f8ba6dc:12182 Uncaught TypeError: Cannot read properties of null (reading 'sendWithPromise')
    at WorkerTransport.getPage (@tato30_vue-pdf.js?v=8f8ba6dc:12182:41)
    at PDFDocumentProxy.getPage (@tato30_vue-pdf.js?v=8f8ba6dc:10978:28)
    at S (@tato30_vue-pdf.js?v=8f8ba6dc:20165:50)
    at Proxy.z (@tato30_vue-pdf.js?v=8f8ba6dc:20208:7)
    at reload (FileViewerNew.vue:90:34)
    at later (FileViewerNew.vue:103:34)

in this code:

getPage(pageNumber) {
        if (!Number.isInteger(pageNumber) || pageNumber <= 0 || pageNumber > this._numPages) {
            return Promise.reject(new Error("Invalid page request."));
        }
        const pageIndex = pageNumber - 1
          , cachedPromise = this.#pagePromises.get(pageIndex);
        if (cachedPromise) {
            return cachedPromise;
        }
        const promise = this.messageHandler.sendWithPromise("GetPage", {
            pageIndex
        }).then( (pageInfo) => {
            if (this.destroyed) {
                throw new Error("Transport destroyed");
            }
            if (pageInfo.refStr) {
                this.#pageRefCache.set(pageInfo.refStr, pageNumber);
            }
            const page = new PDFPageProxy(pageIndex,pageInfo,this,this._params.pdfBug);
            this.#pageCache.set(pageIndex, page);
            return page;
        }
        );
        this.#pagePromises.set(pageIndex, promise);
        return promise;
    }

Where the this.messageHandler is null for some reason. So it seems that the setupMessageHandler wasn't called, or the worker crashed or i don't know.

If someone could give me some hints how to debug, this would be awesome.

FAbrahamDev avatar Sep 23 '24 15:09 FAbrahamDev

I believe the problem occurs if the virtualizer unmounts a VuePDF component. Not sure how to fix that.

FAbrahamDev avatar Sep 24 '24 10:09 FAbrahamDev

Does @tanstack/vue-virtual use v-if to hide the component? Since 1.11.1 setting v-if to false will unmount the component and destroy the worker with it, that is probably the issue here. I will rollback this patch in the next version but if it is possible use v-show instead of v-if

TaTo30 avatar Oct 18 '24 03:10 TaTo30