How to debug css3 animations?

Question

JavaScript

I can ask a non-standard question, but in my case it is very relevant. With standard animations through cycles, intervals or native ones like requestAnimationFrame and all sorts of simplifying layers, frameworks like jQuery, it’s clear how to do it. Breakpoints in the debugger.
And here's what to do in the case when a bunch of animations are running, where javascript only sets the order by setting the end positioned point in the styles. The situation is such that there was an out of sync, and I already broke my brain in search of a crept in bug (after all, this is complicated by the onmouseover event model and a bunch of conditions). Here I can not stop the animation in the middle and dig deeper.
Yes, I don't have enough experience in bug-picking through Source Google Chrome or Firebug for Firefox, however, no problem has ever caused me so much trouble.
I need advice and guidance. The bug code, by the way, is not mine.

Answer 1

Try the beta version of chrome , there seems to be tools for this:
In FF, similar tools have also recently appeared specifically for animation.

Answer 2

your case
, but I don’t know how to debug css animation at all