I'm unable to select value from dropdown on IOS SAFARI browser
Working On:
IOS Device: IPhone 8,IPhone 8 Plus
IOS Version : 11
Selenium Version : 2.53.1
Cloud : BrowserStack
We’ve tried to select the value from the dropdown using below workarounds but failed to succeed:
selectByValue , selectByVisibleText , selectByIndex , javascript select methods and Arrow up & down methods etc.
Html Code:
<select class="ot_select success" data-rule-required="true" data-reactid=".1.2.0.$1.0.1.$0.1.2.0.2.$0.0.1.0.1.0">
<option value="US" data-reactid=".1.2.0.$1.0.1.$0.1.2.0.2.$0.0.1.0.1.0.$0">United States</option>
<option value="CA" data-reactid=".1.2.0.$1.0.1.$0.1.2.0.2.$0.0.1.0.1.0.$1">Canada</option>
<option value="AF" data-reactid=".1.2.0.$1.0.1.$0.1.2.0.2.$0.0.1.0.1.0.$2">Afghanistan</option>
<option value="AL" data-reactid=".1.2.0.$1.0.1.$0.1.2.0.2.$0.0.1.0.1.0.$3">Albania</option>
<option value="DZ" data-reactid=".1.2.0.$1.0.1.$0.1.2.0.2.$0.0.1.0.1.0.$4">Algeria</option>
<option value="AS" data-reactid=".1.2.0.$1.0.1.$0.1.2.0.2.$0.0.1.0.1.0.$5">American Samoa</option>
<option value="AD" data-reactid=".1.2.0.$1.0.1.$0.1.2.0.2.$0.0.1.0.1.0.$6">Andorra</option>
</select>
Note:
When we use selectByValue, it doesn’t throw any error at the time of execution however corresponding action to that web element is not performed [leading to failure in dropdown value selection]
do JavaScript "document.getElementByClassName('ot_select success').value ='" & CA & "';" in document 1
Related
From drop down, I am not able to select the value from dropdown.
HTML Code :
<select id="ctl00_ContentPlaceHolder1_drp85" class="form-control select2-hidden-accessible" data-varindex="9" onchange="SetVariableValue('9', this, 'DESCENDANT - DROPDOWN')" name="ctl00$ContentPlaceHolder1$drp85" tabindex="-1" aria-hidden="true">
<option value="-1">--Select--</option>
<option value="Please don't hesitate">Please don't hesitate </option>
<option value="Please reach out to us">Please reach out to us</option>
<option value="Remember we are here for you">Remember we are here for you</option>
<option value="If you need help">If you need help</option>
<option value="If you ever need additional help">If you ever need additional help</option>
</select>
Selenium WebDriver Code :
WebElement dropdown = driver.findElement(By.id("ctl00_ContentPlaceHolder1_drp85"));
selectbyindex=new Select(dropdown);
selectbyindex.selectByIndex(1);
Getting exception as :
Exception in thread "main" org.openqa.selenium.ElementNotVisibleException: element not visible: Element is not currently visible and may not be manipulated".
Can anyone help where I am making mistake?
Just wait for the drop-down to be visible first and then select:
new WebDriverWait(driver, TimeSpan.FromSeconds(45)).Until(ExpectedConditions.ElementIsVisible((By.Id("ctl00_ContentPlaceHolder1_drp85"))));
I'm trying to select an option from a select drop-down using Selenium/java/MS Edge driver, but I'm finding I can't select the option even though I can see I have located it.
My code so far;
final static String URL = "http://usedcars.bmw.co.uk";
final static String edgeDriverBinary = "MicrosoftWebDriver.exe";
System.setProperty("webdriver.edge.driver", edgeDriverBinary);
WebDriver driver = new EdgeDriver();
driver.get(URL);
// Click the field to activate the drop down
By byQsRangeBtn = By.xpath("//div[#id='quick-search']/form/fieldset[#class='form']/div/div[#class='js-ctm-dropdownlist']/div[#class='js-ctm-display']/span");
WebElement qsRangeElement = driver.findElement(byQsRangeBtn);
qsRangeElement.click();
Sending this click does activate the drop-down and I can see it expands
Select qsRange = new Select(driver.findElement(By.id("qsRange")));
log("OPTIONS: " + qsRange.getOptions());
In the above I can dump .getOptions() and I see all the data from the select options.
When I call this I just get an exception with no stack trace or useful logging information. I've tried .selectByIndex() and .selectByVisibleText() with the same result - an exception and no information.
qsRange.selectByValue("3648835");
The part of the page is below. The id="qsRange" is set as not visible in the page (grey'd out in firebug). class="js-ctm-display" is the only div that is visible.
If I manually click the drop down to display it's values then <div class="js-ctm-dropdownlist"> becomes <div class="js-ctm-dropdownlist js-open">, but firebug still sees the select as not displayed.
<form class="quicksearch mp-search-count" method="post" action="/search-cars.aspx">
<fieldset class="form">
<div class="search-control series js-ctm js-ctm-mode-full" data-theme-type="dropdownlist">
<div class="js-ctm-dropdownlist">
<select id="qsRange" class="mp-control-data" name="Range">
<option value="-1">Series</option>
<option value="890">1 Series</option>
<option value="3648873">2 Series</option>
<option value="66">3 Series</option>
<option value="3648835">4 Series</option>
<option value="67">5 Series</option>
<option value="68">6 Series</option>
<option value="69">7 Series</option>
<option value="3648830">X</option>
<option value="3648831">Z</option>
<option value="3648832">M</option>
<option value="3648938">PHEV</option>
<option value="3648833">Hybrid</option>
<option value="3648834">BMW i</option>
<option value="3648879">Alpina</option>
</select>
<div class="js-ctm-display">
<span>Series</span>
<span class="js-ctm-ico"></span>
</div>
If I manually select a value from the drop-down then I see class="js-ctm-display" becomes as below and the page then makes an ajax call to obtain values for subsequent drop-downs.
<div class="js-ctm-display">
<span>4 Series</span>
<span class="js-ctm-ico"></span>
</div>
Because I can tell that the page is making multiple ajax calls as I move through the options I believe I need to simulate user interaction (clicks) rather than being able to just set values. However my attempts at clicking on an option in the list aren't working out at all.
I've also attempted to get a WebElement for one of the option values with the intention of sending it a click, but that throws an exception saying the WebElement is expected to be a Select rather than an Option.
Does anyone have a view on how to approach this kind of page? I'm rather new to Selenium so expect my approach isn't the best.
I have the following html code below: How do I locate and click any of the options e.g 'verve'?
<div id="cardsSelectList">
<select id="cardtype" class="selinput" tabindex="1" onchange="webpay.ProcessCardTypeSelection($(this).val())" name="cardtype">
<option value="-1">- Select your card type -</option>
<option value="1|1|1|Card Number|0|Card PIN|1|0|||0|0">Verve\u2122</option>
<option value="1|1|1|Card Number|0|Card PIN|1|0|||0|0">MasterCard\u2122 Naira Debit</option>
<option value="1|0|1|Card Number|0|Card PIN|0|0|||0|0">Visa</option>
</select>
Use Select class
#FindBy(id="cardtype")
private WebElement selectElement;
Select select = new Select(selectElement);
select.selectByValue("1|1|1|Card Number|0|Card PIN|1|0|||0|0");
You also have option to select byt text, index etc. refer to this
written in java and refer to java. But the api is fairly similar for any other bindings
When the user expands the menu and chooses and option, how can I get the selected option with Selenium?
<select class="brand-select select-glossy user-success" name="">
<option value="All Makes">All Makes</option>
<option value="Ford">Ford</option>
<option value="Lincoln">Lincoln</option>
<option value="Mercury">Mercury</option>
</select>
Find the select element and make a Select object our of it (need to import org.openqa.selenium.support.ui.Select)
Use the API therein to get the first selected option:
WebElement selectedOption = new Select(driver.findElement(By.className("brand-select"))).getFirstSelectedOption();
This is what I have currently with Geb. I want to be able to retrieve and set the value of a combobox (or drop down) in a page. I'm not quite sure how to do it, and the Book of Geb does not seem to cover this. This is the HTML element that I'm trying to work with.
<select style="height: 22px; width: 370px;" id="ddlContactTypes" name="ddlContactTypes">
<option value="-1">--Please Select--</option>
<option value="18">Customer Hauler</option>
<option value="19">Customer General</option>
<option value="20">Rolloff</option>
<option value="21">Supplier</option>
<option value="22">Leads</option>
<option value="23">Competition</option>
<option value="24">Employees</option>
<option value="25">Customer Car</option>
<option value="26">Secondary Metals Recycler</option>
<option value="27">Mills</option>
<option value="28">Brokerage Customers</option>
<option value="29">Type Jon</option>
</select>
This is what I've go so far. This currently will click the element, but I don't know how to actually select one. Any ideas?
static content = {
title {$("title")}
contactType { $("#ddlContactTypes") }
}
def addUser(){
contactType.click()
}
You can select an option by setting the value of the geb object :
contactType.value('20')
Above example will set the value to '20', making the list show 'Rolloff' as selected.
U can see this
HTML
Alt folk
Chiptunes
Electroclash
G-Funk
Hair metal
GOOVY
$("form").artist = "1" // first option selected by its value attribute
$("form").artist = 2 // second option selected by its value attribute
$("form").artist = "Ima Robot" // first option selected by its text
http://www.gebish.org/manual/0.9.2/navigator.html
Manual descibes it in section Setting Values