745055 - alertCheck is sized incorrectly when there is long text on the checkbox

Status: REOPENED

(Core :: XUL, defect)

Description

[Mike Kaply [:mkaply]]

Attachment: Screenshot of bug

See attachment.

If you have long text in the checkbox and long text in the prompt, the prompt wraps much sooner than the checkbox making the prompt look very strange.

Comment 1

[Alice0775 White]

Execute the following:

Components.classes["@mozilla.org/embedcomp/prompt-service;1"].getService(Components.interfaces.nsIPromptService).alertCheck(null, "Title of this Dialog", "Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. Hello! You have now been alerted. ",   "And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox And this is a checkbox ", {value: false}); 


Regression window:
Last good:
Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9b3pre) Gecko/2008012904 Firefox/3.0b3pre ID:2008012904
First bad:
Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9b3pre) Gecko/2008013004 Firefox/3.0b3pre ID:2008013004

Bonsai log:
http://bonsai.mozilla.org/cvsquery.cgi?treeid=default&module=all&branch=HEAD&branchtype=match&dir=&file=&filetype=match&who=&whotype=match&sortby=Date&hours=2&date=explicit&mindate=2008-01-29+00%3A00%3A00&maxdate=2008-01-30+06%3A00%3A00&cvsroot=%2Fcvsroot

Comment 2

[Mike Kaply [:mkaply]]

My wager would be

https://bugzilla.mozilla.org/show_bug.cgi?id=244273

Comment 3

[Mike Kaply [:mkaply]]

Yep, that causes it

https://bugzilla.mozilla.org/show_bug.cgi?id=244273#c42

The problem is this code:

#infoContainer {
  max-width: 45em;
}

I assume they are setting a max-width so the auth dialog doesn't look weird.

But if they are going to force a max width on the info container, it needs to be on the checkbox as well.

Comment 4

[Mike Kaply [:mkaply]]

Yeah, here's the fix:

#infoContainer, #checkboxContainer {
  max-width: 45em;
}

Comment 5

[BMO Automation]

Per policy at https://wiki.mozilla.org/Bug_Triage/Projects/Bug_Handling/Bug_Husbandry#Inactive_Bugs. If this bug is not an enhancement request or a bug not present in a supported release of Firefox, then it may be reopened.

Comment 6

[Mike Kaply [:mkaply]]

My fix doesn't work any more because the XUL isn't honoring the max-width parent above.

I still think this is an issue, but taking off my plate.

Comment 7

[Mike Kaply [:mkaply]]

Current recreation scenario:

Services.prompt.alertCheck(
null,
"Title",
"A".repeat(200) + " short prompt text that should wrap nicely within the dialog width when sized correctly.",
"B".repeat(200) + " long checkbox label that should also wrap at the same width as the prompt above it.",
{ value: false }
);

Comment 8

[Mike Kaply [:mkaply]]

For future reference:

diff --git a/toolkit/components/prompts/content/commonDialog.css b/toolkit/components/prompts/content/commonDialog.css
index d811fb62d502..1395fba2aeb4 100644
--- a/toolkit/components/prompts/content/commonDialog.css
+++ b/toolkit/components/prompts/content/commonDialog.css
@@ -25,10 +25,20 @@ dialog[insecureauth] {
   align-self: start;
 }

-#infoContainer {
+#infoContainer,
+#checkbox {
   max-width: 45em;
 }

+#checkbox .checkbox-label-box {
+  min-width: 0;
+}
+
+#checkbox .checkbox-label {
+  white-space: normal;
+  word-break: break-word;
+}
+
 #infoTitle {
   margin-bottom: 1em;
 }