There is a nifty feature in Chrome's Developer Tools which allows you to pause animations and control their speed, but the problem is they're mouse-controlled buttons. Sometimes I need to pause an animation without actually moving the mouse cursor to inspect something inside a hover-activated animation, so I can't really use the pause button. Is there a keyboard shortcut for that animation pause button so I don't need to move the cursor off whatever I'm doing?
You can trigger animation with "Toggle Element State" option, or from JavaScript in console, without using mouse. Also, once you're in debugger; mode, inspecting should not trigger events.
(general info about debugging animations)
https://developers.google.com/web/tools/chrome-devtools/inspect-styles/animations
You can create breakpoints every frame, or every couple of frames.