Too many canvases for page in some pdfs

Bug Reports
1

Hi there,

I’m using this repo (with the libraries form package.json) to show you my odd behaviour with pdf file. Tested on Chrome and Firefox on Linux and Windows.

BTW, I tried to upgrade library to 8.7.4 in this repo to the newset version, but I get an error on console:
image
and this error stays with my even if I back to 8.4.0 version (even if I remove node_modules and pdfjsexpress folders), until I clone repo again.

The problem is with some pdf-s created by merging two or more pdf-s with different sizes of pages. A sample is here:
merged.pdf (2.8 MB)
I run the application with provided file, zoom pdf to… quite big and the result is as follows:

image
image1627×929 122 KB

As you can see, there are 3 canvases in div:

image
and one of them is incorrect and it doesn’t fit to annotations. In my application the problem ocurres even for smaller zooms and in Fit to width mode. This pdf file is not the exception.
I cannot remove this third canvas (although, debugging showed that the first one is incorrect), because it would be never-ending task. But why does it render in DOM at all? Do you have any idea?

Thanks,
Dorota

3

Hello dorota.k,

Thank you, the upgrading issue is possibly two issues:

  1. The cache is storing the broken version
  2. WebViewer pointing to the broken version’s files in the /public/pdfjsexpress/core folder

regarding the canvas issue, can you try:

documentViewer.recalculateLayout(
Array.from({length: instance.Core.documentViewer.getPageCount()}, (_, i) => i + 1)
)

This will recalculate the page layout in documentViewer

best regards,
Tyler

4

Hi Tyler,

Thank you for tips.

Concerning canvas - have you tried the solution with provided pdf and the repository I’ve mentioned previously? It doesn’t work for me in any combination. I tried refreshAll or refreshPage - the third canvas disappears then, but after using recalculateLayout it appears again. Ok, why can’t I use refreshAll then? In my real application, when I use e.g. refreshAll, the third canvas appears again on scroll. Also, I’ve noticed, that in this “strange mode” of three canvases it’s impossible to mark annotation correctly - distance between cursor and annotation on pdf equals several centimeters. Definitely there is something wrong in this special case. Do you have another solution?

Regarding cache issue - I made a deeper investigation. In the package.json file in your repo there is ^8.4.0 version of your library and it makes an error (8.7.4 does the same). If I install exact 8.4.0, the error disappears and there is something like that: window.instance&&window.instance.addSearchListener in PDFJSDocumentType.js. This condition at the beginning causes no error. Some cache in later version? I can’t exclude it, although I remove node_modules and /public/pdfjsexpress again and again, I try with yarn and cache cleaning and nothing helps at all.

Best regards,
Dorota