614865 - Addon about window does not handle overflow very well

Status: VERIFIED FIXED

(Toolkit :: Add-ons Manager, defect)

Description

[Josh Tumath]

User-Agent:       Mozilla/5.0 (Windows NT 6.1; WOW64; rv:2.0b8pre) Gecko/20101125 Firefox/4.0b8pre
Build Identifier: 

If an addon has a very long title or has a lot of contributors credited, there are some issues in the addon about window that prevent all of the text from being seen. These issues can also distort the window.

To reproduce this, view the about window for Firebug and one of the Mozilla Labs Prospector addons.

Reproducible: Always

Comment 1

[Henrik Skupin [:whimboo][⌚️UTC+1]]

So you say, you don't see any scrollbars? Can you please attach a screenshot?

Comment 2

[Josh Tumath]

Attachment: Addon with many people credited

I do see scrollbars, but the problem is not in the scrollbars; it's in the fact that the scrollbars are in the way of the content. Sorry, I should have uploaded a screenshot in the first place.

Comment 3

[Josh Tumath]

Attachment: Addon with a very long name

Comment 4

[Henrik Skupin [:whimboo][⌚️UTC+1]]

Ok, I see. Same on OS X for both of those extensions. Dave, something we should block on? It's not primary ui but seems to be that this window doesn't layout content very well.

Comment 5

[Dave Townsend [:mossop]]

How did this behave on Firefox 3.6?

Comment 6

[Blair McBride [:Unfocused] (UNAVAILABLE)]

(In reply to comment #5)
> How did this behave on Firefox 3.6?

It stretched the dialog until all the text fitted. Which in some cases meant that the dialog was larger than the screen.

Comment 7

[Blair McBride [:Unfocused] (UNAVAILABLE)]

Attachment: Patch v1

Makes the addon name wrap if its too long. The icon was acting weird with max-height when the name wrapped, so its in its own container now. And a call to sizeToContent() because xul:dialog is stupid.

The weird scrolling issue with Firebug's about dialog is due to Firebug overlaying its own stylesheet for about.xul - probably in order to fix the issue described in comment 6. If you disable Firebug, and open its about dialog, you'll see that it works fine. I could potentially rename the CSS classes used in the dialog, but a better solution is for Firebug to not style the about dialog in 4.0 (or at least style in a way that doesn't break things).

Comment 8

[Dave Townsend [:mossop]]

Comment on attachment 494637 [details] [diff] [review]
Patch v1

>diff --git a/toolkit/mozapps/extensions/content/about.xul b/toolkit/mozapps/extensions/content/about.xul
>--- a/toolkit/mozapps/extensions/content/about.xul
>+++ b/toolkit/mozapps/extensions/content/about.xul
>@@ -54,20 +54,22 @@
>   <script type="application/javascript" src="chrome://mozapps/content/extensions/about.js"/>
>   <script type="application/javascript" src="chrome://global/content/contentAreaUtils.js"/>
> 
>   <stringbundleset id="aboutSet">
>     <stringbundle id="extensionsStrings" src="chrome://mozapps/locale/extensions/extensions.properties"/>
>   </stringbundleset>
> 
>   <vbox id="clientBox" flex="1">
>-    <hbox class="basic-info" align="center">
>-      <image id="extensionIcon"/>
>-      <vbox>
>-        <label id="extensionName" crop="end"/>
>+    <hbox class="basic-info">
>+      <vbox pack="center">
>+        <image id="extensionIcon"/>
>+      </vbox>

Not really sure that these changes are necessary are they?

Otherwise r+

Comment 9

[Blair McBride [:Unfocused] (UNAVAILABLE)]

(In reply to comment #8)
> >+    <hbox class="basic-info">
> >+      <vbox pack="center">
> >+        <image id="extensionIcon"/>
> >+      </vbox>
> 
> Not really sure that these changes are necessary are they?

Without the extra container box around the image, I had some layout issue where the parent box's height was dependent on the image's max-height. 

Could I get a blocking+ on this? (or failing that, a+?) See comment 3 for how it breaks without this patch.

Comment 10

[Blair McBride [:Unfocused] (UNAVAILABLE)]

https://hg.mozilla.org/mozilla-central/rev/88fee6b520bb

Might be useful to have a Litmus test with a long-named addon.

Comment 11

[Henrik Skupin [:whimboo][⌚️UTC+1]]

Blair, at least what I can see on OS X the scrollbars in the about window aren't shown correctly. There is no bar to drag. Is that intended?

Comment 12

[Blair McBride [:Unfocused] (UNAVAILABLE)]

Could you attach a screenshot?

Comment 13

[Henrik Skupin [:whimboo][⌚️UTC+1]]

Attachment: screenshot (empty scrollbar)

Comment 14

[Blair McBride [:Unfocused] (UNAVAILABLE)]

Ah, that's Firebug's fault for breaking things. See the second part of comment 7:

> The weird scrolling issue with Firebug's about dialog is due to Firebug
> overlaying its own stylesheet for about.xul - probably in order to fix the
> issue described in comment 6. If you disable Firebug, and open its about
> dialog, you'll see that it works fine. I could potentially rename the CSS
> classes used in the dialog, but a better solution is for Firebug to not style
> the about dialog in 4.0 (or at least style in a way that doesn't break things).

Comment 15

[Henrik Skupin [:whimboo][⌚️UTC+1]]

Makes sense. Thanks for pointing it out. I missed that comment. Verified fixed with Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:2.0b8pre) Gecko/20101212 Firefox/4.0b8pre

(In reply to comment #10)
> Might be useful to have a Litmus test with a long-named addon.

Blair, the only manual test we would need here is for wrapping a long extension name? Or do we also need to verify the scrollbars?

Comment 16

[Blair McBride [:Unfocused] (UNAVAILABLE)]

(In reply to comment #15)
> Blair, the only manual test we would need here is for wrapping a long extension
> name? Or do we also need to verify the scrollbars?

Just the long addon name.

Comment 17

[Henrik Skupin [:whimboo][⌚️UTC+1]]

(In reply to comment #16)
> Just the long addon name.

Ok. Created a sample extension for that case, which can for now be found at:
http://mozilla.hskupin.info/aom/extensions/long-name.xpi

Comment 18

[Henrik Skupin [:whimboo][⌚️UTC+1]]

Litmus test has been updated:
https://litmus.mozilla.org/show_test.cgi?id=10148