Can't select element from drop down menu E2E testing using Protractor [duplicate] - node.js

This question already has answers here:
How to select option in drop down protractorjs e2e tests
(34 answers)
Closed 5 years ago.
There's quite a few ways to do this and I've tried a good number of them but I can't select an item from a drop down menu when doing an automated test.
"Select" is the default choice that appears in the drop down menu, I want the automated test to pick one of the elements, doesn't matter which one
This is the HTML Code
<select class="form-control ng-pristine ng-invalid ng-invalid-required" ng-model="user.investmentAmount" required="" ng-class="{submitted:invalid}">
<option value="">Select</option>
<option value="<50"> 50K</option>
<option value="50-100">100K</option>
<option value="100-250">250K</option>
<option value="250-500">500K</option>
</select>
And this is my Protractor file
var selectDropdownbyNum = function ( element, optionNum ) {
if (optionNum){
var options = element(by.cssContainingText("Select"))
.then(function(options){
options[2].click();
});
}
};
browser.sleep(2000);
I've tried using by.cssElement, by.xpath etc.
When I run the above, I get no errors but it doesn't select any element either.
Thanks

Selects are an odd duck for sure. I generally just click the option by text (when possible). Eg. you should be able to do something like this...
var selectOptionByText = function(text) {
return element(by.cssContainingText('option', text)).click();
};

Once you clicked on //select[#ng-model='user.investmentAmount'] usng xpath,
Put some wait like "browser.sleep(2000)" then use //option[text()='100K'] to click.

It's because of you are selecting only one option containing 'Select' value and expecting array,
try below, first get the select box by model and get all options by
html tag name in array
browser.element(by.model('user.investmentAmount')).all(by.tagName('option')).
then(function(items){
items[2].click();
});

Related

Why can't I see the options of a drop-down menu in the source code?

I'm trying to select an option in a drop-down menu using selenium's Select, but I can't get anything out of it. My code at the moment is like this
select = Select(driver.find_element_by_id("cmbTBC"))
select.select_by_value("172")
which presents me with the error selenium.common.exceptions.NoSuchElementException: Message: Cannot locate option with value: 172.
If I inspect the element I can see a list of options, including one with value '172', but going to the source code shows no options at all. Here's the part with the drop-down menu at the source.
<select Id="cmbTBC" class="form-control" data-val="true" data-val-number="The field TBC must be a number." data-val-required="The TBC field is required." id="IdTBC" name="IdTBC" onchange="CreateBC.DescriptionTBC(this.value)">
<option value=""></option>
</select>
What am I doing wrong?
The options are probably loaded by JavaScript, you can wait for them to appear with custom ExpectedCondition
def wait_for_options(self, select):
if select.options:
return True
return False
select = Select(driver.find_element_by_id("cmbTBC"))
wait = WebDriverWait(driver, 10)
wait.until(lambda x: self.wait_for_options(select))
select.select_by_value("172")
You should also notice there are to id attributes, one of them is with uppercase I, Id="cmbTBC" and id="IdTBC". You need the lowercase one, there might be another dropdown without options with id="cmbTBC", and this is what the driver locate
select = Select(driver.find_element_by_id("IdTBC"))

Visual Studio Coded UI: Select HTML Element by CSS Selector

I have run into a problem selecting an item within Microsoft's CodedUI framework. I have a page full of items that can be added/removed via selecting a checkbox. The checkboxes do not have unique id on them, and I am having trouble selecting other than the first item when looking for a particular Tag/class combination. Is there some trick to doing this that isn't immediately obvious.
There are a couple different options here:
1. You could select the object by selecting the item related to it
<div id="parent">
<label id="checkbox1234">MyCheckBox</label>
<input checked="false"></input>
</div>
... could be selected as:
HtmlDiv parent = new HtmlDiv(browserWindow);
parent.SearchProperties["innerText"] = "MyCheckBox";
HtmlCheckBox target = new HtmlCheckbox(parent);
target.SearchProperties["TagName"] = "INPUT";
return target;
or
HtmlLabel sibling = new HtmlLabel(browserWindow);
sibling.SearchProperties["id"] = "checkbox1234";
UITestControlCollection col = sibling.GetParent().GetChildren();
foreach (UITestControl control in col)
{
if (control.ControlType.ToString().Equals("HtmlCheckBox"))
{
return (HtmlCheckBox)control;
}
}
You can use these test utilities created by Gautam Goenka. They worked wonders for me as far as identifying the content of an object and using it for assertions. Still, if you don't have any meaningful way of identifying the objects based on content, this won't help you either. When all else fails, add some useful identifying properties to the HTML.

dropdown selected but watir says disabled

