JSFiddle - React, Tailwind, and code Playground

by Denis Rul

HTML

<script src="https://rawgit.com/que-etc/resize-observer-polyfill/master/dist/ResizeObserver.js"></script>
<div id="my-element">
Hover me <br/>
<span id="info"></span>
</div>

CSS

#my-element {
  width: 200px;
  height: 200px;
  background: white;
  
  /* Set up a short transition to trigger the "transitionend" event.*/
  transition: width 0.00001s;
}

#my-element:hover {
  width: 300px;
  height: 300px;
}

JavaScript

var observer = new ResizeObserver(function (entries) {
	var rect = entries[0].contentRect;
  window.info.textContent = rect.width + 'x' + rect.height;
});

observer.observe(window['my-element']);