Cannot save value in span control using Selenium Webdriver and Java - java

I'm using Selenium Webdriver + Java to do automation tests and stuck with the problem of setting a value in span control.
I have a drop-down with list of clients, the 1st client is selected by default - 'Harry', but I need to change the client to be other than default, e.g. to 'Simon'.
I tried to search here and came with the following code:
Webelement element = driver.findElement(By.xpath("//*[#id=\"SelectedClientDirectorID_chosen\"]/a/span"));
((JavascriptExecutor)driver).executeScript("arguments[0].innerText = 'Simon'", element);
It seems to be fine, the element is found, it's innerText property is changed to 'Simon' while script is being executed.
But as soon as I click 'save' button on the page, the record is saved with the 1st value - 'Harry'.
I could not find the answer on why the new value is not saved.
Html looks like:
<div class="chosen-container chosen-container-single" style="width: 100%;" title="" id="SelectedClientDirectorID_chosen">
<a class="chosen-single" tabindex="-1">
<span class="">Harry</span>
<div><b></b></div>
</a>
<div class="chosen-drop">
<div class="chosen-search">
<input type="text" autocomplete="off">
</div>
<ul class="chosen-results">
<li class="active-result result-selected" style="" data-option-array-index="0">Harry</li>
<li class="active-result result-selected" style="" data-option-array-index="1">Simon</li>
<li class="active-result result-selected" style="" data-option-array-index="2">Robin</li>
<li class="active-result" style="" data-option-array-index="3">Brian</li>
<li class="active-result" style="" data-option-array-index="4">Rupert</li>
<li class="active-result" style="" data-option-array-index="5">Greg</li>
</ul>
</div>
</div>
Appreciate any clue.

Changing innerText value might not bring expected result in your case. You can try to click on drop-down and select required option just like real user do:
driver.findElement(By.xpath("xpathForDropDownButton")).click();
driver.findElement(By.xpath("//li[text()='Simon']")).click();
You might also need to wait some time until required elements become clickable:
WebDriverWait wait = new WebDriverWait(driver, 15);
wait.until(ExpectedConditions.elementToBeClickable(By.xpath("xpathForDropDownButton"))).click();
wait.until(ExpectedConditions.elementToBeClickable(By.xpath("//li[text()='Simon']"))).click();

Use the following code for the same. Instead of setting innerText, you need to select value from dropdown.
WebElement element = driver.findElement(By.xpath("//ul[#class='chosen-results']/li[normalize-space()='Simon']"));
((JavascriptExecutor)driver).executeScript("arguments[0].click();", element);

Related

List WebElement always selecting first element from the drop-down but i want to select 4th element

