Resizableによって動的にサイズ変更できるの中に生成されたHandsontableのサイズを、<div>の大きさに合わせて変更したい。

Question

Handsontableにお詳しい方、似たような実装をされた方、お手隙の際にアドバイスいただけると助かります。

■使用技術
Handsontable 6.2.2 https://handsontable.com/ (Execel風のテーブルを実装できるライブラリ)
Resizable https://jqueryui.com/resizable/ (指定したdiv等をリサイズできるようにするライブラリ)

■やりたいこと
Resizableによって動的にサイズ変更できるの中に生成されたHandsontableのサイズを、<div>の大きさに合わせて変更したい。

■現状
サイズを変更してもうまくテーブルのサイズが変更されない。

■試したこと
・Handsontableの各種設定(stretchHはwindowサイズには追従してサイズ変更してくれるがdivのリサイズには効かない。preventOverflowを設定したら挙動がおかしい。)

tableSettings = {
          data: dataObject,
          autoColumnSize: true,
          colHeaders: searchName,
          rowHeaders: rowHeaders,
          stretchH: 'all',
          outsideClickDeselects: false,
          columns: columns
      };

・リサイズされるをMutationObserverで監視し変更されたサイズを取得、そのサイズをテーブルにセッティング(変更されない)

const target = document.getElementById('content' + graphNo)
const table = document.getElementById('table' + graphNo)    
const observer = new MutationObserver((mutations) => {
    mutations.forEach((mutation) => {
        console.log('width : ' + mutation.target.clientWidth)
        console.log('height : ' + mutation.target.clientHeight)
        table.style.width = mutation.target.clientWidth + "px"
        console.log(table.style.width)
    });
});
const config = {
    attributes: true,
};
observer.observe(target, config);