/dev tips

🎊   The Modern DevTools course has now started! Visit ModernDevTools.com to find out more   🎊

(99) Line Level Profiling Extract accessibility information with the Accessibility Inspector (101)

Chrome DevTools: Expose Web Animation API instances from the Animation Inspector

4 Apr 2016
Expose Web Animation API instances from the Animation Inspector

We're on Tip 100 already! Thank you everyone.

You can use the Animation Inspector to export an animation so it can be programmatically controlled via JavaScript. Right click on the animation, and select 'Store as global variable'.

You now have access to temp1 in the Console. This variable represents an instance of the Web Animations API:

temp1.constructor // Animation() { [native code] }

You can access methods and properties of the animation instance such as:

Related: Check out the following tips to better understand how animation tooling works in DevTools:

Sign up to receive a developer tip, in the form of a gif, in your inbox each week.