My list has approximate 190 items and items also getting traced one by one in for loop. I applied the condition to a specific text. however, debugger entering into condition but selecting always the first element from the drop-down. In mentioned code country "America" present on the 4th index of my drop-down.
List<WebElement> options=driver.findElements(By.xpath("//*[#id='Countryitems_popup']/div[1]/ul//li/span"));
for(int i=0;i<options.size();i++)
{
WebElement select=options.get(i);
String innerhtml=select.getAttribute("innerHTML");
if(innerhtml.contentEquals("America"))
{
select.click();
break;
}
}
HTML is mentioned below:
<div id="Countryitems_popup" class="e-scroll e-js e-wid" tabindex="" style="height: auto; display: block;">
<div class="h-con" style="height: 150px; width: 158.891px;">
<ul class="H-Kl" role="listbox">
<li data-value="001" id="004" role="option" unselectable="on" class="">
<span class=" e-ddltxt">Country 1</span>
</li>
<li data-value="676" id="006" role="option" unselectable="on" class="">
<span class=" e-ddltxt">Country 2</span>
</li>
<li data-value="765" id="009" role="option" unselectable="on" class="">
<span class=" e-ddltxt">Country 3</span>
</li>
<li data-value="0067" id="065" role="option" unselectable="on" class="">
<span class=" e-ddltxt">America</span>
</li>
</ul>
</div>
</div>
Use for each loop for more readability. Try with this code :
List<WebElement> options= driver.findElements(By.xpath("//[#id='Countryitems_popup']/div[1]/ul//li/span"));
for(WebElement option : options) {
if(option.getText().trim().equals("America")) {
option.click();
break;
}
}
This should work, provided the xpath should be correct.
Without seeing the page to test it, it's hard to know exactly what the issue is but if it's like other pages I've seen you will need to:
Click the "dropdown" to open it (and make the options visible)
Wait for the desired option to be clickable (indicating the list is open and visible)
Click the desired option
My recommendation is to put this all in a method called selectCountry() (or something similar) and pass in the desired country name.
public void selectCountry(String countryName)
{
// I'm assuming this is the container for the dropdown. Clicking it should open the dropdown
driver.findElement(By.id("Countryitems_popup")).click();
new WebDriverWait(driver, 10).until(ExpectedConditions.elementToBeClickable(By.xpath("//div[#id='Countryitems_popup']//span[.='" + countryName + "']))).click();
}
You can achieve it with selector itself without loop. The xpath to find the list element with text 'America' will be as,
driver.findElement(By.xpath("//[#id='Countryitems_popup']/div[1]/ul//li[conatins(text(), 'America')]")).click()

How to select items from dropdown list by selenium

In my testing UI, I need to automate a case as this in selenium java.
1. To click an icon, so that the pop-up list will be shown up,
2. then to select an item from the pop-up list.
But I am clueless how this can be done from following html code. This is the code after the icon has been clicked.
<ul class="pull-right header-helpers">
<li class="helpers-user hide-min-width"> ... </li>
<li class="helpers-help hide-min-width"> ... </li>
<li class="dropdown user-dropdown open">
<div class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
<div>...</div>
</div>
<div class="dropdown-backdrop"></div>
<ul class="dropdown-menu dropdown-menu-right">
<li class="dropdown-menu-item">
<a action = "Option-A"/>
</li>
<li class="driver" role="separator"></li>
<li class="dropdown-menu-item">
<a action = "Option-B"/>
</li>
<li class="driver" role="separator"></li>
</ul>
</ul>
If icon hasn't been clicked, line 4 would be as this:
<li class="dropdown user-dropdown">
Thanks for the help.
Wait for the dropdown value you want to select and click it. This is to select the option A in the dropdown. You can replace option value with params and handle dynamically to select required option.
WebDriverWait wait = new WebDriverWait(driver, 60);
WebElement dropdown= wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector(".dropdown-menu a[action='Option-A']")));
dropdown.click();

Web Element is not identified by Xpath containing a text for Selenium WebDriver Java

I am using Selenium WebDriver with Java.
Below is my html code:
<div id="servicetype-pp" class="z-combobox-popup " style="display: none; width: auto;">
<ul id="servicetype-cave" class="z-combobox-content">
<li id="zk_comp_140" class="z-comboitem">
<li id="zk_comp_141" class="z-comboitem">
<span class="z-comboitem-image"></span>
<span class="z-comboitem-text">Bill Generation Service</span>
</li>
<li id="zk_comp_142" class="z-comboitem">
<li id="zk_comp_143" class="z-comboitem">
<li id="zk_comp_144" class="z-comboitem">
<li id="zk_comp_145" class="z-comboitem">
<li id="zk_comp_146" class="z-comboitem">
<li id="zk_comp_147" class="z-comboitem">
<li id="zk_comp_148" class="z-comboitem">
<li id="zk_comp_149" class="z-comboitem">
<li id="zk_comp_150" class="z-comboitem">
</ul>
</div>
I have defined a WebElement by xpath containing a particular text.
//div[#id='servicetype-pp']//span[contains(text(),'Bill Generation Service')]
It is not working. But, when I search with a single word, without any space, it is working fine.
//div[#id='servicetype-pp']//span[contains(text(),'Bill')] or
//div[#id='servicetype-pp']//span[contains(text(),'Generation')] or
//div[#id='servicetype-pp']//span[contains(text(),'Service')]
It seems it is an issue with space.
Please help.
TIA.
You can try using normalize-space()
//div[#id='servicetype-pp']//span[contains(text()[normalize-space()], 'Bill Generation Service')]
Actually your <div id="servicetype-pp" class="z-combobox-popup " style="display: none; width: auto;"> looks as invisible that's why you are not able to interact with the element, try as below :-
WebElement el = driver.findElement(By.id("servicetype-pp"));
el = (WebElement)((JavascriptExecutor)driver).executeScript("arguments[0].style.display = 'block';return arguments[0]", el);
//Now you can find your desire element
WebElement spanElement = el.findElement(".//span[contains(text(),'Bill Generation Service')]");
//Now do your further steps with this element
Edited :- If you are getting NuSuchElementExcpetion that means visibility is not the issue, It might be possible that this element is inside a frame or iframe. If it is, you need to switch that frame or iframe before finding element as below :
driver.switchTo().frame("frame name or id");
// Now go to find element
WebElement spanElement = driver.findElement(".//span[contains(text(),'Bill Generation Service')]");

How to select from the drop down using Selenium

Please see the code below where I need to click on dropdown so that list is displayed
<span class="k-widget k-dropdown k-header" style="" unselectable="on" role="listbox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-owns="" aria-disabled="false" aria-readonly="false" aria-busy="false">
<span class="k-dropdown-wrap k-state-default k-state-hover k-state-focused" unselectable="on">
<span class="k-input" unselectable="on">Is equal to</span>
<span class="k-select" unselectable="on">
<span class="k-icon k-i-arrow-s" unselectable="on">select</span>
</span>
</span>
driver.FindElement(By.CssSelector(".k-widget k-dropdown k-header")).click()
I think you again have to try by clicking using JavascriptExecutor
WebElement element1 = driver.findElement(By.xpath("//span[#class='k-widget k-dropdown k-header' and #role='listbox']"));
JavascriptExecutor executor1 = (JavascriptExecutor) oBrowser;
executor1.executeScript("arguments[0].click();", element1);
If above Xpath didn't work then try below:-
//span[#class='k-widget k-dropdown k-header']
Hope it will help you :)
I ran across this exact issue the other day. The problem is the Kendo UI <span> element you are referencing uses a <ul> element to get it's innertext but it's the <ul> list that handles the option change/selection. You won't be able to select an option from the pop-up/dropdown you see when clicking the <span>, you have to click the <li> element that holds the text options referenced by the span.
In your example, somewhere else in the HTML document you'll find a <ul> list similar to...
<ul unselectable="on" class="k-list k-reset" tabindex="-1" aria-hidden="true" aria-live="off" data-role="staticlist" role="listbox">
<li tabindex="-1" role="option" unselectable="on" class="k-item k-state-selected k-state-focused" data-offset-index="0">is equal to</li>
<li tabindex="-1" role="option" unselectable="on" class="k-item" data-offset-index="1">another option</li>
</ul>
Using Selenium 3, if you wanted to select "another option":
driver.findElement(By.xpath("//li[text()='another option']")).click();
You should see your <span> innertext change to 'another option' and you can continue on your testing journey.

