Suppose I toggle a class on an element, and this triggers a CSS
transition that lasts
Is there a way to get the computed value of the animated property (or properties) at any point during the animation? If there is more than one way, what is the best way?
I am guessing that I can make a loop with
requestAnimationFrame and continually poll for the computed properties, but I haven’t tested this yet, and plus it feels really hacky in general to be polling for things.
Also, and unfortunately,
MutationObserver doesn’t have a way to observe an element’s computed styling. That may be a nice feature! The MO callback for such a feature would ideally fire right before the following animation loop. I suppose this isn’t any worse than polling, technically, but it may seem less hacky (though, in practice, maybe both are effectively the same, but one is explicit and fires only if a change actually happened, while the other needs to poll in order to determine if a change happened).
I forgot that CSS transitions don’t work with Oh wait, the new CSS Properties and Values API Level 1 allows custom properties to be transitionable!
--custom properties. That puts a huge damper on things.
EDIT: I made a feature request for Houdini on GitHub: https://github.com/w3c/css-houdini-drafts/issues/987