239141 - compassweb.com - Drop down menus on left side of page do not work

Status: RESOLVED INCOMPLETE

(Tech Evangelism Graveyard :: English US, defect)

Description

[Christian]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.6) Gecko/20040206 Firefox/0.8
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.6) Gecko/20040206 Firefox/0.8

On the left side of the pages at http://www.compassweb.com/, the drop down menus
on the left side of the page do not function, but work fine in Internet Explorer.

Reproducible: Always
Steps to Reproduce:
1.go to http://www.compassweb.com/
2.on the left side of the page, attempt to click on "Personal Services",
"Business Services", or "About Compass".

Actual Results:  
Menus did not "drop down" like they are supposed to.

Expected Results:  
Open the menus

Comment 1

[Jeff Walden [:Waldo]]

To the reporter:

This isn't a bug with Firefox/Mozilla but rather a bug with the specific site's
coding.  This is being refiled as a bug for us to check up with the website's
owners regarding making it standards-compliant in this respect, so hopefully
they'll fix it at their end soon.

The rest of the info is for whoever writes the letter to the site's owners to
help them fix the problem.  This is most likely irrelevant to you as reporter
(unless you coded the site), so you can feel free to stop reading here knowing
you've missed nothing personally important to you.

***************************************************************

This is a one-line fix, so it's easy for the site to correct.

The reason for the bug is invalid DOM logic.  The site does a check for whether
the browser's a compliant one like NS6 to fork the code for IE/others, storing
the value in ns6 as true for NS6 and false for not.  This code is okay so far. 
However, then it hits this line to generate a cross-browser reference to the
<span> it wants to unhide:

folder=ns6?curobj.nextSibling.nextSibling.style:document.all[curobj.sourceIndex+1].style

The IE section is fine (for IE), so we'll ignore it.  As ns6 is true, the
section from curobj...style is what's evaluated.  Here's the HTML of the
relevant area for the first expanding menu (compressed to save space, also
removed all menu items but two as two will convey the point):

<!-- Personal Services Header -->
<table width="150" border="0" cellspacing="0" cellpadding="0">
  <tr> 
    <td width="5%" class="sideNavTopSection">&nbsp;</td>
    <td class="sideNavTopSection"><a href="#" style="cursor:pointer;
cursor:hand" onClick="expandme(this)">Personal Services</a></td>
  </tr>
</table>
		
<span style="display:none">
  <!-- Pesonal Services Menu -->
  <table width="150" border="0" cellspacing="0" cellpadding="0">
    <tr> 
      <td class="sideNavSection">&nbsp;</td>
      <td class="sideNavSection"><a href="personal/">Overview</a></td>
    </tr>

    <tr> 
      <td width="5%" class="sideNavSection">&nbsp;</td>
      <td class="sideNavSection"><a href="personal/education/index.cfm">Education 
        Center</a></td>
    </tr>
  </table>
</span>

The Javascript code selects the anchor that's clicked and sends it to the
script.  It's parsed to the variable curobj.  curobj is a DOM node, so by using
the appropriate methods we can access the DOM node of the hidden stuff.  A look
back at that method of reference:

folder=ns6?curobj.nextSibling.nextSibling.style:document.all[curobj.sourceIndex+1].style

The clicked link is the only <a> element in the table cell.  nextSibling only
selects the next element at the specific part of the page's DOM, so there's
nothing left to select.  Another nextSibling is equally useless on a null value,
 and as folder==null, the rest of the script crashes.

The correct string (tested and functional) is this:
folder=ns6?curobj.parentNode.parentNode.parentNode.nextSibling.nextSibling.style:document.all[curobj.sourceIndex+1].style

From the <a> we need to go up the DOM and then over.  The first parentNode
selects the <td>, the second the <tr>, and the third selects <table>.  This *is*
a sibling of the <span> to unhide, so we stop there.  One nextSibling selects
the textNode in between the tags (it's just the blank space), and the next
selects the appropriate <span>.  Finally, style selects the styling of the
element, and everything's good to go.

Comment 2

[Cyrille VIVION]

[bug248549notfixed]

Comment 3

[Chris Lawson (gone)]

INCOMPLETE due to lack of activity since the end of 2009.

If someone is willing to investigate the issues raised in this bug to determine whether they still exist, *and* work with the site in question to fix any existing issues, please feel free to re-open and assign to yourself.

Sorry for the bugspam; filter on "NO MORE PRE-2010 TE BUGS" to remove.