1252008 - Box model does not resize properly in Nightly 47.0a1 (2016-02-28)

Status: RESOLVED FIXED

(DevTools :: Inspector, defect, P1)

Description

[johngraciliano]

User Agent: Mozilla/5.0 (Windows NT 6.2; Win64; x64; rv:47.0) Gecko/20100101 Firefox/47.0
Build ID: 20160228030239

Steps to reproduce:

1. Start Developer Tools; select Inspector; select Box Model. (Best if the tools are displayed in the bottom of the page).
2. Resize the Tools large enough to make sure the large version of the box model is shown.
3. Slowly resize the Tools making the bottom panel smaller.



Actual results:

The bottom of the box model will be hidden before it resizes to the shorter version.  This happens to the point that the bottom margin number is completely hidden.


Expected results:

The box show switch to the shorter version at least as soon as it touches the bottom of the view port.

Comment 1

[johngraciliano]

Correction: This only makes sense when the tools are displayed at the bottom of the page.

Due to changes in the developer tools the Inspector toolbar is part of the view port where the box model is shown.  Because of this, in chrome://devtools/skin/layout.css, the lines:
  @media (max-height: 228px) {...}
should be replaced with:
  @media (max-height: 252px) {...}
to allow 24px for the toolbar.

I am unclear if hiding the bottom of the box model should be addressed as a problem when the tools are presented as a side bar.  I know it may happen, but probably it should not be called a bug.  After all that is always possible when the tools height is small enough.

Comment 2

[johngraciliano]

Correction to the correction:
When the tools are dock to the side, the box model would still resize to a smaller size when needed in versions of Firefox prior to 47.0a1. This does not happen at all in 47.0a1 because the view port for which the height is considered is the that for the whole inspector tool, thus it is almost the height of the full sidebar (minus the height of the developer tools toolbar, I believe).  Since this would be almost the size of the browser window, it would be hard to meet the condition (max-height: 228px) or even (max-height: 252px).  With the recent changes, a different strategy may be needed if the re-size is desired when the tools are dock to the side of the browser window.

Comment 3

[Patrick Brosset <:pbro>]

If I understand correctly, there are 2 problems being described here:

1 - when docked at the bottom, there's a point at which the bottom margin area is hidden, right before the box-model diagram switches to its more compact size. As noted in comment 1, this seems like an easily addressable media-query issue,

2 - when docked at the side (and if the box-model view is displayed at the bottom, below the markup-view), then it's nearly impossible to make it switch to its compact size because the media-query is now relative to the full height of the inspector.

Both problems stem from bug 1238133 which removed the iframes we previously used to wrap each of the sidebar panel individually.

We can easily adjust the media-query to fix problem 1, but problem 2 will persist. Although it's probably not as bad, considering that when displayed on the side, the tools have often more room to breath.
In any case, I believe we at least need to add this to the tabpanel that contains the box-model view:
#sidebar-panel-layoutview { overflow-y: auto; }
so there's never a part of the view that's hidden and can't be access with a scrollbar.

@gl: do you have some time to look at this?

Comment 4

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: 1252008.patch

https://treeherder.mozilla.org/#/jobs?repo=try&revision=93bf89129a4e

Comment 5

[Patrick Brosset <:pbro>]

Comment on attachment 8725850 [details] [diff] [review]
1252008.patch

Review of attachment 8725850 [details] [diff] [review]:
-----------------------------------------------------------------

Thanks Gabriel!

Comment 6

[Pulsebot]

https://hg.mozilla.org/integration/fx-team/rev/71ffbfce853a

Comment 7

[Wes Kocher (:KWierso) (Not reading bugmail; email directly if needed)]

That test is still failing, so I'm backing out everything from that original push:
https://hg.mozilla.org/integration/fx-team/rev/a328633a812b

Comment 8

[Pulsebot]

https://hg.mozilla.org/integration/fx-team/rev/3a8630991a09

Comment 9

[Carsten Book [:Tomcat]]

https://hg.mozilla.org/mozilla-central/rev/3a8630991a09

Comment 10

[Kazi Nuzhat Tasnem]

I have reproduced this bug with Firefox nightly 47.0a1(build ID:20160228030239)on
windows 7(64 bit)

I have verified this bug as fixed with Firefox nightly 48.0a1(build ID:20160421030302)
User Agent:Mozilla/5.0 (Windows NT 6.1; WOW64; rv:48.0) Gecko/20100101 Firefox/48.0

[bugday-20160504]