Vlad Lucaci, Desktop QA (:vlucaci) Reporter
	Description • 6 years ago

[1] Documentation for the old Animation Inspector:
https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Work_with_animations#Animation_inspector

STR:
1. Go to the SUMO Animations inspector [1]


Expected result:

- The Animation Inspector SUMO documentation reflects the new implementations of the new feature.

Actual result:

- The Animation Inspector SUMO documentation still refers to the old feature.

	Liz Henry (:lizzard) (relman/hg->git project)
	Comment 1 • 6 years ago

Daisuke, are you going to take this on, or do you know who might work on it? Thanks!

	Liz Henry (:lizzard) (relman/hg->git project)
	Comment 2 • 6 years ago

n-i to Joni as something the support/user doc team might help with. 
(I don't think the user-doc-needed keyword is in active use.)

	Joni Chan
	Comment 3 • 6 years ago

Thanks for n-i'ing me. We don't own the page referenced in comment #1 but maybe Will can point us in the right direction?

We don't have developer content on SUMO as we support general Firefox users.

	Liz Henry (:lizzard) (relman/hg->git project)
	Comment 4 • 6 years ago

Make that MDN content and dev-doc-needed.

	Will Bamberg [:wbamberg]
	Comment 5 • 6 years ago

Let's just make it a dev-docs bug.

	Daisuke Akatsuka (:daisuke)
	Comment 6 • 6 years ago

I'm sorry for delay.
I may not be able to write the whole document though, I'll list up the summary of changes in here later.
Thanks!

	Daisuke Akatsuka (:daisuke)
	Comment 7 • 6 years ago

Hi, I list up the summary.

Different points from previous one:
* Summary graph color
    * CSS Animation
    * CSS Transitions
    * Script Animation
* Animated properties graph color
    * Opacity
    * Transform
    * Other
* Selected color of animation on summary graph
* Use Reps component ( https://github.com/devtools-html/debugger.html/tree/master/packages/devtools-reps )
* CSS Animations/Transitions is editable realtimely on 3 pane inspector
* Full RTL support
* Fixed many of bugs which occur in previous one

No change from previous one, but need to update doc?
* How to understand summary graph
    * duration
    * fill mode
    * iterations
    * delay
    * endDelay
    * effect easing path
    * computed progress
* How to understand animated property graph
    * progress bar
    * keyframes value
    * easing (hover on edge of path)

I will add more items when I remember.