无法在Selenium中选择下拉菜单-元素不可见

Question

I'm attempting to select a dropdown box via Selenium and am being told the following

Element is not currently visible and so may not be interacted with

After searching around a bit I've tried the following but am still being given the same error:

        WebElement inputElement = driver.findElement(By
                .id("diningAvailabilityForm-searchTime"));

        ((JavascriptExecutor) driver).executeScript(
                "arguments[0].checked = true;", inputElement);

        ((JavascriptExecutor) driver).executeScript(
                "arguments[0].checked = true;", inputElement);

        ((JavascriptExecutor) driver)
                .executeScript("$(\"#diningAvailabilityForm-searchTime\").show()");

        ((JavascriptExecutor) driver).executeScript(
                "arguments[0].checked = true;", inputElement);

        driver.switchTo().activeElement();
        new Select(inputElement).selectByVisibleText("Dinner");

However,this results in the same error. When I open the page in the browser I can see the dropdown, I can also click on the dropdown. However, like I said - using this bit of code doesn't achieve what I need.

The input Element returns as the value is correct. Made sure to check it was correct by throwing in some errors and it failed as expected.

EDIT 2:

Here's the HTML

  <span class="selectBox medium standardFormElement status-closed" id="searchTime-wrapper" data-plugins="[[&quot;pepSelectBox&quot;,{&quot;maxSelectionsLength&quot;:&quot;20&quot;,&quot;maxDisplayOptions&quot;:&quot;8&quot;,&quot;displayScrollBar&quot;:&quot;1&quot;,&quot;displaySpecialDropDown&quot;:&quot;1&quot;,&quot;displaySpecialDropDownHeight&quot;:&quot;21&quot;,&quot;checkIconActive&quot;:&quot;1&quot;,&quot;highlightSelected&quot;:&quot;1&quot;}]]" data-prependliststyleenhancements="[]" data-appendliststyleenhancements="[]" data-richoptioncontents="[]" data-extraoptionclass="[]" data-richoptgroup="[]" data-a11ytext=" - Opens menu"> <span class="selectBox-nojs" style="display: none;"> <select name="searchTime" id="diningAvailabilityForm-searchTime" class="searchTime inputElement" min="06:30:00" max="22:30:00" allday="00:00:00 23:30:00" data-plugins="[[&quot;pepMealTimeOptionModifier&quot;]]"> <option value="80000712" label="Breakfast" selected="selected">Breakfast</option> <option value="80000717" label="Lunch">Lunch</option> <option value="80000714" label="Dinner">Dinner</option> </select> </span> <span class="richSelectArrowIcon uiGlobalSprite"></span> <div class="select-toggle hoverable" aria-haspopup="true" aria-owns="diningAvailabilityForm-searchTime-dropdown-list" aria-describedby="diningAvailabilityForm-searchTime-label" aria-labelledby="diningAvailabilityForm-searchTime-label" role="button" tabindex="0"><span class="select-value" data-activeoptionclass=""><span class="rawOption"><span class="accessibleText hidden">Time&nbsp;required - Opens menu - </span>Dinner</span> </span> </div> <div class="listWrapper"> <span class="scrollbarTrack"></span> <div class="innerListWrapper"> <ol class="dropdown-list" id="diningAvailabilityForm-searchTime-dropdown-list" aria-hidden="true" role="listbox" aria-label="Time&amp;nbsp;required - Opens menu"> <li role="option" data-value="80000712" data-display="breakfast" data-extraoptionclass="" class="selectOption" id="diningAvailabilityForm-searchTime-0" aria-setsize="36" aria-posinset="1"><span class="rawOption"><span class="accessibleText hidden">Time&nbsp;required - Opens menu - </span>Breakfast</span> </li> <li role="option" data-value="80000717" data-display="lunch" data-extraoptionclass="" class="selectOption" id="diningAvailabilityForm-searchTime-1" aria-setsize="36" aria-posinset="2"><span class="rawOption"><span class="accessibleText hidden">Time&nbsp;required - Opens menu - </span>Lunch</span> </li> <li role="option" data-value="80000714" data-display="dinner" data-extraoptionclass="" class="selectOption" id="diningAvailabilityForm-searchTime-2" aria-setsize="36" aria-posinset="3"> </ol> </div> </div> <span class="shadow-mask"></span> </span> 

Answer 1

You are probarly trying to use the element before it is visible.

WebDriverWait wait = new WebDriverWait(driver, 30);
wait.until(ExpectedConditions.refreshed(ExpectedConditions.visibilityOfElementLocated(by)));
wait.until(ExpectedConditions.refreshed(ExpectedConditions.elementToBeClickable(by)));

Effective wait methods for your situation

If it didnt work, you could also try

waitUntil(Waits.elementDisplayed(WebElement));

Answer 2

((JavascriptExecutor) driver)
        .executeScript("document.getElementsByClassName(\"selectBox-nojs\")[1].style.display = ''");

((JavascriptExecutor) driver)
        .executeScript("document.getElementsByClassName(\"selectBox-nojs\")[2].style.display = ''");