How to access invisible Unordered List element with Selenium WebDriver using Java

Question

This is the HTML code:

<ul id="personalBar">
    <li id="upload" style="display:none;"></li>
    <li id="personal">
        <span class="translate"></span>
        <span id="userName">qaadmin</span>
        <div id="dropDownArrow"></div>
        <ul>
            <li id="pendingActivities" class="translate" onclick="eCommon.helper.viewAllPendingActivities()" translatekey="MANAGE_STORE">Manage Store</li>
            <li class="translate" onclick="eCommon.helper.outSourceViewReports()" translatekey="UM_REPORT_MENU">Reports</li>
            <li id="learnMore" class="translate" onclick="eCommon.helper.outSourceLearnMore()" translatekey="BANNER_THIRD_MSG">Learn more about einstein™</li>
            <li id="DownloadEinstein" class="translate" onclick="eCommon.helper.outSourceLearnMore()" translatekey="BANNER_FOURTH_MSG">Download the einstein™ World app.</li>
            <li class="translate" onclick="location.reload();" translatekey="CREATE_EINSTEIN_ACIVITIES">Create einstein™ Activities</li>
            <li class="translate" onclick="eCommon.helper.outSourceGetEinsteinActivities()" translatekey="GET_EINSTEIN_ACTIVITIES">Get einstein™ Activities</li>
            <li class="translate" onclick="eCommon.helper.outSourceManageYourEinsteinAccount()" translatekey="MANAGE_YOUR_EINSTEIN_ACCOUNT">Manage your einstein™ Account</li>
            <li id="logOut" class="translate" onclick="am.UserManagement.doLogOut(false)" translatekey="LOGOUT">Logout</li>
        </ul>
    </li>
</ul>  

The amount of items in the list varies according to users privileges so each element number in the list is not fixed.

The list is normally closed and it is opened only by clicking on it. So:

Select dropdown = new Select(driver.findElement(By.id("personalBar")));
dropdown.selectByVisibleText("Get einstein™ Activities");  

Presents error:

org.openqa.selenium.support.ui.UnexpectedTagNameException: Element should have been "select" but was "ul"

When trying this:

driver.findElement(By.xpath("//li[contains(text(),'Manage your einstein™ Account')][@class='translate']")).click();  

It fails with:

org.openqa.selenium.ElementNotVisibleException: Element is not currently visible and so may not be interacted with

Answer 1

Following should help -

driver.findElement(By.id("personal")).findElement(By.id("dropDownArrow")).click();  
driver.findElement(By.xpath("//li[contains(text(),'Manage your einstein™ Account')][@class='translate']")).click();  

Answer 2

First of all, you cannot approach ul -> li with the Select abstraction - it was designed to work with select -> option.

You second approach fails since you first need to click on ul to open up the list:

WebElement personalList = driver.findElement(By.cssSelector("ul#personalBar li#personal ul"));
personalList.click();

personalList.findElement(By.xpath("//li[contains(text(),'Manage your einstein™ Account')][@class='translate']")).click();  

This is the general idea - first open up the list, then click an item - I might not be accurate in the code and details since I cannot reproduce the problem and test the proposal.

Answer 3

If there are three cascading divs then the code to locate works like this:

First locate main div by id BodyContainer then locate unordered list by id connectionParent then locate list by id divAddNewGroup_0 then locate my required button(+) using By.xpath:

driver.findElement(By.id("BodyContainer"))
      .findElement(By.id("connectionParent"))
      .findElement(By.id("divAddNewGroup_0"))
      .findElement(By.xpath("//*[@id='divAddNewGroup_0']/span[1]/i"))
      .click();