block-dev-tool/layouts/scripts/frame/frame.js

'use strict';

// Blocks Initialization.
function initBlock(blockName = '', selector = '', cb) {
  document.querySelectorAll(selector).forEach((el) => cb(el));
}

// Scrollbars / Frame resizes notifications.
(function () {
  let height;
  const debug = false;

  handleHeightChange(); // Initial frame's height setup.
  setupResizeListener(); // Listen to frame's height changes.

  ///

  function setupResizeListener() {
    const resizeObserver = new ResizeObserver(handleHeightChange);
    resizeObserver.observe(document.body);
  }

  function handleHeightChange(entries) {
    const updatedHeight = getCurrentHeight();

    if (debug) {
      console.log('Height Updates', 'Old vs New: ' + height, updatedHeight);
    }

    if (height === updatedHeight) {
      return;
    }

    const RESIZE_CODE = 'resize:';
    height = updatedHeight;
    window.parent.postMessage(RESIZE_CODE + JSON.stringify({height}), '*');

    if (debug) {
      console.log('Resize message sent: ', height)
    }
  }

  function getCurrentHeight() {
    return document.querySelector('body > main').scrollHeight;
  }
})();