Calling instance when promise resolves works one way but not another

Technical Support WebViewer
,
1

WebViewer Version: npm version

Do you have an issue with a specific file(s)? no
Can you reproduce using one of our samples or online demos? not applicable
Are you using the WebViewer server? no
Does the issue only happen on certain browsers? no
Is your issue related to a front-end framework? no
Is your issue related to annotations? no

Please give a brief summary of your issue:
Don’t want to initialize webViewer method every function call.

Please describe your issue and provide steps to reproduce it:
I’m trying to load a PDF URL using Apryse’s webViewer method. When I use the method as specified in their docs it works as intended (as shown below). But I don’t want to initialize a new webViewer every function call so I tried to initialize webViewer once and call loadDocument() on the instance but that doesn’t work. I don’t get any errors or anything. What am I doing wrong?

Please provide a link to a minimal sample where the issue is reproducible:
Function calling:

loadDocViewer('https://pdfobject.com/pdf/sample.pdf')

Doesn’t work:

let webViewerInstance;

WebViewer({
    path: '/@pdftron/webviewer/public',
}, document.getElementById('doc-viewer'))
    .then(instance => {
        webViewerInstance = instance
    })
    .catch(error => {
        console.error('Error initializing WebViewer:', error);
    });

function loadDocViewer(url) {
    if (!webViewerInstance) {
        console.error('Doc Viewer is not initialized! Try again in a bit.');
        return;
    }

    webViewerInstance.UI.loadDocument(url);
}

Works:

function loadDocViewer(url) {
    WebViewer({
        path: '/@pdftron/webviewer/public',
    }, document.getElementById('doc-viewer'))
        .then(instance => {
            instance.UI.loadDocument(url);
        })
        .catch(error => {
            console.error('Error initializing WebViewer:', error);
        });
}
2

Hello Sarem,

I was able to load WebViewer properly with the following code below.

let webViewerInstance;

WebViewer({
  path: '../../../lib',
}, document.getElementById('viewer'))
    .then(instance => {
        webViewerInstance = instance;
        loadDocViewer('https://pdftron.s3.amazonaws.com/downloads/pl/demo-annotated.pdf');
    })
    .catch(error => {
        console.error('Error initializing WebViewer:', error);
    });

function loadDocViewer(url) {
    if (!webViewerInstance) {
        console.error('Doc Viewer is not initialized! Try again in a bit.');
        return;
    }

    webViewerInstance.UI.loadDocument(url);
}

image
image1716×1514 169 KB

I tested this code on the latest version of WebViewer.

What error messages are you seeing? Please provide any steps or configurations I may be missing.

Best Regards,
Darian