I'm able to set an option in a dropdown list, but then I get an error message. I found an online site that will return the same error:
http://www.100candles.com/floating_candles.htm
irb(main):124:0> $ie = Watir::IE.attach(:url, /100candles/)
=> #<Watir::IE:0x..fd64f0146 url="http://www.100candles.com/t/Vessels?PN=1&SB=Updated" title="Vessels - 100 Candles">
irb(main):126:0> $ie.select_list(:name, "SB").flash
=> #<Watir::SelectList:0x4960ea5e located=true specifiers={:tag_name=>["select"], :name=>"SB"}>
irb(main):127:0> $ie.select_list(:name, "SB").select("Price")
Watir::Exception::ObjectDisabledException: object {:index=>0, :ole_object=>#<WIN32OLE:0x3759e58>} is disabled
from C:/Ruby193/lib/ruby/gems/1.9.1/gems/watir-classic-3.4.0/lib/watir-classic/element.rb:329:in `assert_enabled'
from C:/Ruby193/lib/ruby/gems/1.9.1/gems/watir-classic-3.4.0/lib/watir-classic/element.rb:470:in `perform_action'
from C:/Ruby193/lib/ruby/gems/1.9.1/gems/watir-classic-3.4.0/lib/watir-classic/input_elements.rb:117:in `select'
from C:/Ruby193/lib/ruby/gems/1.9.1/gems/watir-classic-3.4.0/lib/watir-classic/input_elements.rb:46:in `each'
from C:/Ruby193/lib/ruby/gems/1.9.1/gems/watir-classic-3.4.0/lib/watir-classic/input_elements.rb:46:in `block in select'
from C:/Ruby193/lib/ruby/gems/1.9.1/gems/watir-classic-3.4.0/lib/watir-classic/element.rb:472:in `perform_action'
from C:/Ruby193/lib/ruby/gems/1.9.1/gems/watir-classic-3.4.0/lib/watir-classic/input_elements.rb:41:in `select'
from (irb):127
from C:/Ruby193/bin/irb:12:in `<main>'
irb(main):128:0>
Problem
The selection works for some options (ex Bulk Cost) but not others (ex Price). Looking at the watir code for SelectList#select:
def select(item)
matching_options = []
perform_action do
matching_options = matching_items_in_select_list(:text, item) +
matching_items_in_select_list(:label, item) +
matching_items_in_select_list(:value, item)
raise NoValueFoundException, "No option with :text, :label or :value of #{item.inspect} in this select element" if matching_options.empty?
matching_options.each(&:select)
end
matching_options.first.text
end
And the page html:
<select id="SB" onchange="document.location='/floating_candles.htm?PN=1&SB=' + this.value;" name="SB">
<optgroup style="font-style: normal;" label="Please Choose">
<option value="">-
<option value="PieceCost">Bulk Cost
<option value="Updated">New Arrivals
<option value="Popularity">Popularity
<option value="Price">Price
<option selected="" value="Relevance">Relevance
</option></optgroup>
</select>
The reason for the exception can be seen:
In SelectList#select, it gathers up all options with the text, label or value that matches the specified criteria. For "Price" (and the other options that fail), the option is collected (ie added to matching_options) twice - once for matching by text and once for matching by value. In contrast, the ones that work (ex Bulk Cost) only get matched once since their text and value is different.
SelectList#select will select each matching_option. In the case of "Price", this means two selections.
The select list on the page has an onchange event that refreshes the page. In the case of "Price", the first selection of the option works (as can be seen when watching the script). However, it is the second selection that fails. I assume that the selection attempts while the page is refreshing, resulting in the exception.
Solution
The solution is to directly select the option element. This ensures that the option only gets selected once:
$ie.select_list(:name, "SB").option(:text => "Price").select

Unable to select a value from drop down in cucumber capybara

I am using cucumber with capybara to automate the web application. i have to select a value from a drop down , but many time i am getting an error like; "wrong argument type String (expected Array) (TypeError)"
I tried with:
1.
second_option_xpath = ".//*[#id='selecttype']/option[2]"
second_option = find(:xpath, second_option_xpath).text
select(second_option, :from => 'selecttype')
2.
select "Selenium Core", :from => 'selecttype'
3.
page.find_and_select_option("selecttype", 2)
4.
select( "selecttype", {"Selenium Core" => 2})
PAGE SOURCE IS SOMETHING LIKE:
<select id="selecttype">
<option value="Selenium IDE">Selenium IDE</option>
<option value="Selenium Code">Selenium Core</option>
<option value="Selenium RC">Selenium RC</option>
<option value="Selenium Grid">Selenium Grid</option>
</select>"
Please suggest where i am doing wrong?
Thanks
Have you tried
page.select('Selenium Core', :from => 'selecttype')
As RobertH suggests, you should use something like page.select, where page is a Capybara::Session instance.
When you call select in your code, you are invoking a method of the Kernel module, which is mixed in the basic Object class, which every class inherits from.
This method expects 4 parameters, 3 of them are arrays of IO objects; that's the reason why it complains about wrong arguments.

Trying to initialize multiple 'select' inputs inside a list item

my first post at StackOverFlow ^_^ (So yeah, i'm a noob, be gentle)
I have searched and actually found several solutions to my question around the web, but for some reason none of them work for me.
So here it goes:
I have a list item, and inside it multiple 'select' inputs, as such:
<li id="langlevels">
<select id="encombobox"></select>
<select id="frcombobox"></select>
<select id="hecombobox"></select>
<select id="rucombobox"></select>
<select id="arcombobox"></select>
<select id="otcombobox"></select>
</li>
Now what i'm trying to do is: Using jQuery, initialize all of the 'select' inputs to values I have in an array:
var lang_levels = new Array("Native Level", "Good Level", "Amateur Level");
The way i'm trying (to no avail) to do this is:
//Initializing language levels combobox values
$("#langlevels > select").each(function () {
for(var i=0; i<lang_levels.length;++i)
{
addOption($(this), lang_levels[i], lang_levels[i]);
}
*/
});
NOTE: addOption() is a method I know to be working because I use it to initialize other, un-nested 'select' inputs.
I would very much appreciate your help!
Thanks in advance :)
OK Got it!
The only problem was this:
addOption($(this), lang_levels[i], lang_levels[i]);
was supposed to be this:
addOption(this, lang_levels[i], lang_levels[i]);

Resources