When set hyperlink to range with field remove text

[NataliaKravcheniaTR]

When set hyperlink to range with TA field, it removes visible text

Your Environment

• Platform: PC desktop
• Host: Word

Expected behavior

Link will be inserted in text

Current behavior

Link inserted in hidden text, visible text is removed/hidden
Hide hidden text:

Show hidden text:

Steps to reproduce

Add some text, add citation at the beginning, add bookmark (bookmark - id) which includes TA tag and text.

Load this script in Script Lab:

name: Set hyperlink to range with TA field
description: ''
host: WORD
api_set: {}
script:
  content: |
    $("#run").on("click", () => tryCatch(insertHyperlink));

    async function insertHyperlink() {
      await Word.run(async (context) => {
        const bookmarkRange = context.document.getBookmarkRange("bookmark");

        await context.sync();

        bookmarkRange.hyperlink = "test.com";

        await context.sync();
      });
    }

    // Default helper for invoking an action and handling errors.
    async function tryCatch(callback) {
      try {
        await callback();
      } catch (error) {
        // Note: In a production add-in, you'd want to notify the user through your add-in's UI.
        console.error(error);
      }
    }
  language: typescript
template:
  content: |-
    <button id="run" class="ms-Button">
        <span class="ms-Button-label">Insert hyperlink to bookmark</span>
    </button>
  language: html
style:
  content: |-
    section.samples {
        margin-top: 20px;
    }

    section.samples .ms-Button, section.setup .ms-Button {
        display: block;
        margin-bottom: 5px;
        margin-left: 20px;
        min-width: 80px;
    }
  language: css
libraries: |
  https://appsforoffice.microsoft.com/lib/1/hosted/office.js
  @types/office-js

  [email protected]/dist/css/fabric.min.css
  [email protected]/dist/css/fabric.components.min.css

  [email protected]/client/core.min.js
  @types/core-js

  [email protected]
  @types/[email protected]

I've found a workaround for this issue

async function insertHyperlink() {
  await Word.run(async (context) => {
    const bookmarkRange = context.document.getBookmarkRange('bookmark')

    bookmarkRange.load('fields')
    await context.sync()
    const field = bookmarkRange.fields.items[0]

    field.select('End')

    await context.sync()
    const selection = context.document.getSelection()

    await context.sync()

    const range = selection.expandTo(bookmarkRange.getRange('End'))
    range.hyperlink = "test.com"
    await context.sync()
  });
}

[microsoft-github-policy-service]

Thank you for letting us know about this issue. We will take a look shortly. Thanks.

[guoms1]

Hi, @NataliaKravcheniaTR

Thank you for bringing this to our attention! I've been able to reproduce the issue on my end and will be forwarding it (#9761210) to the relevant team for further investigation.

We truly appreciate your patience and your effort in reporting this. Please let us know if you have any additional details that might help.

Best,