32099 - scrolling tree of multi-column select widgets causes scrambling

Status: VERIFIED WONTFIX

(SeaMonkey :: UI Design, defect, P3)

Description

[Stephen P. Morse]

Consider the xul content shown below.  It displays a two-column tree of select 
widgets numbered 1-left, 1-right, 2-left etc.  The initial display is as 
follows:

   1-left  1-right
   2-left  2-right
   3-left  3-right
   4-left  4-right
   5-left  5-right
   6-left  6-right

Scroll the tree down by clicking on the down arrow at the bottom of the scroll 
bar.  The display is now

   7-right 2-right
   3-left  3-right
   4-left  4-right
   5-left  5-right
   6-left  6-right
   7-left

Note that 7-right wound up in the top left entry instead of the bottom right.

Here's the xul content:

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://wallet/skin/" type="text/css"?>
<?xul-overlay href="chrome://global/content/dialogOverlay.xul"?>
<!DOCTYPE window SYSTEM "chrome://wallet/locale/SignonViewer.dtd" >

<window id="walletpreview"
        title="&windowtitle.label;"
        xmlns:html="http://www.w3.org/TR/REC-html40"
        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        align="vertical"
        class="dialog">

  <box align="vertical">
    <tree class="inset" style="height: 280px; width: 440px;" align="vertical">
      <treecol width="50%"/>
      <treecol width="50%"/>
      <treechildren>
        <treeitem>
          <treerow>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 1a left</html:option>
                <html:option value="2">line 1b left</html:option>
                <html:option value="3">line 1c left</html:option>
              </html:select>
            </treecell>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 1a right</html:option>
                <html:option value="2">line 1b right</html:option>
                <html:option value="3">line 1c right</html:option>
              </html:select>
            </treecell>
          </treerow>          
        </treeitem>
        <treeitem>
          <treerow>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 2a left</html:option>
                <html:option value="2">line 2b left</html:option>
                <html:option value="3">line 2c left</html:option>
              </html:select>
            </treecell>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 2a right</html:option>
                <html:option value="2">line 2b right</html:option>
                <html:option value="3">line 2c right</html:option>
              </html:select>
            </treecell>
          </treerow>          
        </treeitem>
        <treeitem>
          <treerow>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 3a left</html:option>
                <html:option value="2">line 3b left</html:option>
                <html:option value="3">line 3c left</html:option>
              </html:select>
            </treecell>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 3a right</html:option>
                <html:option value="2">line 3b right</html:option>
                <html:option value="3">line 3c right</html:option>
              </html:select>
            </treecell>
          </treerow>          
        </treeitem>
        <treeitem>
          <treerow>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 4a left</html:option>
                <html:option value="2">line 4b left</html:option>
                <html:option value="3">line 4c left</html:option>
              </html:select>
            </treecell>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 4a right</html:option>
                <html:option value="2">line 4b right</html:option>
                <html:option value="3">line 4c right</html:option>
              </html:select>
            </treecell>
          </treerow>          
        </treeitem>
        <treeitem>
          <treerow>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 5a left</html:option>
                <html:option value="2">line 5b left</html:option>
                <html:option value="3">line 5c left</html:option>
              </html:select>
            </treecell>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 5a right</html:option>
                <html:option value="2">line 5b right</html:option>
                <html:option value="3">line 5c right</html:option>
              </html:select>
            </treecell>
          </treerow>          
        </treeitem>
        <treeitem>
          <treerow>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 6a left</html:option>
                <html:option value="2">line 6b left</html:option>
                <html:option value="3">line 6c left</html:option>
              </html:select>
            </treecell>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 6a right</html:option>
                <html:option value="2">line 6b right</html:option>
                <html:option value="3">line 6c right</html:option>
              </html:select>
            </treecell>
          </treerow>          
        </treeitem>
        <treeitem>
          <treerow>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 7a left</html:option>
                <html:option value="2">line 7b left</html:option>
                <html:option value="3">line 7c left</html:option>
              </html:select>
            </treecell>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 7a right</html:option>
                <html:option value="2">line 7b right</html:option>
                <html:option value="3">line 7c right</html:option>
              </html:select>
            </treecell>
          </treerow>          
        </treeitem>
        <treeitem>
          <treerow>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 8a left</html:option>
                <html:option value="2">line 8b left</html:option>
                <html:option value="3">line 8c left</html:option>
              </html:select>
            </treecell>
            <treecell>
              <html:select size="3">
                <html:option value="1">line 8a right</html:option>
                <html:option value="2">line 8b right</html:option>
                <html:option value="3">line 8c right</html:option>
              </html:select>
            </treecell>
          </treerow>          
        </treeitem>
      </treechildren>
    </tree>
  </box>

</window>

Comment 1

[Stephen P. Morse]

I think the answer to bugs 32090, 32095, 32097, and 32099 are all going to be 
that <select> and <option> are being deprecated in favor of <menulist>, 
<menupopup> and <menuitem>.  I've started playing with them and it appears that 
they don't exhibit any of the problems reported in these reports.

Comment 2

[Paul MacQuiddy]

spam: qa contact to [e-mail]

Comment 3

[don]

Steve, is this work for you or for Ben?

Comment 4

[Stephen P. Morse]

I've already switched to <menulist> in my xul files so I am not bothered by this 
bug.  I didn't fix the bug however -- it still exists for <select> and I'm 
certainly not going to fix that.

So I'm reassigning this back to you.  If you chose not to fix it because you are 
deprecating <select>, that would be a perfectly reasonable thing to do (and one 
that I suggested in my comments above).

Comment 5

[don]

OK, thanks.  Hyatt says that <select> is deprecated so I'm marking this WONTFIX.

Comment 6

[John Morrison]

verified wontfix