WebViewer Version:
10.8.0
Do you have an issue with a specific file(s)?
No
Can you reproduce using one of our samples or online demos?
No
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:
Unable to track pdf loading progress via events
Please describe your issue and provide steps to reproduce it:
I have a react application implementing the pdftron webviewer to compare and display 2 pdfs side by side. I have been trying to monitor the instance application by logging the outputs in hopes of being able to display a loading state component that reflects the documentLoaded or viewerLoaded events, however, not only do i not see my log outputs in the instance, i am unable to process any events happening.
Please provide a link to a minimal sample where the issue is reproducible:
I am not able to provide a link, however, here is the webviewer instance:
const PdfComparisonViewer = ({ originalUrl, comparisonUrl, setIsLoading }) => {
const viewer = useRef(null)
const urlOne = originalUrl || PLACEHOLDER_URL
const urlTwo = comparisonUrl || PLACEHOLDER_URL
console.log('test')
useEffect(() => {
WebViewer(
{
fullAPI: true,
path: '/webviewer/lib',
initialDoc: urlOne,
},
viewer.current
).then((instance) => {
const { documentViewer, annotationManager, PDFNet } = instance.Core
console.log('test 2')
documentViewer.addEventListener('viewerLoaded', () => {
console.log('viewer loaded')
})
})
}, [urlOne, urlTwo])
return (
<div style={{ height: '100%', width: '75%' }}>
<div style={{ height: '100%' }} className="webviewer" ref={viewer} />
</div>
)
}
I do see the PDF loading, however, I would also expect to see the logs for “viewer loaded”, however, i do not see those in my terminal/chrome devtools.
The goal is to be able to monitor the loading state via the event listeners to change our frontend state.