GetTextAttributes not returning

Technical Support WebViewer
,
1

WebViewer Version: 11.11.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? I’ve only tried it on chrome
Is your issue related to a front-end framework? React
Is your issue related to annotations? Maybe

Please give a brief summary of your issue:
When trying to call getTextAttributes() in a contentEditSelectionChange() listener the getTextAttributes call never returns.

Please describe your issue and provide steps to reproduce it:

Please provide a link to a minimal sample where the issue is reproducible:
Here are some code snippets (I don’t know why some is displayed as code and some not)

const contentEditorRef = useRef(null);
…

useEffect(() => {
const toolNames = props.webInstance.Core.Tools.ToolNames;
const { Core } = props.webInstance;

if (props.tool === toolNames.CONTENT_EDIT) {

  const handleEditorStarted = ({ editor }: any) => {
    contentEditorRef.current = editor;

    //const attribute = editor.getTextAttributes();
    //const { fontSize, fontName, fontColor, bold, italic, underline, textAlign } = attribute;
    //console.log("getTextAttributes returns ok here.");
  };
  
  // Async or not doesn't affect gettextattributes returning e.g const handleSelectionChange = ( ) => {
  const handleSelectionChange = async ( ) => {
    if ((contentEditorRef) && (contentEditorRef.current) && (contentEditorRef.current.getTextAttributes)) {

      //const attribute = await contentEditorRef.current.getTextAttributes();
      //const { fontSize, fontName, fontColor, bold, italic, underline, textAlign } = attribute;
      //console.log("the async await version also never returns" + attribute);


      contentEditorRef.current.getTextAttributes()
        .then((attributes: any) => {
          console.log("AttributesWorked getTextAttributes() succeeded:", attributes);
        })
        .catch((error: any) => {
          console.log("AttributesFailed getTextAttributes() error:", error);
        });
    }
    else {
      console.log("getTextAttributes or contentEditorRef is null")
    }
  };

  const documentViewer = Core.documentViewer;
  const contentEditManager = documentViewer.getContentEditManager();      
  contentEditManager.addEventListener('contentBoxEditStarted', handleEditorStarted);
  contentEditManager.addEventListener('contentEditSelectionChange', handleSelectionChange);
  console.log("Event listeners attached");
}

}, [props.tool, props.webInstance]);

3

Hello @JamesDustin ,

Thank you for posting on our forum.

After some testing with the code provided, there may be an issue with how you are storing the reference for the contentEditorRef. When adding the listeners within the handleEditorStarted function (where you reported the getTextAttributes function was still working), I was able to gather the text attributes on selected as desired:

image
image1920×924 383 KB

For context, you can see the modified code snippet here:

const contentEditManager = documentViewer.getContentEditManager();

 const handleEditorStarted = ({ editor }) => {
    const contentEditorRef = editor;
    console.log('handleEditorStarted');
    contentEditManager.addEventListener('contentEditSelectionChange', async (selectionChangeEvent) => {
        console.log(selectionChangeEvent.event.target.getSelection().toString());
        const textAttributes = await contentEditorRef.getTextAttributes();
        console.log('getTextAttributes: ', textAttributes);
    });
};
contentEditManager.addEventListener('contentBoxEditStarted', handleEditorStarted);

We recommend ensuring the reference to the ContentBoxEditor is as expected when you are attaching the listeners. Let us know if you need further clarification!

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