Bug 44267 - Web Inspector: display :hover and :active styles in the styles sidebar.
: Web Inspector: display :hover and :active styles in the styles sidebar.
Status: RESOLVED FIXED
Product: WebKit
Classification: Unclassified
Component: Web Inspector (Deprecated)
: 528+ (Nightly build)
: All All
: P2 Normal
Assigned To: Nobody
:
Depends on:
Blocks:
  Show dependency treegraph
 
Reported: 2010-08-19 08:33 PDT by Pavel Feldman
Modified: 2011-09-06 08:28 PDT (History)
10 users (show)

See Also:


Attachments
[IMAGE] Firebug's way (21.45 KB, image/png)
2010-08-19 08:34 PDT, Pavel Feldman
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Pavel Feldman 2010-08-19 08:33:25 PDT
Firebug allows triggering the state it is showing styles for (drop-down arrow on the 'Styles' tab). We should do something similar.
Comment 1 Pavel Feldman 2010-08-19 08:34:35 PDT
Created attachment 64856 [details]
[IMAGE] Firebug's way
Comment 2 Alexander Pavlov (apavlov) 2010-08-19 08:41:33 PDT
The FireBug's approach does not allow e.g. "hovering" over a selected element's ancestor to trigger complex selectors (e.g. "div#btn1:hover span.title" when the SPAN element is selected), which is sometimes the thing that's actually needed.
Comment 3 Adam 2010-08-20 14:01:03 PDT
If you inspect an anchor, then mouse over it, it doesn't even update on the style list period let alone an option to turn it on.

In Firebug it shows up and disappears entirely when you mouse out, so you don't even know if there is a hover element on it.

It could be implemented better than the method Firebug uses.  If an element has a :hover pseudo element, it should always list it active or not so you realized it's even there, but when not active, it should be crossed out, or maybe crossed out and the section greyed out since it's not even available at the time.  Listed directly above the inherited elements.
Comment 4 Alexander Pavlov (apavlov) 2011-09-06 08:28:49 PDT
pfeldman@chromium.org has implemented this functionality in the Firebug-like way.