Not able to select option from drop down list in selenium webdriver with java

Question

I'm trying to select a value from drop down list. I have checked all posts related to it but not able to find solution.

Here is my HTML code for drop down list:

<select class="select2 visible" data-val="true" data-val-number="The field ClientId must be a number." id="ClientId" name="ClientId" tabindex="-1" title="" style="display: none;">
<option value="">Client</option>
<option value="22">ABC</option>
<option value="7">ABC1</option>
<option value="18">ABC2</option>
<option value="27">ABC3</option>
<option value="26">ABC4</option>
<option value="31">ABC5</option>
<option value="12">ABC6</option>
<option value="19">ABC7</option>
<option value="72">DGX Client</option>
<option value="57">DS Sampler</option>
<option value="25">Group123</option>
</select>

the code which I written in Selenium Webdriver to fetch value:

@FindBy(id="ClientId")
WebElement clientDropDown;
waitTime = new WebDriverWait(driver,20);
waitTime.until(ExpectedConditions.visibilityOf(clientDropDown));
Select client=new Select(clientDropDown);
client.selectByVisibleText("DGX Client");

Error: org.openqa.selenium.TimeoutException: Expected condition failed: waiting for visibility of [[ChromeDriver: chrome on XP (6fa8cbb25476bea9b789aff19a6edf)] -> id: ClientId] (tried for 30 second(s) with 500 milliseconds interval)

Answer 1

Operating under an assumption here.

See how your select has is hidden by the display: none style:

<select ... style="display: none;">
            ^^^^^^^^^^^^^^^^^^^^^

I assume this is because it is actually represented on a UI differently and this select is under-the-hood manipulated by the javascript whenever the actual dropdown representation changes.

If this is the case, you can either inspect what the actual dropdown looks like and use a combination of click() commands to open the dropdown and select the desired option (note that you would not be able to use Select class in that case as it is designed to be used for select elements only).

Or, you can make the select element visible and continue :

String js = "arguments[0].style.display='block'"; 
((JavascriptExecutor) driver).executeScript(js, clientDropDown);

Select client = new Select(clientDropDown);
client.selectByVisibleText("DGX Client");