Handsontable example

HTML

<div id="example1" class="hot handsontable htRowHeaders htColumnHeaders" style="height: 320px; overflow: hidden; width: 100%;" data-originalstyle="height: 320px; overflow: hidden; width: 100%;"></div>

CSS

</style><!-- Ugly Hack due to jsFiddle issue -->

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/handsontable.full.min.js"></script>
<link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/handsontable.full.min.css">

JavaScript

var example = document.getElementById('example1');
  var hot = new Handsontable(example, {
    data: Handsontable.helper.createSpreadsheetData(4, 4),
    colWidths: 100,
    rowHeaders: true,
    colHeaders: true,
    licenseKey: 'non-commercial-and-evaluation',
    afterDocumentKeyDown: function(e) {
      console.log(this.getActiveEditor()._opened)
    }
  });


  function waitForIt() {
    var id = setInterval(frame, 800);
    var state = hot.getActiveEditor();

    function frame() {
      if (!state) {
        clearInterval(id);
      } else if (state._opened === true) {
        console.log('I wait cause cell is being edited', state)
      } else if (state._opened === false) {
        console.log('I am closed', state);
        hot.setDataAtCell(3, 3, '**TEST**');
        clearInterval(id);
      }
    }

  }

  setTimeout(function() {
    waitForIt()
  }, 2000)