Selenium Drop Down Box

Question

I'm trying to automate account registration using Selenium java and I'm having troubles clicking a drop down menu on the registration. I want it to click the secret question drop down and select "Who is your favorite author?". Here is the html code.

<div class="clear input_wrapper_bg">
    <div class="name_field">
        <label for="SecretQuestion">Secret Question</label>
    </div>
    <div class="select_field">
        <div class="select2-container" id="s2id_SecretQuestion">
            <a href="#" onclick="return false;" class="select2-choice" tabindex="-1"><span>What is your mother's maiden name?</span><abbr class="select2-search-choice-close" style="display:none;"></abbr>
            <div>
                <b></b>
            </div>
            </a>
            <div class="select2-drop select2-with-searchbox select2-drop-active select2-offscreen" style="display: block;">
                <div class="select2-search">
                    <input type="text" autocomplete="off" class="select2-input select2-focused">
                </div>
                <ul class="select2-results">
                </ul>
            </div>
        </div>
        <select data-val="true" data-val-required="The Secret Question field is required." id="SecretQuestion" name="SecretQuestion" style="display: none;">
            <option value="What is your mother's maiden name?">What is your mother's maiden name?</option>
            <option value="What was your high school mascot?">What was your high school mascot?</option>
            <option value="Who is your favorite author?">Who is your favorite author?</option>
            <option value="What was the name of your first pet?">What was the name of your first pet?</option>
        </select>
        <div class="error_msg">
            <span class="field-validation-valid" data-valmsg-for="SecretQuestion" data-valmsg-replace="true"></span>
        </div>
    </div>
</div>

I have tried using

 new Select(driver.findElement(By.id("s2id_SecretQuestion"))).selectByVisibleText("Who is your favorite author?");

But it doesn't work because when I click the drop down menu it adds some more html code at the bottom of the page.

<div class="select2-drop select2-with-searchbox select2-drop-active" style="display: block; top: 541.109375px; left: 876.3125px; width: 310px;">
    <div class="select2-search">
        <input type="text" autocomplete="off" class="select2-input select2-focused" tabindex="-1">
    </div>
    <ul class="select2-results">
        <li class="select2-results-dept-0 select2-result select2-result-selectable">
        <div class="select2-result-label">
            <span class="select2-match"></span>What is your mother's maiden name?
        </div>
        </li>
        <li class="select2-results-dept-0 select2-result select2-result-selectable">
        <div class="select2-result-label">
            <span class="select2-match"></span>What was your high school mascot?
        </div>
        </li>
        <li class="select2-results-dept-0 select2-result select2-result-selectable">
        <div class="select2-result-label">
            <span class="select2-match"></span>Who is your favorite author?
        </div>
        </li>
        <li class="select2-results-dept-0 select2-result select2-result-selectable select2-highlighted">
        <div class="select2-result-label">
            <span class="select2-match"></span>What was the name of your first pet?
        </div>
        </li>
    </ul>
</div>

Any help would be appreciated. Thanks.

Answer 1

It appears you are using the wrong selector! From the sample code you posted By.id("s2id_SecretQuestion") is a div element and not a select element. Try:

new Select(driver.findElement(By.id("SecretQuestion"))).selectByVisibleText("Who is your favorite author?");

Answer 2

The way I interact with select lists is easy:

/**
 * Clicks The Selector List and picks your option.
 *
 */
public void selectOptionFromSelector(String selectedItem) {

    WebElement select = webDriver.findElement(By.id("idhere"));
    Select dropDown = new Select(select);
    String selected = dropDown.getFirstSelectedOption().getText();
    if(selected.equals(selectedItem)){
        // This should not happen
    }
    List<WebElement> Options = dropDown.getOptions();
    for(WebElement option:Options){
        if(option.getText().equals(selectedItem)) {
            option.click(); // clicks the option we want to select.
        }
    }
}