on(mouseLeftUp,...) event listener not woking

[sarthakkaul68]

    if (!instance || !instance.docViewer) {
    //   console.error("WebViewer failed to initialize. Check /lib path and files.");
      return;
    }

    const { docViewer, annotManager, UI, Core } = instance;

    docViewer.addEventListener("documentLoaded", () => {
      const toolManager = docViewer.getToolManager();
     
      // toolManager.setToolMode("Pan");
      toolManager.setToolMode(Core.Tools.ToolNames.PAN);
      UI.enableElements(["measurementToolsButton"]);
      Core.MeasurementManager.enableMeasurement();

      console.log("✅ WebViewer ready with measurement tools");
    });

    if (onClickPage) {
      docViewer.on("mouseLeftUp", (e) => {
        console.log('check')
        try {
          const page = docViewer.getCurrentPage();
          const displayMode = docViewer.getDisplayModeManager().getDisplayMode();
          const { x, 

this is my code. I am trying to send the coordinates of cli as response in backend via API. But the eent listener doesnt seem to work

[system]

Hello, I’m AiRon, an automated tech support bot
While you wait for one of our customer support representatives, I can help you with your question.

It seems you’re having trouble with the mouseLeftUp event listener in Apryse’s WebViewer. This event listener should be set up correctly to capture mouse events, but there could be a few reasons why it’s not triggering as expected.

Some things you can try:

• Ensure the event listener is added after the document has fully loaded by using the documentLoaded event.


• Make sure the tool mode is set correctly to allow for mouse interaction. If it’s set to Pan, confirm that this mode is active when you’re trying to capture the click event.


• Verify that the onClickPage function is defined and being called appropriately.


• Check for any JavaScript errors in the console that might prevent the event listener from being attached.


• Ensure that the WebViewer instance is correctly initialized and all necessary components (docViewer, annotManager, etc.) are accessible.

Here are some resources that might help you:

• Working with WebViewer loading events - Learn how to properly use loading events like documentLoaded to ensure your code runs at the right time.


• Annotation Events - Understand how to hook into various annotation-related events, which might be relevant if you’re working with annotations.


• Building your own UI - This guide explains how to set up the DocumentViewer and other core components.


• Create new PDF form fields using JavaScript Widget Annotation - Provides insights on handling form fields and annotations, which could be useful if your event listener interacts with PDF forms.


• Creating annotations in WebViewer - Learn how to programmatically create and manage annotations, which might be related to your use case.

Hopefully, this helps you solve your problem while you wait for a human to get back to you.

[jromanocarlsen]

Hello @sarthakkaul68,

Thank you for posting on our forum.

What version of WebViewer are you using? Starting in version 8, the docViewer and annotManager namespaces were changed to documentViewer and annotationManager respectfully. Additionally, they are no longer in the instance namespace, but the Core namespace. If you are using version 8+, we recommend making this change.

Additionally, please use addEventListener rather than on. This was also a change made for version 8+.

For a full list of the changes mentioned, see our migration guide here: https://docs.apryse.com/web/guides/get-started/migrating-to-v8

Let us know if this works for you!

Best Regards,
Jacob Romano Carlsen
Web Development Support Engineer
Apryse Software Inc.