1246195 - Find a better home for the animation inspector panel

Status: NEW

(DevTools :: Inspector: Animations, defect, P3)

Description

[Patrick Brosset <:pbro>]

Attachment: animation-panel-sidebar.png

Currently, the animation-inspector is a panel displayed in the inspector's sidebar (just like the css rules, computed, layout, fonts).
See the attached screenshot for the various ways it currently looks like today.

- Pros

you can see both the DOM tree and the animation panel at the same time, which is important because what you see in the panel depends on which node is currently selected.

- Cons

  - there are 5 sidebar panels, and depending on the size of the sidebar, the animation panel might not be visible at first
  - you can’t see the content of the "Rules" sidebar panel at the same time, which you might want to do (in order to see the animation/transition css properties and the @keyframes rules)
  - the sidebar is usually narrow, whereas the timeline requires a lot of horizontal space, forcing the user to resize the sidebar

Ideally, it’d be nice to have more room for this panel, but still be able to see both the markup and rules at the same time, and keeping in mind that we already have the split-console at the bottom which might be open.

Comment 1

[Patrick Brosset <:pbro>]

Filter on CLIMBING SHOES