FluentWait for dynamically created ListBox

I have a listbox(droplist) item that is created dynamically when I click on a div/span element .. However, when I try to click on the listbox element after doing a fluent Wait , it throws me an error saying
Element is not clickable at point (741, 192). Other element would receive the click:"
If i try to use Thread.sleep(2000) then the code runs perfectly. Any ideas on how I can fix this issue and make it work in fluentWait. I have tried elementTobeClickable,elementSelectionStateToBe,presenceOfElementLocated methods in the ExpectedConditions class and they all throw the same error. I am using ChromeDriver for testing purposes .
My code and HTML snippet of the page is below
WebElement elt = driver.findElement(By.xpath("//*[#id='GroupTT']/span[2]/span/span[1]")); //Clicking on the span so that listbox will be activiated
Actions act = new Actions(driver);
act.moveToElement(elt).click().build().perform();
fWait.until(ExpectedConditions.elementToBeClickable(driver.findElement(By.xpath("//ul[#id='Group_listbox']/li[2]")))); //Thread.sleep(2000) works fine here.
driver.findElement(By.xpath("//ul[#id='Group_listbox']/li[2]")).click();
HTML Snippet
<div >
<ul unselectable="on" id="Group_listbox" role="listbox" style="overflow: auto; height: auto;">
<li tabindex="-1" role="option" unselectable="on" class="k-item" data-index="0"> Group1 </li>
<li tabindex="-1" role="option" unselectable="on" class="k-item k-state-selected k-state-focused" data-index="1"> Group2 </li>
<li tabindex="-1" role="option" unselectable="on" class="k-item k-state-selected k-state-focused" data-index="1"> Group3 </li>
</ul>
</div>
You can try to change the XPath locator to find the element by its inner text.
fWait.until(ExpectedConditions.elementToBeClickable(driver.findElement(By.xpath("//li[text() = 'Group2']"))));

Categories