Firstly ,I was doing cy.contains(option) with it was clicking the exact value eg -I want to click One but One One is also there so cy.contains not working.
I tried Regex but it is not working
I am trying to click the exact match from drop down writing test step as ;
cy.contains(new RegExp(option, "g"))
but not giving me correct output. I am getting error : Timed out retrying after 4000ms: Expected to find content: 'option' but never did.
Since you are using a dropdown, you can and should use the .select() command which will choose the option by exact match:
cy.get('select')
.select('One')
.should('have.value', 'One')
When the dropdown is like this, the above will choose the 2nd option.
<select>
<option>One One</option>
<option>One</option>
</select>
for the regex to work, you need to use the ^ and $ characters to indicate beginning and end of string
// works on <span>One</span> but not on <span> One </span> or <span>One One</span>
cy.get(`span`).contains(/^One$/)
// so you might want to also include white space
cy.get(`span`).contains(/^\s?One\s?$/)
You can click using the dropdown option if you now by default what is the option
cy.get(DROPDOWN IDENTIFIER).eq(NUMBER OF THE DROPDOWN MATCH).click();
What do you want is the .click() function to click on the match.
This will not work if you dropdown menu is a .
Related
I ran into a problem. Can anyone help me ?
So, I have two drop down lists and the second is dependent on the option I choose on the first.
Say, for example: The first drop down list has the options 'numbers' and 'letters', while the second drop down list is empty by default. However, when I choose the option 'letters' on the first drop down list, the second is filled with the options 'A', 'B' and 'C'. Manually, it is working fine, but when I select the first drop down list with Cypress, the second doesnt get filled. It remains empty, so I cant choose anything on it.
HTML:
<select id="list" class="selectpicker form-control" onchange=""><option value="0">select your preferences</option><option value="2">numbers</option><option value="3">letters</option></select>
CYPRESS:
cy.get('#list').select('letters')
it does select the option letters, I can see the option letters selected on the first drop down list, but nothing happens on the second.
The solution from what it seems is to force the click because, from what I could gather, cypress chooses the option but IT DOESNT CLICK THE OPTION! Is this a bug?
So, this is the giant that was necessery, in the end to make it work:
//choose the option on the first drop down
cy.get('#list').select('letters')
cy.get('#list').contains('letters').then(option => {
cy.wrap(option).contains('letters');
option[0].click();
cy.get('#list').contains('letters');
});
//choose the option on the second drop down
cy.get('#list2').select('A')
cy.get('#list2').contains('A').then(option => {
cy.wrap(option).contains('A');
option[0].click();
cy.get('#list2').contains('A');
});
//click on the button to save the options selected
cy.get('.saveButton').click()
when, normally, it should be only:
cy.get('#list').select('letters')
cy.get('#list2').select('A')
cy.get('.saveButton').click()
Do you guys think this is a bug ?
I think you should "force" the refreshing data from the "non-updated" dropdown.
Try to "click()" it.
Something like this:
cy.get('#list')
.contains('letters')
.then(option => { // Confirm have correct option
cy.wrap(option).contains('letters');
option[0].click(); // After click, mdc-select should hold the text of the
// selected option: cy.get('#list').contains('letters');
});
Maybe this link can help you: select dropdownlist item using cypress
alternatively you can select by value cypress docs
cy.get('#list').select('3')
I have a form based on selects for a search with filters (picture attached below).
When i pressed the search button, the page reloads and it reset all the selects.
I try to use the old helper, but it does not work properly, it just takes the first option of the select( and it gets rid of the default option as you can see in the pictures below)
Things to know:
it is a form with a get action, it is not intended to store or edit something, only for search. So, how can i properly get the old data when refresh or after pressing the search button?
This is my first attempt and it did not work
same for this one too.
as you can see in this image, it deletes the default option, and it shows the first option
The old() function will get data by specific key from the flash data. That means you must set the data as a flash before using the old().
Source: https://github.com/laravel/framework/blob/e6c8aa0e39d8f91068ad1c299546536e9f25ef63/src/Illuminate/Http/Concerns/InteractsWithFlashData.php
Documentation: https://laravel.com/docs/5.8/requests#old-input
In the case, if you want to refresh and keep the input, I suggest using the front-end handling way: When you change the input of drop-down list, push the new query string param into the URL by javascript (How can I add or update a query string parameter?) . Until the user tries to refresh the page, the URL was kept your old value. In the blade form, you can use the function to get the param from GET request with a priority higher than the old() function, I don't actually remember the function to get param from URL, but it will seem like:
{{ Request::get('yourInput') ?? old('yourInput') ?? $realEntity->yourInput }}
Use the following in your blade files. You can check if the name exists in the url (query string). Hope this helps :)
{{ Request::get('name') }}
I think, that old() function should work just fine, but you should compare the value of option in foreach.
<select name="tipo_propiedad">
#foreach ($tipos_propiedades as $tipo_propiedad)
<option value="{{$tipo_propiedad->id}}" #if($tipo_propiedad->id == old('tipo_propiedad') selected #endif(>{{$tipo_propiedad->name}}</option>
#endforeach
</select>
I'm currently using Cucumber / Selenium / Ruby to create my automation framework and setup my first test. The one I'm working on involves me to fill in a form in order to proceed to the next stage. The form contains a dropdown with multiple values, of which I want to select one (and any one!)
Inspect Element of the Dropdown Menu
<input type="search" class="ember-power-select-trigger-multiple-input" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" id="ember-power-select-trigger-multiple-input-ember3325" aria-controls="ember-power-select-options-ember3325" style="width: 100%;" placeholder="All classes">
I've therefore made use of the class inside my step below:
My Step
#wait.until {#driver.find_element(:css => 'input.ember-power-select-trigger-multiple-input').click}
At the moment, when I run this, it's able to find the correct dropdown option and click it. The options in the list appear, but obviously nothing happens.
What I'd like to know is how I can extend this further so that the dropdown is selected, and that the "first" option is selected? I don't want to specify what it should be, but it just should randomly select the first from the list and use that.
Any thoughts on the easiest way to achieve this?
Research Snippet
I did some research and found the following snippet which I thought I could add to my code, however I'm unsure if it would actually work, or whether I could use this in conjunction with the #wait.until step that I mentioned above?
groupDropdown = #driver.find_element(:css => 'input.ember-power-select-trigger-multiple-input')
option = groupDropdown.find_element(:css, "option:nth-child(1)")
option.click
#wait.until {#driver.find_element(:css => 'input.ember-power-select-trigger-multiple-input').click}
#wait.until {#driver.find_element(:css => '.ember-view > li > .ember-view > li:nth-of-type(1) > .ember-view > li').click}
This worked.
Until
The “until” method within Selenium requires a “truthy” response to continue with the rest of the code.
What you could do is this:
power_select = #driver.find_element(:css => 'input.ember-power-select-trigger-multiple-input')
#wait.until {power_select.displayed?}
power_select.click
This will wait for the element to be displayed on the page, which returns a boolean, and then follow through with a click
Select
Following on from that, the methods for Selects are hidden within the library quite well, but after searching around for a bit:
To Select by text:
Selenium::WebDriver::Support::Select.new(#driver.find_element(:css => <insert_css_of_select_here>)).select_by(:text, <insert_option_text_here>)
To Select by index:
Selenium::Webdriver::Support::Select.new(#driver.find_element(:css => <insert_css_of_select_here>)).select_by(:index, <insert_index_value_here>)
Selecting by index is what you most likely want to do here, setting the index value to 0 to select the first option.
This will let you select required option of ember-power-select with Capybara:
find('.ember-power-select-trigger').click # Open trigger
find_all('ul.ember-power-select-options > li')[1].click # Select 2nd option
Tested with latest ember-power-select.
You might find the click be quite slow if your Capybara.default_max_wait_time is high, so to speed things further you can do this:
find('.ember-power-select-trigger').click # Open trigger
Capybara.using_wait_time(0.1) do
find_all('ul.ember-power-select-options > li')[1].click # Select 2nd option
end
I am new to automation (Cucumber), and has very less idea of coding. I am looking for the script through which I can click on checkbox or radiobutton. Below is the HTML code I am looking at:
<"input class="facetoption" type="checkbox" value="facets.price_range%5B%5D=Rs.+2000+and+Below" autocomplete="off">
And below is the step definition which I tried
Step definition:
Then(/^Select the first Price Range Option$/) do
#browser.checkbox(:value => 'facets.price_range5B%5D=Rs.+2000+and+Below').click
end
The value in your locator doesn't match the value in the <input> tag. Compare the strings, and you'll see they are different.
your HTML: "facets.price_range%5B%5D=Rs.+2000+and+Below"
your code: "facets.price_range5B%5D=Rs.+2000+and+Below"
Update your step definition to the following, and it should work:
Then(/^Select the first Price Range Option$/) do
#browser.checkbox(:value =>'facets.price_range%5B%5D=Rs.+2000+and+Below').click
end
I don't know why you try to find checkbox by value. Better option is to find checkbox by id or class:
find('input#id').click()
If you still like to find checkbox by value please use:
find(:xpath, "input[#value='John']").click()
Use a regex so you can focus on the imporant parts, and ignore the unimporant parts
#browser.checkbox(:value => /2000\+and\+Below/).click
I am having trouble getting selenium RC to click on a button. There is a button on a page that has the character "pi" on it and I am trying to click on it. The html code looks something like this
<div id="abc">
<a class="my keys one" keystring="Pi" keyvalue="π"
π
</a>
</div>
This is what I have done so far -
selenium.click("//div[#id='abc']/a[1]");
This returns an OK but on the page, when I see visually, the button is not clicked (on click, the page has to do something).
I have tried other stuff like getting the Attribute and making it click on it, but doesnt work-
selenium.click(selenium.getAttribute("//div[#id='abc']/a[1]#keystring"));
I have even tried converting the above selenium.getAttribute to a unicode value and then clicking on it. That does not work too.
Also, I added a line to check if at least selenium thinks the character pi is present on the page. I used the unicode of pi-
selenium.isElementPresent("\u03c0");
On eclipse, when I run it, this shows up- isElementPresent[?, ] on session...
and returns a false.
I am stumped. Can anyone please point to me what is it that I am doing wrong?
i thin this may help you.
selenium.click("//a[#class='my keys one']");
or
selenium.click("xpath=//a[#class='my keys one'"]");
if it is not workin use css path.
I a similar issue. My button has a "black down-pointing triangle" on it and none of the other attributes are unique (the "class", "id", and "role" are reused over and over on the same page). The only unique thing I have is a "value" that is a symbol.
value="▼ "
I, too, would like to know if there is a way to click on this button.