Access webdriver instance from outside of useEffect


Thank you for the amazing library.
I use @pdftron/webviewer in my React application as part of the application. I am just wondering if there is a way for me to initialize the WebViewer instance once and use it throughout the app? I have my own annotation service which handles storing, populating the annotations, without access to the instance from outside of WebViewer, I have to construct WebViewer every time there’s a change in annotation list which is very bad experience, especially for a big PDF file.
Please advise.


Hi Nhat,

@pdftron/webviewer also exports a util function that you can use to get the current WebViewer instance.

import { getInstance } from ‘@pdftron/webviewer’;

Assuming you’ve initialized WebViewer already, you can call this function to get the instance and use it in other files.

Another solution I can think of is to put the instance on a React context and useContext in other components to access the instance.

Let me know if this is what you are looking for and if you have any other questions.

Best Regards,
Zhijie Zhang
Software Developer
PDFTron Systems Inc.

Hello Zhijie,

Thanks for the response. So I tried to use: import { getInstance } from '@pdftron/webviewer’
It returns the instance, however when I do:

const { docViewer, annotManager, Annotations, iframeWindow } = getInstance()

The Annotations, iframeWindow and annotManager become undefined while docViewer does contains an object. Do I need to do anything before I can get the instance correctly? There’s only 1 instance in my system.


I store the instance in a reducer and it works now. Thanks for the context hint. Thanks.