Coop UI Performance Test.WORD.yaml

name: Coop UI Performance Test
description: ''
host: WORD
api_set: {}
script:
  content: |
    $("#insert-html").on("input", function() {
      insertHtmlIntoCCs((this as HTMLInputElement).value);
    });

    async function insertHtmlIntoCCs(text) {
      await Word.run(async (context) => {
        let contentControls = context.document.contentControls;
        contentControls.load("length");
        await context.sync();

        for (let i = 0; i < contentControls.items.length; i++) {
          contentControls.items[i].insertHtml(
            `
          <table><tr>
            <th><b>Header 1</b></th>
            <th><b>Header 2</b></th>
            <th><b>Header 3</b></th>
          </tr><tr>
            <td>${text} 1</td>
            <td>${text} 2</td>
            <td>${text} 3</td>
          </tr>
          </table>
          <ul style="color:blue">
          <li>${text} 1</li>
          <li>${text} 2</li>
          <li>${text} 3</li>
          <li>${text} 4</li>
          <li>${text} 5</li>
          </ul><br>
          `,
            "Replace"
          );
        }
        await context.sync();
      });
    }

    async function tryCatch(callback) {
      try {
        await callback();
      } catch (error) {
        console.error(error);
      }
    }
  language: typescript
template:
  content: "<section class=\"samples ms-font-m\">\n\t<h3>Try it out</h3>\n   <span class=\"ms-Button-label\">Type some text</span><br>\n\t<textarea type=\"text\" id=\"insert-html\"></textarea>\n   \n</section>"
  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