Office Online environment corrupted after trying to run script while viewing Footnotes

[sureshjoshi]

Message from office-js bot: We’re closing this issue because it has been inactive for a long time. We’re doing this to keep the issues list manageable and useful for everyone. If this issue is still relevant for you, please create a new issue. Thank you for your understanding and continued feedback.

I don't know if this is a problem with OfficeJS or Office Online - but something weird is happening, which is making testing/development very slow and painful.

I've attached a video and images which explains this better than I can, but essentially, I can run the attached script without issues when I'm in the body of the document. However, when I run the script while the Footnotes popup is in focus, the document is effectively corrupted.

The existing footnote disappears, a RichApi error is thrown (and is always thrown for the same operation from now on, until I refresh the browser - closing and re-opening script lab isn't enough). As well, my paragraph body text starts appearing and disappearing based on document clicks.

From this state, I need to refresh the browser page before I can run my ScriptLab script again.

Again, very poor explanation, but the video shows an example.

Your Environment

• Platform [PC desktop, Mac, iOS, Office on the web]: Office Online
• Host [Excel, Word, PowerPoint, etc.]: Word
• Office version number: 16.0.14622.41000
• Operating System: MacOS 12.0.1
• Browser (if using Office on the web): Chrome 95.0.4638.54

Expected behavior

I'm not sure. The environment shouldn't be corrupted, but I'm fine not being able to run my script while viewing the footnotes (though, not sure why that wouldn't be possible). However, I would expect no more than a standard OfficeJS exception to be thrown, with no "damage" to my document.

Current behavior

The document and my interactions are all corrupted, and I need to do a webpage refresh before I can even use Office Online again. There is no guarantee whether, on refresh, there will be content in the document - or it will be empty.

Script Lab example

name: Clear from Footnotes popup
description: 
host: WORD
api_set: {}
script:
  content: |
    $("#run").click(() => tryCatch(run));

    async function run() {
      await Word.run(async (context) => {
        context.document.body.clear();
        const p1 = context.document.body
          .insertParagraph("Placeholder text for the first footnote.", "Start")
          .getRange("End");
        p1.insertFootnote("First footnote content");
        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">Run</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/beta/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

Context

Just testing out the new API for an application being developed (in order to replace a lot of nasty insertOOXML).

Useful logs

Video of the problem in action:

https://user-images.githubusercontent.com/3823045/139332535-b0d22ec0-49a0-4078-bf8b-ddd0b06fb86d.mov

Screenshots of the problem with some small annotations:

[ERROR]: Error:
{
    "stack": "RichApi.Error: Cannot read properties of null (reading 'Uc')\n    at new n (https://appsforoffice.microsoft.com/lib/beta/hosted/word-web-16.00.js:26:308248)\n    at n.o.processRequestExecutorResponseMessage (https://appsforoffice.microsoft.com/lib/beta/hosted/word-web-16.00.js:26:371544)\n    at https://appsforoffice.microsoft.com/lib/beta/hosted/word-web-16.00.js:26:369649",
    "message": "Cannot read properties of null (reading 'Uc')",
    "name": "RichApi.Error",
    "code": "GeneralException",
    "traceMessages": [],
    "innerError": null,
    "debugInfo": {
        "code": "GeneralException",
        "message": "Cannot read properties of null (reading 'Uc')",
        "errorLocation": "Body.clear",
        "statement": "body.clear();",
        "surroundingStatements": [
            "var root = context.root;",
            "var body = root.body;",
            "// Instantiate {body}",
            "// >>>>>",
            "body.clear();",
            "// <<<<<"
        ],
        "fullStatements": [
            "Please enable config.extendedErrorLogging to see full statements."
        ]
    },
    "httpStatusCode": 500
}

[chiz-ms]

Thank you for reporting this issue regarding Body.clear API in footnotes. The issue is confirmed and tracked as ADO#5535646 in our backlog.

[sureshjoshi]

Hi @chiz-ms - is there any movement on this bug? It's a tricky one for development, since it requires a full browser refresh.

Thanks!

[RuizhiSunMS]

Hello @sureshjoshi , we colleagues fixed this issue together with the one in https://github.com/OfficeDev/office-js/issues/2216. Now You can take the reply about deployment date in that link as an example. Sorry for updating late.