How to select value in span element using Selenium testing?

Question

The page I'm trying to check has a span element that actually functions as a drop-down menu. Selenium code for select elements does not work and produces the following:

Exception in thread "main" org.openqa.selenium.support.ui.UnexpectedTagNameException: Element should have been "select" but was "span" 

The code for this element is as follows:

 <span style="width: 100%" val="30" id="countVal">30</span> 

Code when opening the dropdown menu:

 <tr onclick="selectNewCount(1);" class="selec_option"> <td onmouseout="blankit(this)" onmouseover="colorit(this)" class="bones_pointer out_color" id="tdgroup1">50</td> </tr> 

Here's what it looks like:

EDIT 1:

This is my Selenium code:

  // choose number of records. try { WebDriverWait wait = new WebDriverWait(driver, /*seconds=*/10); element = wait.until(presenceOfElementLocated(By.id("countVal"))); Select select = new Select(element); select.deselectAll(); select.selectByVisibleText("100"); } catch (NoSuchElementException ex) { System.out.println("PAGE SOURCE: \n" + driver.getPageSource()); ex.printStackTrace(); } 

Here's what the source code of the page looks like around this element:

I can add additional information if required. Thanks.

Answer 1

So here is what happens:

When clicking on <div id="countSelect"></div> JavaScript show_countSelector() is executed, and the values ​​are added to the table. These "choices" are actually "table rows."

So your steps are:
1) If there are no rows with the class selec_option under the div with id countSelect , you need to first click on it div .
2) After that, you click on a specific line.

So, I will try to show Java code (however I am using Python for Selenium):

 WebElement selectorElement = driver.find(By.xpath('//*[@id="countSelect"]'))); WebElement elementOfInterest; try { //trying to get the "select option" elementOfInterest = selectorElement.findElement(By.xpath('//*[contains(@class,"selec_option")]/td[@text()="50"]')) } catch (NoSuchElementException e) { //so options are not visible, meaning we need to click first selectorElement.click() //good idea would be to put "wait for element" here elementOfInterest = selectorElement.findElement(By.xpath('//*[contains(@class,"selec_option")]/td[@text()="50"]')) } //this would select the option elementOfInterest.click() 

Something like that.:)

Answer 2

Have you tried selectByValue("value") ?

Answer 3

This is because it is not select , even if it looks like ...

You must use a different value. I think simple

 element = driver.find(By.id("countVal")); element.click() 

must work

You must find a way to work select, some javascript must be involved. When you learn how an element will change, you can find what to do in Selenium. But this, of course, is not pure select

(Note: this is not tested and even mabe not compiled code, but it shows you how I see the point)

Answer 4

You can only use the Select class with the html native selects ... you are using custom selection, which is actually a range.

example for the case:

  public void selectValue(String item) { WebElement dropDown = driver.findElement(By.id("countTd")); dropDown.click(); driver.findElement(By.xpath("//td[@id='countTd']/span[text()='" + item + "']")).click(); }