A feature of the old Styles sidebar that hasn't been implemented in the redesigned styles sidebar yet.
Created attachment 325511 [details]
Created attachment 325512 [details]
[Animated GIF] With patch applied
Besides mouseover/mouseout, the old styles sidebar has code to highlight selectors when focusing on the selector field. This is nearly useless, since there's no way to Tab or Shift-Tab into a selector field, e.g. selector fields don't have appropriate tabIndex and pressing Tab or Shift-Tab when editing properties doesn't move focus away from CodeMirror instances.
In addition to this, highlighting selectors on focus may create a few confusing states:
1. Focus on selector ".foo".
2. Hover over selector ".bar". Should it highlight ".foo" or ".bar"?
3. Move the mouse cursor away from ".bar". Should it highlight ".foo" or nothing?
I think we should keep things simple and only highlight selectors when hovering over them.
Comment on attachment 325511 [details]
View in context: https://bugs.webkit.org/attachment.cgi?id=325511&action=review
> + Use mouseenter/mouseleave events instead of mousein/mouseout (as in the old styles sidebar)
> + to avoid unnecessary events being fired:
> + - mouseenter/mouseleave fires once when the mouse cursor enters/leaves the element.
> + - mousein/mouseout fires every time the mouse cursor enters/leaves the element and any of its children.
I don't think this explanation is necessary, especially since you aren't modifying the old sidebar. Feel free to keep it if you think it adds something though :)
Created attachment 325602 [details]
Comment on attachment 325602 [details]
Clearing flags on attachment: 325602
Committed r224286: <https://trac.webkit.org/changeset/224286>
All reviewed patches have been landed. Closing bug.