We Keep Coding

How to select a value from Kendo UI MVVM drop down in automated test?

Could anyone please help me with selecting a value from Kendo UI MVVM drop down using Selenium Java?
<input class="k-input fieldFullWidth" autocomplete="off" style="width: 100%;" title="" role="combobox" aria-expanded="false" tabindex="0" aria-disabled="false" aria-autocomplete="both" aria-owns="ddStore_listbox" type="text">
<input id="ddStore" class="fieldFullWidth" data-role="combobox" style="display: none;" aria-disabled="false" data-bind="value: selectedAsset.StoreID, comboboxText: selectedAsset.StoreName">
I tried to use JavascriptExecutor. But, it gives me org.openqa.selenium.WebDriverException: unknown error: Cannot set property 'value' of null error.
jse.executeScript("document.getElementById('ddstore').value = '1';");
Thanks

Use ExplicitWait to wait until visibility of <input>tag element and then send your dropdown value as input
WebDriverWait wait = new WebDriverWait(driver, 120);
wait.until(ExpectedConditions.visibilityOfElementLocated(By.id("ddStore")));
driver.findElement(By.id("ddStore")).sendKeys("dropDown_Value"); // send your dropdown value as input
`
The another alternative way is to use JavascriptExecuter as your tag contains attribute style="display: none;" so might be changes of invisibility of element
JavascriptExecutor jse = (JavascriptExecutor)driver;
jse.executeScript("arguments[0].value='your_dropdown_value';",driver.findElement(By.id("ddStore")));

You can try the following code to select dropdown value:
Select mydrpdwn = new Select(driver.findElement(By.id("ddStore"))); //id of dropdown
mydrpdwn.selectByVisibleText("name");// Value you wanted to select

Selenium WebDriver. Select element from div list

I have the following area on the HTML page:
<div class="t2-selector">
<div class="">
USA
<div>
<div>
<div>
<div class="selected" asset-id="129">Google</div>
<div asset-id="130">Microsoft</div>
<div asset-id="126">Apple</div>
</div>
</div>
</div>
</div>
<div class="inactive">
Europe
<div>
<div>
<div>
<div class="inactive" asset-id="127">BT</div>
</div>
</div>
</div>
</div>
<div class="">
Currencies
<div>
<div>
<div>
<div asset-id="135">EUR/USD</div>
<div asset-id="136" class="">GBP/USD</div>
<div asset-id="137" class="">USD/JPY</div>
<div asset-id="138" class="selected">USD/CHF</div>
<div asset-id="139">AUD/USD</div>
<div asset-id="140">USD/CAD</div>
</div>
</div>
</div>
</div>
So I need to select desired element from one of the groups (that should not be inactive, OK).
When I'm selecting a group nothing occurs, no error and I don't see the the selected group opens.
Even for a moment.
But when I'm trying to select an element in previously clicked group I receive
org.openqa.selenium.ElementNotVisibleException: element not visible
error.
So I understand that in the moment I'm clicking on desired element it is not visible since the group not appears open.
But why?
And what can I do to resolve this problem?
Currently I'm using following code:
String selectedGroup = getValue("group",'o');
String xpath1 = "//div[contains(text(),'" + selectedGroup + "')]";
driver.findElement(By.xpath(xpath1)).click();
webElement = driver.findElement(By.xpath(xpath1));
String className = webElement.getAttribute("class");
if(className.contentEquals("inactive"))
throw new ElementInactiveException("Selected group appears inactive. Exiting the test");
String optionAssetID = getValue("assetID",'o');
String xpath2 ="//div[#asset-id='" + optionAssetID + "']";
driver.findElement(By.xpath(xpath2)).click();
the error occur on the following line:
driver.findElement(By.xpath(xpath2)).click();
When clicking on a Group or hovering over it it looks in the following way:
As you can see from the code the selected / opened group receives "group-visible" class parameter.

You can hover over the drop down to open it and then click on your element
// simulate mouse movement to the dropdown
Actions actions = new Actions(driver);
actions.moveToElement(driver.findElement(By.xpath(xpath1))).perform();
// wait for the element to be visible before clicking on it
WebDriverWait wait = new WebDriverWait(driver, 10);
wait.until(ExpectedConditions.visibilityOfElementLocated(xpath2)).click();

You can also try to click using JavascriptExecutor
WebElement element= driver.findElement(By.xpath("Your Xpath"));
JavascriptExecutor executor = (JavascriptExecutor) driver;
executor.executeScript("arguments[0].click();", element);
Hope it will help you :)

XPath of an element in HTML code

I am trying to click on 'Select' button embedded in following HTML code using selenium webdriver-java. For this I am trying to write XPath for the 'select' button.
<div class="product eq-height" style="padding-bottom: 0px ! important; min-height: 329px;">
<h3 class="h4">BYOX Samsung S6 White</h3>
<input name="productModel" value="BYOX Samsung S6 White" type="hidden">
<div class="subtitle">
<span>Samsung</span>
</div>
<a class="select-device-button" href="javascript:void(0);">
<div class="item">
<img alt="" class="prod-img-lrg lazyloaded" data-src="https://vgeco-oat1.vodafone.com/images/Samsung_Galaxy_S6_White.jpg" src="https://vgeco-oat1.vodafone.com/images/Samsung_Galaxy_S6_White.jpg"> <noscript><img alt="" src="https://vgeco-oat1.vodafone.com/images/Samsung_Galaxy_S6_White.jpg"></noscript>
</div>
</a>
<div class="info">
<div class="inner">
<ul class="cost">
<li><b>Total cost</b></li>
<li class="price">£ 700.00</li>
</ul>
<ul class="cost">
<li><b>My cost</b></li>
<li class="price">£ 200.00</li>
</ul>
</div>
<div class="cta">
<a class="btn btn-sml select-device-button" href="javascript:void(0);">Select</a>
</div>
</div>
<div class="co-link-wrap txt-center"></div>
</div>
what would be the xpath to fetch the Select button in above code. the field: BYOX Samsung S6 White can be different in every piece of code. so i need a generic code to fetch the select element. I am trying to select the button based on the string: BYOX Samsung S6 White and there are a number of different product available on the webpage with associated Select button.

There is a simple locator that fits this use case perfectly:
driver.findElement(By.linkText("Select")).click();
Note that instead of driver in this case, there can be a WebElement used, for example, imagine you've already found a product and want to "select" it:
WebElement product = driver.findElement(By.cssSelector("div.product"));
product.findElement(By.linkText("Select")).click();
I need to click the 'Select' button only if the product name is BYOX Samsung S6 White in above div class. how can i do this ?
Sure:
WebElement product = driver.findElement(By.xpath("//div[contains(#class, 'product') and h3 = 'BYOX Samsung S6 White']"));
product.findElement(By.linkText("Select")).click();

There are two select elements (one is the big image the other the Select-link)
Do you mean the second element?
Xpath:
//div[#class='cta']/a[#class]
Css:
div.cta a.select-device-button
(similar but more efficient in Selenium and in my opinion easier to declare)
If you wanted the first element in both cases just leave out the declaration for the div element.
In Firefox you can easily try out locators and it is always a bit depending how strict or flexible you want to keep them.
To the edited point:
You might check independently for the value of the hidden input field (it seems here is no parsing necessary) and is not dependent on the localisation. Alternatively check the header element or the image reference.

You don't have to use xpath. Simpler way will be using other locators. You can use
className
WebElement button = driver.findElement(By.className("btn"));
WebElement button = driver.findElement(By.className("btn-sml"));
WebElement button = driver.findElement(By.className("select-device-button"));
linkdText
WebElement button = driver.findElement(By.linkText("Select"));
cssSelector
WebElement button = driver.findElement(By.cssSelector(".btn.btn-sml.select-device-button"));
Each one of those can give you the button element.

Select an option from hidden drop down in selenium

Hey guys I'm having this problem where I have a hidden select drop down where its style set to none.
<div>
<select id="selectForm" style="width: 285px; display: none;" name="formId">
<option value="36784">EMAIL 4</option>
</select>
<div class="sbox sbox_1cbc5b38 selectForm" tabindex="0" style="width: 285px;">
<div class="sbox_sel">
<div class="sbox_seltext" contenteditable="false">Report</div>
<div class="sbox_arrow"/>
</div>
</div>
<a id="previewForm" class="preview-button"/>
</div>
I was getting element not visible when I was looking By.id for the select tag. And the same error for when I was trying to click on the div. I found a way to make this drop down visible with jsExecutor. Here is my code to make this drop down visible to interact with:
public static void BatchResults(String form){
WebDriverWait wait = new WebDriverWait(driver, 60);
JavascriptExecutor js = (JavascriptExecutor)driver;
js.executeScript("document.getElementById('selectForm').style.display='block';");
WebElement selectFormElement =
wait.until(ExpectedConditions.visibilityOfElementLocated(By.id("selectForm")));
Select selectForm = new Select(selectFormElement);
selectForm.selectByVisibleText(form);
js.executeScript("document.getElementById('selectForm').style.display='none';");
}
#Test(priority = 1)
public void runTest() {
String selectForm = "EMAIL 4";
Main.BatchResults(selectForm);
}
}
My issue is that, in jsExecutor I am setting the style to (style.display='block';) and it is bringing my underlining drop down on top of the styled drop down. Is there way to select this hidden drop down without using jsExecutor or what other option should I use? Also I cannot still select the option I want from the drop down after it is set to block and then none after selection
<ul class="sbox_opts sbox_fa9ea48e" style="width: 283px; top: 610.5px;
left: 330.333px; max-height: 54.5px; display: none;">
<li class="sbox_opt">EMAIL 4</li>
</ul>

Selenium is designed to navigate web pages the same way a user would. You should have a visible element that when interacted with (hover/click) will display the drop down. Once the drop down is displayed you can interact with the contents. Have Selenium perform the same tasks a user would have to.

Mousehover does not work - Selenium, Java, Chrome

I am trying to automate the hover on a specified element, in my case is an specified office name.
When I hover on an office the information of it should appear.
My problem is that when I run his code:
String officeId = findElement(designOfficesPosition, num).getAttribute(ConstantsFramework.ID);
WebElement office = getSupport().getDriver().findElement(By.id(officeId));
action.moveToElement(office).build().perform();
getSupport().pause(ConstantsFramework.TIME_OUT_10_SECONDS);
I don't get any errors but I don't see the information of the office. Am I missing something? Any ideas? Thanks
UPDATE
Here you can see a piece of the html:
<div id="officesListPreview">
<div class="roundBox previewOffice officesRotator">
<h3>Office information</h3>
<p class="numbers">
<div id="OPA-AT" class="officeContainer" style="display: none;">
<div id="BPO-BG" class="officeContainer" style="display: block;">
<a class="officeLink" href="http://www.bpo.bg/" target="_blank" style="">
<div class="detailsOffice">
</div>
<div id="BOIP-BX" class="officeContainer" style="display: none;">

SOLVED
What I was missing is that there are two classes Actions and Action. I was using just Action class
This works perfectly!!
WebElement home = driver.findElement(By.xpath(//div[#id='homePage']));
Actions actions = new Actions(driver);
Action mouseOverHome = actions.moveToElement(home).build();
mouseOverHome.perform();

You can also try doing it via HasInputDevices interface.
RemoteWebElement homePage = (RemoteWebElement) driver.findElement(By.xpath(//div[#id='homePage']));
((HasInputDevices)driver).getMouse().mouseMove(homePage.getCoordinates());