Unable to click on the drop down

[San]

Hi 

I have two drop downs, one I'm able to click and the other one I'm unable to click, have copied the HTML and xpath used for both working and non working one. Using Firefox 10, Selenium version 25. Any help would be highly appreciated.

xpath used: //span[@label="selLanguage"]//div[@ class="jsx30select_display" ]

HTML of working drop down:

<span id="_jsx_0_t" class="jsx30select_select" style="position:relative;display:inline-block;width:248px;height:20px;padding:0px 0px 0px 0px;border-top:solid 1px #a6a6af;border-right:solid 1px #e6e6e6;border-bottom:solid 1px #e6e6e6;border-left:solid 1px #a6a6af;color:#000000;background-image:url(http://172.20.29.67:8088/tecnotree/GI/JSX/images/select/arrow.gif);background-repeat:no-repeat;background-position:right 0px;cursor:pointer;" jsxtabindex="4" tabindex="4" onmousedown="jsx3.dl(event,this,'Fo',0);" onkeydown="jsx3.dl(event,this,'NQ',0);" jsxtype="Select" label="selLanguage">

<div class="jsx30select_display" style="position:relative;display:inline-block;width:229px;height:20px;padding:0px 19px 0px 0px;" jsxtype="Display">

<div class="jsx30select_text" style="position:relative;display:inline-block;width:226px;height:18px;padding:2px 0px 0px 3px;font-family:jsx3.gui.Block.DEFAULTFONTNAME;font-size:10px;font-weight:jsx3.gui.Block.FONTNORMAL;color:#000000;" jsxtype="Text">English</div>

</div>

</span>

XPath used: //span[@label='cboBillCycle']//div[@class='jsx30select_display']

HTML of non working drop down:

<span id="_jsx_0_3h" class="jsx30select_select" style="position:relative;display:inline-block;width:298px;height:16px;padding:0px 0px 0px 0px;border-top:solid 1px #a6a6af;border-right:solid 1px #e6e6e6;border-bottom:solid 1px #e6e6e6;border-left:solid 1px #a6a6af;color:#000000;background-color:#FDFBC8;background-image:url(http://172.20.29.67:8088/tecnotree/GI/JSX/images/select/arrow.gif);background-repeat:no-repeat;background-position:right 0px;cursor:pointer;" jsxtabindex="0" tabindex="0" onmousedown="jsx3.dl(event,this,'Fo',0);" onkeydown="jsx3.dl(event,this,'JF',0);" onfocus="jsx3.dl(event,this,'Vl',0);" jsxtype="Select" label="cboBillCycle">

<div class="jsx30select_display" style="position:relative;display:inline-block;width:279px;height:16px;padding:0px 19px 0px 0px;" jsxtype="Display">

<div class="jsx30combo" style="position:relative;">

<input class="jsx30combo_text" style="position:relative;display:inline-block;width:278px;height:16px;padding:0px 0px 0px 4px;border-top:0px;border-right:solid 1px #c8c8d5;border-bottom:0px;border-left:0px;font-family:jsx3.gui.Block.DEFAULTFONTNAME;font-size:10px;font-weight:jsx3.gui.Block.FONTNORMAL;color:#000000;background-color:#FDFBC8;" onblur="jsx3.dl(event,this,'KW',3);" jsxtype="Text" value="" jsxtabindex="0" tabindex="0"/>

</div>

</div>

</span>

[San]

Hi,

The other observation I made on both the dropdowns is, the one which is non-editable works fine but the editable one I'm unable to click on it to open the drop down options. 

Is this a bug in Webdriver or am I doing any mistake here. Please let me know if you need any more inputs

regards,

San

[darrell]

First, it could be that both xpath are technically incorrect but one is working for the wrong reasons. In other words, don't assume the problem is the one which is not working.

Second, if you are using attributes to select something, why not use CSS selectors? They should be faster and you should be able to get help from developers. I have found more developers are CSS knowledgeable than they are xpath knowledgeable.

When a user clicks the 'menu', what is taking the event? On the screen I will see one item. In the DOM there are spans, divs, inputs, etc. The first example (working) does not have an input tag. The second example (not working) does have an input tag. Should you be clicking the span? The div? Do you need to click the input for the second example?

For the first example I would use CSS selector "span[label='selLanguage']>div.jsx30select_display". Even if I wanted to stick to xpath I would use "//span[@label='selLanguage']/div[contains(@class,'jsx30select_display')]". This assumes the div is immediately under the span. Using the // between the span and div could be causing you problems.

The second example should then be "//span[@label='cboBillCycle']/div[contains(@class,'jsx30select_display')]" but this does not address the idea that you shouldn't be clicking the div. I'd talk to the developer. If that isn't possible I'd try clicking the span and I'd try clicking the input to see what the difference is.

Finally, if you are clicking the first one to select the "English" language, why not use an xpath which finds the div with text()='English'? In other words, if you insist on using xpath, click on the same thing the user will be 'seeing' on the screen.

Darrell