Throwing AbortException when unmounting react-pdf components before PDF is finished rendering

[taylorbf]

What are you trying to achieve? Please describe.

I'd like to be able to unmount my PDF viewer component before the PDF is finished rendering, without having an unhandled promise exception.

Describe solutions you've tried

I have tried using the available onRenderError, onLoadError, etc props. I've also tried wrapping the component in an ErrorBoundary, however it does not catch this error.

Additional information

This is an unhandled promise exception from within PDF.js. I wonder if this exception could be handled within your library or if a prop could be exposed to handle this error. I imagine others have come across this error and I wonder how others have solved this.

When unmounting the <Document> and <Page> before it is finished rendering:

Uncaught (in promise) pdf.js:1153 
AbortException: {
  message: "Worker was terminated."
  name: "AbortException"
}

Using this worker: 'react-pdf/dist/esm/entry.webpack.js'

Environment

• Browser Chrome 85:
• React-PDF version 5.0.0:
• React version 16.10.2:
• Webpack version 4.41.0:

[dmanaster]

Did you ever figure out how to handle this? I am getting the same error.

[taylorbf]

I did not fix it. What I did, for a variety of reasons, was show the PDF one page at a time and I do not show the 'close' controls until the page is loaded.

[Darono87]

Have the same issue. Very annoying if you have some quite big pdf-s. Unhandled exception basically crashes the app so it's quite an issue when you want to implement some navigation :)

[kevinmamaqi]

I receive this error when I am opening several pages in a modal, for example, and I close it before all are loaded. Is there any way to lazyload on scroll?

[voidrender]

Has anyone come up with a non-blocking solution or workaround for this?

Edit: looks like this only happens in development mode for me. I don't have a crash on the app in production.

[LinusGeffarth]

Same issue here. No fix yet?
Also not happening in production for me though.

[landorid]

I have the same issue too.

[AmmarMohamadIsmaeel]

I did not find a solution for the problem, but luckily the crash is happening in the development mode only and not in the production :)

[zxlin]

@wojtekmaj This may be relevant https://github.com/mozilla/pdf.js/pull/12144/files

[TugboatTanner]

Still getting this error React PDF version 5.2.0. It's also happening in production for me.

[sokoloveugene]

I was able to skip this problem in react-pdf v5.2.0

Try the next steps.

• copy file from node_modules/pdfjs-dist/build/pdf.worker.js to public/pdf.worker.js
• import { Document, Page } from 'react-pdf';
• I did not set any options to "Document" component.

Check chrome dev tools/task manages. It should use worker from the public folder.

Here is a tutorial I found for react-pdf v4.1.0.
https://levelup.gitconnected.com/displaying-pdf-in-react-app-6e9d1fffa1a9

[TugboatTanner]

I was able to skip this problem in react-pdf v5.2.0

Try the next steps.

• copy file from node_modules/pdfjs-dist/build/pdf.worker.js to public/pdf.worker.js
• import { Document, Page } from 'react-pdf';
• I did not set any options to "Document" component.

Check chrome dev tools/task manages. It should use worker from the public folder.

Here is a tutorial I found for react-pdf v4.1.0.
https://levelup.gitconnected.com/displaying-pdf-in-react-app-6e9d1fffa1a9

I'll try this out. Thank you @sokoloveugene!

[zxlin]

🤔 Not seeing the same results here. On react-pdf 5.2.0, if you navigate away from a PDF mid load on slow internet, it'll still throw the following error. No special options, using vanilla sample code