This is the script to test onDataChanged event

OnDataChangedEventTest.EXCEL.yaml

name: OnDataChangedEventTest
description: 'This is the script to test onDataChanged event '
host: EXCEL
api_set: {}
script:
  content: >
    $("#run").click(() => tryCatch(run));


    $("#register-data-changed-handler").click(() =>
    tryCatch(registerDataChangedHandler));


    $("#unregister-data-changed-handler").click(() =>
    tryCatch(unregisterDataChangedHandler));


    var eventResult: OfficeExtension.EventHandlerResult<any>;


    async function run() {
      await Excel.run(async (context) => {
        //context.application.suspendApiCalculationUntilNextSync();

        const worksheet = context.workbook.worksheets.getActiveWorksheet();

        const newValues = new Array(2).fill(new Array(2).fill("10"));

        worksheet.getRangeByIndexes(0, 0, 2, 2).values = newValues;

        //var range = worksheet.getRange("A10:B10");
        //range.values = newValues;

        await context.sync();
      });
    }


    async function registerDataChangedHandler() {
      await Excel.run(async (context) => {
        const sheet = context.workbook.worksheets.getActiveWorksheet();
        //const range = sheet.getRange("A1:B1");
        //const rangeBinding = context.workbook.bindings.add(range, "Range", "A1:B1");
        //eventResult = sheet.onChanged.add(onRangDataChanged);

        sheet.onFormatChanged.add(onFormatChanged);

        sheet.charts.onAdded.add(onAddChart);
        sheet.tables.onAdded.add(onAddTable);

        console.log("The data changed handler is registered.");

        await context.sync();
      });
    }


    async function unregisterDataChangedHandler(eventArgs: any) {
      await Excel.run(eventResult.context, async (context) => {
        eventResult.remove();
        await context.sync();

        console.log("Range data change event unregistered");
      });
    }


    async function onRangDataChanged(eventArgs: any) {
      //console.log("data changed");
      await Excel.run(async (context) => {
        console.log(JSON.stringify(eventArgs));
      });
    }


    async function onFormatChanged(eventArgs: any) {
      //console.log("data changed");
      await Excel.run(async (context) => {
        console.log(JSON.stringify(eventArgs));
      });
    }


    async function onAddChart(eventArgs: any) {
      //console.log("data changed");
      await Excel.run(async (context) => {
        console.log(JSON.stringify(eventArgs));
      });
    }


    async function onAddTable(eventArgs: any) {
      //console.log("data changed");
      await Excel.run(async (context) => {
        console.log(JSON.stringify(eventArgs));
      });
    }


    /** 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: "<section class=\"ms-font-m\">\n\t<p class=\"ms-font-m\">This sample demonstrates basic Excel API calls.</p>\n</section>\n\n<section class=\"samples ms-font-m\">\n\t<h3>Try it out</h3>\n\t<p class=\"ms-font-m\">Select some cells in the worksheet, then press <b>Highlight selected range</b>.</p>\n\t<button id=\"register-data-changed-handler\" class=\"ms-Button\">\n\t\t\t\t\t        <span class=\"ms-Button-label\">Register data-changed handler</span>\n\t\t</button>\n\t<button id=\"run\" class=\"ms-Button\">\n        <span class=\"ms-Button-label\">Highlight selected range</span>\n    </button>\n\t<button id=\"unregister-data-changed-handler\" class=\"ms-Button\">\n\t        <span class=\"ms-Button-label\">Unregister data-changed handler</span>\n\t    </button>\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



  @microsoft/office-js-helpers@0.7.4/dist/office.helpers.min.js
  @microsoft/office-js-helpers@0.7.4/dist/office.helpers.d.ts



  jquery@3.1.1
  @types/jquery@3.3.1