The resize-observer-polyfill plugin is able to add support for listening to css3 "animation" to change element size?

[wuwhs]

Hi, First of all, thanks for the excellent plugin,I have applied it to my project.In your code,you use "transitionend" to listen for "CSS transition", which causes the size of the element to change, but "animation" may also cause element changes.

  // Subscription to the "Transitionend" event is used as a workaround for
  // delayed transitions. This way it's possible to capture at least the
  // final state of an element.
  document.addEventListener('transitionend', this.onTransitionEnd_);
  window.addEventListener('resize', this.refresh);

For example the following example

There is a element which use css3 animation in my container,

  #tar {
      width: 200px;
      height: 200px;
      background-color: aqua;
      border: 1px solid #ccc;
      animation: changeheight 2s ease-in 1s infinite;
    }

    @keyframes changeheight {
      0% {
        height: 300px;
      }
      50% {
        height: 200px;
      }
      100% {
        height: 300px;
      }
    }

when the inner element height change,then need to update the height of the outer 'iscroll' container, and call the refresh() method.resize-observer-polyfill plugin can't cover this situation. Wish you reply yet,thanks!

[trusktr]

Do browsers have yet an event to listen to in the middle of a transition? If so we can update the polyfill to use that. If not, maybe we can run a requestAnimationFrame loop while a transition is running and poll the element size using that.

[wuwhs]

Do browsers have yet an event to listen to in the middle of a transition? If so we can update the polyfill to use that. If not, maybe we can run a requestAnimationFrame loop while a transition is running and poll the element size using that.

I mean maybe we can perform a height/width change by listening to the DOM element animationend event