Bug 49303 – Web Inspector: Gear menu floats to right edge and expands to bottom of "Styles" section

• Component: Web Inspector (Deprecated)
• Status: RESOLVED FIXED

[Matt Lilek]

Created attachment 73463 [details]
Screenshot

When you make the right sidebar in the Elements panel its minimum width, the gear menu in the "Styles" section floats below the grey header bar and expands vertically all the way to the end of the section.  This is really annoying as it blocks about 25px of content in an already cramped area.  This is technically a regression from the Inspector that shipped in Safari 5.0.2.

[Matt Lilek]

Actually, looking at this more, I realized that the "Show Inherited" checkbox is also bumped down from the "Computed Style" line.  It didn't even click that it didn't belong with the "Styles" bar.  This is bad.  That should never happen.  Why is that checkbox even shown all of the time now?  What was wrong with the way it was in Safari 5's inspector where it was only shown when the computed style section was expanded?  Clicking it does nothing if you're not looking at computed styles.  That makes no sense.

[Pavel Feldman]

(In reply to comment #1)
> Actually, looking at this more, I realized that the "Show Inherited" checkbox is also bumped down from the "Computed Style" line.  It didn't even click that it didn't belong with the "Styles" bar.  This is bad.  That should never happen.  Why is that checkbox even shown all of the time now?  What was wrong with the way it was in Safari 5's inspector where it was only shown when the computed style section was expanded?  Clicking it does nothing if you're not looking at computed styles.  That makes no sense.

I disagree, it makes total sense for the discoverability.

[Matt Lilek]

(In reply to comment #2)
> (In reply to comment #1)
> > Actually, looking at this more, I realized that the "Show Inherited" checkbox is also bumped down from the "Computed Style" line.  It didn't even click that it didn't belong with the "Styles" bar.  This is bad.  That should never happen.  Why is that checkbox even shown all of the time now?  What was wrong with the way it was in Safari 5's inspector where it was only shown when the computed style section was expanded?  Clicking it does nothing if you're not looking at computed styles.  That makes no sense.
> 
> I disagree, it makes total sense for the discoverability.

Then it should do something (expand "Computed Styles") when you click it.  It's incredibly awkward to have a checkbox there that appears to do nothing unless you happen to have that section expanded.

I still think the previous behavior is better though.  If its not checked by default then it shouldn't have such a prominent place in the UI.

(This discussion should probably continue in another bug before this gets too sidetracked from the wandering gear menu.)

[Pavel Feldman]

Created attachment 73471 [details]
[PATCH] Proposed change.

It makes labels go on top of each other when I reduce width to minimal, but that's better than wrapping.

[Pavel Feldman]

> Then it should do something (expand "Computed Styles") when you click it.  It's incredibly awkward to have a checkbox there that appears to do nothing unless you happen to have that section expanded.
> 

I agree that it belongs to the internals of the computed style section. There is a plan to convert sections to tabs, so it'll get fixed there since there should be no checkboxes on the tab headers.

[WebKit Commit Bot]

Comment on attachment 73471 [details]
[PATCH] Proposed change.

Clearing flags on attachment: 73471

Committed r71762: <http://trac.webkit.org/changeset/71762>

[WebKit Commit Bot]

All reviewed patches have been landed.  Closing bug.