I have a dropdown which has select2 class. On clicking the arrow in drop down, I get below code activated in DOM which has the values Reason1 and Reason2 in the dropdown. I want to iterate on the available values and select the desired option.
Using each function, I am able to itearte on the array and get the available values, but I am unable to perform cy.click() on the same to get the value selected. I am not getting any error and code is running fine but the click in not happening (neither on div , li nor span tag)
`<ul class="select2-results">
<li class="select2-results-dept-0 select2-result select2-result-selectable">
<div class="select2-result-label">
<span class="select2-match"></span>
Reason1
</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable">
<div class="select2-result-label">
<span class="select2-match"></span>
Reason2
</div>
</li>
</ul>`
Given below is my code
cy.get('#select2-drop > .select2-results').find('li').each(($el,index,$list) => {
let option = $el.find('div').text()
if(option=='Reason2')
{
$el.find('div').click()
}
})
If I add $el.find('div').css('background-color','yellow') in the if condition, elements background color is getting changed to yellow but click is not happening.
Can anyone please help on this.
Thanks!
you can use these command if you want to select the second one
cy.get('#select2-drop > .select2-results')
.type("{downarrow}")
.type("{downarrow}")
.type("{enter}")
Related
I want to add an item in cart with a matching text like 'cashews'. I tried below code but .click() function is giving error as "bind and event handler to the click javascript event"
cy.get('.products').find('.product').each(($e1, index, $list) => {
const textveg = $e1.find('h4.product-name').text() {
if (textveg.includes('Cashews')) {
$e1.find('.button').click();
}
}
})
can someone suggest what can be the possible reason that .click() method is not identified by cypress. I am using cypress version 7
How you do this depends on the structure of the HTML.
It looks like you may have this sort of hierarchy
<div class="products">
<div class="product">
<h4 class="product-name">Almonds</h4>
<button>Add to cart</button>
</div>
<div class="product">
<h4 class="product-name">Cashews</h4>
<button>Add to cart</button>
</div>
</div>
Take the product section containing the text you want, and within that find the products <button>.
Your test might be
cy.contains('.product', 'Cashews') // pick the <div class="product"> with required text
.find('button') // inside the product, find it's button
.click()
You can use .filter() to find your element and click it:
cy.get('h4.product-name').filter(':contains("Cashews")').click()
Alright, I have a item which has this class class="country" and there are 12 elements with the same class. Now I want to get a element on its value. For example Italy. And now I want to click on a link in this item. The class of the link is class="link". So basically I want to click the link of the item with the name Italy
My code at the moment:
cy.get('.country').should('have.text', 'Italy').click();
HTML
<div class="countries">
<div class="text">
<h3></h3>
<div class="country">Italy</div>
<h4>Yala</h4>
<p>test</p>
<a class="link" href="/mysite">Show details</a>
</div>
</div>
Should() is an assertion and won't select the element you want.
you probably want the contains() function.
cy.get('.country').contains('Italy').click()
Best
When executing the test case, this error is shown:
Button with locator 'xpath=//*[#id="stBanner"]/div[2]/a[2]' not found.
The element doesnt't have an id, and I have to use Xpath, but it can't be found.
This is the code when I inspect the element:
<div class="stRight">
<span id="mobileSearchIcon" class="glyphicon glyphicon-search"></span>
<!-- Logged in --><!-- Logged out -->
<a class="user-sts-link" href=" uri=nm:oid:Z6_72A2IA80O0US40QOM4JF0F30O3">REGISTER</a>
<a class="user-sts-link" href="?uri=nm:oid:Z6_72A2IA80O0CSB0Q4ODDFDQ0081">LOGIN</a>
</div>
This is the xpath:
//*[#id="stBanner"]/div[2]/a[2]
This is the testcase:
SeleniumLibrary.Open Browser #{tst3Url}[0] firefox
SeleniumLibrary.Click Button xpath=//*[#id="stBanner"]/div[2]/a[2]
Don't use the Click Button keyword - it is strictly for html elements of the <button> type.
Instead, use Click Element - your target element is an <a>, and with Click Elements the browser will execute the click on it.
Hello I am relatively new to QA automated web testing and I try to use SO as a last resort.
That being said I am having issues selecting a choice from a drop down menu in our web app.
Here is the following code:
<div id="edit-main-user-role-wrapper" class="form-item">
<select id="edit-main-user-role" class="form-select my-dropdown ahah-processed" name="main[user_role]" style="display: none;"></select>
<div class="newListSelected" style="position: static;">
<span class="selectedTxt">
Student
</span>
<ul class="newList" style="top: -136px; height: 136px; left: 0px; display: none;">
<li>
<a class="" href="JavaScript:void(0);"></a>
</li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
When I inspect the drop down icon with Firefox inspect element it directs me to this line in the code: span class="selectedTxt"
I have tried accessing the list by id, class, xpath, and css all to no avail.
Here are some of my past attempts:
#browser.div(:class => 'form-item').select_list(:text => 'Student').fire_event ("on click")
#browser.select_list(:xpath, menu).option(:text, option).click
An element with a select tag should only be meaningful if there are elements with option tags nested inside it. Often these pages have a lot of extra javascript in them to give context.
For dropdowns that don't follow the select/option pattern, you want to click on the element that drops down the list, and then click on the element you want that becomes visible as a result.
This is what eventually worked for me:
#browser.span(:class, "selectedTxt").click # to make the list visible
#browser.element(:xpath, "#{xpath}").click # click on the specified xpath
I know this may not be the most elegant answer, but it works!
not sure if you're still looking for answers, but either of these worked for me:
#browser.select_list(:id => "you_leaving_us").option(:text => "Other").select
#browser.select_list(:id => "you_leaving_us").option(:value => "8").select
Instead of li's, I had options. Hope it works
Using : Cucumber Watir / Web Driver
I am trying to click the drop-down element or any element that will open the list.
My error is:
undefined method `click' for # (NoMethodError)
My Watir code is:
#browser.divs(:class => 'dd-field').click #I have tried other Class names from the html. Can’t get it to click
My HTML ( That is highlighted per firebug ):
<div class="header">Deposit•to</div>
<div class="dropdown" ng-class="secondaryClass()">
<div class="dd-field" on="!selectedAccount" ng-switch="">
-- ngSwitchWhen: false -->
<!-- ngSwitchDefault: -->
<div class="dd-label ng-scope" ng-switch-default="">Select•an•account</div>
<div class="dd-arrow-box">
<div class="dd-arrow"></div>
</div>
I tried Fire on event click without success.
You get that error because you are using #browser.divs instead of #browser.div, notice one is plural divs, which returns a list of <div> elements, so no wonder you can't click a list of elements.
Try use #browser.div instead, which returns one single element and you should be able to click.
#browser.div(:class => 'dd-field').click