After a failed loadDocument/loadVideo call, subsequent calls also fail (when they should succeed)

Technical Support
1

Product: webviewer & webviewer-video

Product Version: 8.4.0

Please give a brief summary of your issue:
After failing to load a video or document, subsequent load calls that should pass either error out or never return.

Please describe your issue and provide steps to reproduce it:
(The more descriptive your answer, the faster we are able to help you)
I’m trying to implement error handling around our loadDocument and loadVideo calls using simple try/catch statements. For testing purposes, I’m forcing errors using throw statements. The following 2 strange behaviors keep occurring:

  1. When I force a loadVideo call to fail, but then load a perfectly working document, the loadDocument call returns with this: “TypeError: Cannot read properties of null (reading ‘document’)”. Since this happens within the PDFTron code, it’s difficult to know what it’s breaking on exactly. I assume something in the WebViewer itself is messed up from the first failed loadVideo call.
  2. When I force a loadDocument call to fail, but then load a perfectly working video, the loadVideo call never returns. It doesn’t resolve or reject, it simply never finishes with anything. Since there’s no resolution, there’s nothing for me to work with.

If these are known issues or if you can offer any assistance at all, I would greatly appreciate it as the causes of these have been very elusive.

Please provide a link to a minimal sample where the issue is reproducible:
I don’t have a sandboxed case, but can provide more code details upon request. Our implementation is very basic.

2

Hello,

To my knowledge, WebViewer should automatically recover from loading errors and allow you to continue to load documents.

Could you please clarify what kind of documents you are loading and how you are forcing the errors?
Some sample code to help reproduce the issue would be helpful.

3

I’ve gotten it to “work” in so far as after 1 document is forced to fail, a subsequent document (that should not fail) will still load. However, I only was able to do this by removing all of our state/error related code.

	const { container, error, isLoading } = useWebViewer({
		document: data,
		onDocumentLoaded: handleDocumentLoad,
		onDocumentLoadError: handleLoadError,
		videoEventsHandlers
	});

	if (error) {
		return <PdfViewerLoadError documentName={data.name} />;
	}

	return <div ref={container} style={{ width:'100%' }}>{isLoading && <Loader active={true} />}</div>;

The above hook useWebViewer calls the initialization logic for the webViewer and videoViewer, then calls the appropriate load logic for either a video/non-video document when the user changed the document selected in the UI.

I assume that since the error component is displayed to the screen instead of the container at the time that the load logic is being called, that the load logic isn’t able to display the loaded document to the screen. Does that sound right?

4

Thanks for the update!

That looks to be the case as you are rendering the error component on error and not the element that WebViewer mounts to. We would recommend keeping WebViewer mounted and hidden (PDFTron Systems Inc. | Documentation) when not in use. Instead of one component or the other, you could show a custom error modal instead. You could implement your own, but WebViewer does come with an API to display an error message: PDFTron WebViewer Namespace: UI.

Let me know if this helps!

1 Like
5

Thanks for your help Andy. Unfortunately we can’t use another modal because our WebViewer is already in a modal. But hiding/showing the container element fixed the issue. We’ll look into implementing displayErrorMessage in the future. Thanks again.