Exception occurs when double-clicking after adding FreeTextAnnotation

Detailed description of issue
After adding FreeTextAnnotation, an error occurs when double-clicking for editing.

Expected behaviour
the modification is complete and I can export and import Annotation.

Code snippet
newAnnot = new Annotations.FreeTextAnnotation();
newAnnot.Width = AnnotationStyle[type].width;
newAnnot.Height = AnnotationStyle[type].height;
newAnnot.X = position.x;
newAnnot.Y = position.y;
newAnnot.FontSize = fontSize;
newAnnot.TextColor = new Annotations.Color(0, 0, 0);
newAnnot.setPadding(new Annotations.Rect(0, 0, 0, 0));
newAnnot.StrokeThickness = 0;
newAnnot.setContents(‘Text’);

Error
CoreControls.js:187 TypeError: Cannot read property ‘getBoundingClientRect’ of null
at webviewer-ui.min.js:52
at e (webviewer-ui.min.js:52)
at CoreControls.js:458
at Array.forEach ()
at e.x.trigger (CoreControls.js:458)
at y. (CoreControls.js:980)
at CoreControls.js:458
at Array.forEach ()
at y.x.trigger (CoreControls.js:458)
at HTMLDivElement. (CoreControls.js:886)

verison
commit 9a9f5903f594755b5356e3e5897f84254b2baa5b (tag: v6.3)

1 Like

Hey there!

I cannot reproduce your issue in either version 6.3 or 7.0.1.

Do you have any other code that customizes the FreeTextAnnotation class? Can you share the code that adds the annotation to the annotation manager? Any other relevant code around this annotation would be helpful.

Thanks!
Logan

webviewer.zip (2.5 MB)

I have attached the webviewer I am using. I’m using typescript.

Code

 useEffect(() => {
    WebViewer(
      {
        path: '../../../../content/webviewer/lib',
        initialDoc: docUrl,
        disabledElements: [
          'annotationStyleEditButton',
          'textToolGroupButton',
          'annotationStylePopup',
          'richTextPopup',
          'textPopup',
          'toolsButton',
          'menuButton',
          'contextMenuPopup',
          'freeHandToolGroupButton',
          'textToolGroupButton',
          'shapeToolGroupButton',
          'signatureToolButton',
          'eraserToolButton',
          'stickyToolButton',
          'freeTextToolButton',
          'miscToolGroupButton',
          'signatureModal',
          'signatureOverlay',
          'richTextUnderlineButton',
          'richTextItalicButton',
          'richTextColorPalette',
        ]
      },
        viewer.current,
    ).then((instance) => {
      const { docViewer, annotManager, Annotations} = instance;

      instance.disableTools();

      docViewer.on('documentLoaded', () => {

        const newAnnot = new Annotations.FreeTextAnnotation();
        newAnnot.Width = 100;
        newAnnot.Height = 30;
        newAnnot.X = 10;
        newAnnot.Y = 10;
        newAnnot.FontSize = '20pt';
        newAnnot.TextColor = new Annotations.Color(0, 0, 0);
        newAnnot.setPadding(new Annotations.Rect(0, 0, 0, 0));
        newAnnot.StrokeThickness = 0;
        newAnnot.setContents('text');
        annotManager.addAnnotation(textAnnot, true);
        annotManager.redrawAnnotation(textAnnot);
      });
...
}

Detailed description of issue
After edting, export annotation and I get this xfdf string
xfdf_annotation.zip (838 Bytes)

An error occurs when importing. And importing all annotations fail…

Expected behaviour
I hope that the freetext annotation can be properly modified and exported.
I would like to see the modified contents when importing.

Error
CoreControls.js:789 Uncaught TypeError: Cannot read property ‘AU’ of undefined
at webpack_exports.e.Rv (VM451 CoreControls.js:789)
at webpack_exports.e.Rk (VM451 CoreControls.js:790)
at ba.Rk (VM451 CoreControls.js:217)
at ba.Rk (VM451 CoreControls.js:331)
at ba.DX (VM451 CoreControls.js:324)
at ba.Pd (VM451 CoreControls.js:323)
at n.f.Nk (VM451 CoreControls.js:293)
at VM451 CoreControls.js:242
at Array.forEach ()
at VM451 CoreControls.js:242

Hi!

I still cannot reproduce the double clicking issue. I do notice a few potential issues in your code though.

  1. You are creating an annotation named newAnnot but then importing an annotation called textAnnot into annotation manager (which does not exist)

  2. You are not passing a dependency array to useEffect which means you may be mounting WebViewer multiple times, which will cause issues.

Also, I’m a bit confused about your last message. Is this a new error that is occurring?

Thanks,
Logan

Sorry for making you confused. I will open it to another issue.
I put a sample that reproduced there on github.

1 Like