Expanding a JavaScript menu with WebDriver

Question

I am trying to click a button on a webpage with WebDriver which uses JavaScript to expand a menu revealing other links:

<div id="menu">
<div id="security_bt" class="advanced_white_close_button" onclick="open_or_close_sub('security');                
security_open++;"><b> <span languageCode = "13">Security</span></b></div>
<div id="advanced_bt" class="advanced_white_close_button" onclick="open_or_close_sub('advanced');     
advanced_open++;"><b><span languageCode = "3011">Advanced Setup</span></b></div>
...etc

I have tried using methods suggested on this site including Xpath and CSS

Browser.Driver.FindElement(By.XPath("//div[@id='advanced_bt']/b/span")).Click();
or
Browser.Driver.FindElement(By.CssSelector("#advanced_bt > b > span")).Click();

and also tried with IJavaScriptExecutor:

            var executor = (IJavaScriptExecutor)webDriver;
        executor.ExecuteScript("arguments[0].click();", element);

Neither have worked. The test does not fail to locate the elements, so I'm out of ideas why the can't be clicked. If anyone can shed any light that would be appreciated. Cheers.

Oh and this is the onclick= code:

function open_or_close_sub(name)
{

var button_name= name+"_bt";
var sub_name= name+"_sub";
var open_flag= top.document.getElementById(sub_name).style.display;

close_all_sub(sub_name);/* fold all menus first, except the menu which user click*/

var button_div = top.document.getElementById(button_name);
var content_length = button_div.getElementsByTagName("span")[0].innerHTML.length;
if( open_flag == "none")
{
    settingClass(button_div, content_length, "advanced_white_open_button", top.region_class.white_triple, top.region_class.white_double);
    top.document.getElementById(sub_name).style.display="";
}
else
{
    settingClass(button_div, content_length, "advanced_white_close_button", top.region_class.white_triple, top.region_class.white_double);
    top.document.getElementById(sub_name).style.display="none";
}
change_menu_height();
}

Subh · Accepted Answer · 2014-12-07 15:55:59Z

1

Try the code below:

Browser.Driver.FindElement(By.Xpath("//div[@id='advanced_bt']//span[.='Advanced Setup']")).Click();

It will click on the 'span element', under div tag with id 'advanced_vt', and having exact innerHTML/text as 'Advanced Setup'

Or try the below code using Actions class:

Actions action  = new Actions(Browser.Driver);
action.MoveToElement(Browser.Driver.FindElement(By.Xpath("//div[@id='advanced_bt']//span[.='Advanced Setup']"))).Click().Perform();

EDIT 07.12.14

In case, that still doesn't work, then using IJavascriptExecutor, set the attribute of the submenu to be visible, and then proceed on taking further actions on the submenu. From the image in the comments, the below code will reveal the submenu under 'Advanced Setup':

 IWebElement element = Browser.Driver.FindElement(By.Xpath("//div[@id='advanced_sub']"));
 var executor = (IJavaScriptExecutor)webDriver;
 executor.ExecuteScript("arguments[0].style.display='block';", element);

edited Dec 7, 2014 at 15:55

answered Dec 5, 2014 at 7:10

Subh

4,4241 gold badge17 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

13 Comments

3lysium Over a year ago

Have tried but it doesn't work, including finding the menu element first then selecting advanced_bt from those elements.

Subh Over a year ago

Do you have to click on some menu first, and then the div having id advanced_bt is visible after that ?

3lysium Over a year ago

advanced_bt is one of a visible list of buttons within <div id="menu">. When clicked each expand their own list of submenu links.

Subh Over a year ago

Is the menu a part of some frame ?

3lysium Over a year ago

There is a topframe and formframe but WebDriver is finding the elements in the formframe (have tried switching to this also). Here is a pic of the page with the Advanced Setup menu expanded if that helps. Cheers. rickkomer.files.wordpress.com/2012/10/netgear_genie3.jpg

|

Collectives™ on Stack Overflow

Expanding a JavaScript menu with WebDriver

1 Answer 1

EDIT 07.12.14

13 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

EDIT 07.12.14

13 Comments

Your Answer

Sign up or log in

Post as a guest

Related