291718 - The "visibility: collapse" and collapsed="true" don't work as "visibility: hidden"

Status: VERIFIED INVALID

(Core :: XUL, defect)

Description

[Sergiu Dumitriu]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.7) Gecko/20050414 Firefox/1.0.3
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.7) Gecko/20050414 Firefox/1.0.3

The "visibility: collapse" CSS property should act like "visibility: hidden".
From the W3C CSS Recommendation [http://www.w3.org/TR/CSS21/visufx.html#visibility]:

"hidden: The generated box is invisible (fully transparent, nothing is drawn),
but still affects layout. Furthermore, descendents of the element will be
visible if they have 'visibility: visible'."

Still, setting the "visibility: collapse" to a XUL element completely hides that
element and all inner content. Setting "visibility: visible" on a child element
has no effect.

Since the collapsed="true" attribute is the same as "visibility: collapse", the
expected result should be the same as setting the "visibility: collapse" style,
as in the CSS specification, but still everything is hidden.

Working with "visibility: hidden" gets the expected results, as specified in the
CSS Recommendation.

In the following example all the buttons should be invisible, but the labels
should appear centered in a larger white space, like the first one. The actual
result is that all dashes are one after another.

<window title="Collapsed test"
        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
id="wnd">
  <label>---</label>
  <button style="visibility: hidden;">
    <label style="visibility: visible;">Button</label>
  </button>
  <label>---</label>
  <button style="visibility: collapse;">
    <label style="visibility: visible;">Button</label>
  </button>
  <label>---</label>
  <button collapsed="true">
    <label collapsed="false">Button</label>
  </button>
  <label>---</label>
  <button collapsed="true">
    <label style="visibility: visible;">Button</label>
  </button>
  <label>---</label>
</window>

Expected result:
-------------------------
|---                    |
|        Button         |
|---                    |
|        Button         |
|---                    |
|        Button         |
|---                    |
|        Button         |
|---                    |
-------------------------


Actual result:
-------------------------
|---                    |
|        Button         |
|---                    |
|---                    |
|---                    |
|---                    |
-------------------------

Reproducible: Always

Steps to Reproduce:
1. Set the style="visibility: collapse;" attribute to a XUL element (element1).
2. Set the style="visibility: visible;" attribute to a child XUL element
(element2 child of element1).
3. Open the XUL file.

Actual Results:  
element1 is completely hidden and takes no place in the layout. element2 doesn't
show up.

Expected Results:  
There should be a blank space exactly the size of element1. element2 should be
visible.

Comment 1

[Sergiu Dumitriu]

Attachment: Bug testcase

Comment 2

[Boris Zbarsky [:bzbarsky]]

The behavior is "right".  Collapse is not the same as hidden for boxes with
certain display values.  Those values include some table-related values and some
-moz-box-* values that XUL uses.  As in, XUL boxes are not exactly CSS boxes and
don't follow quite the same rules.