OfficeDev / office-js

A repo and NPM package for Office.js, corresponding to a copy of what gets published to the official "evergreen" Office.js CDN, at https://appsforoffice.microsoft.com/lib/1/hosted/office.js.
https://learn.microsoft.com/javascript/api/overview
Other
686 stars 95 forks source link

[WordOnline] context.document.getSelection() returns incorrect text in footnotes/endnotes #5037

Open NataliaKravcheniaTR opened 1 week ago

NataliaKravcheniaTR commented 1 week ago

Provide required information needed to triage your issue

context.document.getSelection() returns incorrect result text in footnotes/endnotes

Your Environment

Expected behavior

Returns correct selected text in footnote/endnote Returns 'text'

Current behavior

Returns incorrect selected text in footnote/endnote Returns 'ext'

Steps to reproduce

Load this script in Script Lab: Click 'Setup', 'Select 'text' in footnote' and 'Get selection text' buttons

name: Get selection text in footnote
description: ''
host: WORD
api_set: {}
script:
  content: >
    $("#run").on("click", () => tryCatch(run));

    $("#select").on("click", () => tryCatch(select));

    $("#get").on("click", () => tryCatch(getSelectionText));

    const bodyText = "body text";

    const footnoteText = "footnote text";

    const searchText = "text";

    async function run() {
      await Word.run(async (context) => {
        const body = context.document.body;
        const range = body.insertText(bodyText, Word.InsertLocation.replace);

        const footnote = range.insertFootnote(footnoteText);

        await context.sync();
      });
    }

    async function selectText(paragraph: Word.Paragraph, context:
    Word.RequestContext) {}

    async function select() {
      await Word.run(async (context) => {
        const footnotes = context.document.body.footnotes;

        footnotes.load("items");

        await context.sync();

        const footnoteParagraphs = footnotes.items[0].body.paragraphs;

        footnoteParagraphs.load("items, text");

        await context.sync();

        const result = footnoteParagraphs.items[0].search(searchText);

        result.load("text");
        await context.sync();

        result.items[0].select();

        await context.sync();

      });
    }

    async function getSelectionText() {
      await Word.run(async (context) => {
        const selection = context.document.getSelection();

        selection.load("text");

        await context.sync();

        console.log(selection.text);

        console.log(searchText === selection.text)
      });
    }

    // 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">Setup</span>
    </button>

    <button id="select" class="ms-Button">
        <span class="ms-Button-label">Select 'text' in footnote</span>
    </button>

    <button id="get" class="ms-Button">
        <span class="ms-Button-label">Get selection text</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

  office-ui-fabric-js@1.4.0/dist/css/fabric.min.css
  office-ui-fabric-js@1.4.0/dist/css/fabric.components.min.css

  core-js@2.4.1/client/core.min.js
  @types/core-js

  jquery@3.1.1
  @types/jquery@3.3.1
RuizhiSunMS commented 1 week ago

Hi @NataliaKravcheniaTR, thx for submitting this. I can repro it. It has been put on our backlog #9491181, the team will investigate and we will reply to you as soon as there is any progress. Thank you for your patience. Btw, would you please confirm this case won't happen on win32 or mac?

NataliaKravcheniaTR commented 1 week ago

@RuizhiSunMS I reproduced it in win32

RuizhiSunMS commented 1 week ago

ACK. I will share it with related folks.

@RuizhiSunMS I reproduced it in win32

RuizhiSunMS commented 1 week ago

Hi @NataliaKravcheniaTR, My colleague and I couldn't reproduce it on win32. Would you please share more about how you reproduced it on win32? For example, what's your version, do you use the same code and others?

NataliaKravcheniaTR commented 1 week ago

@RuizhiSunMS Do you mean a Desktop version of Word? I cannot reproduce it neither there. It's reproducible in Word Online

RuizhiSunMS commented 1 week ago

@NataliaKravcheniaTR, ok, I got it.