I do have popup where are three dropdowns, ids are unique
with each popup generation:
The first element:
<a aria-required="true" class="select" aria-disabled="false" aria-
describedby="5715:0-label" aria-haspopup="true" tabindex="0" role="button"
title="" href="javascript:void(0);" data-aura-rendered-by="5733:0" data-
interactive-lib-uid="10">Stage 1 - Needs Assessment</a>
While I'm able to identify the element above by simple xpath="//*[#class='select'][1]", the other two, which look same to me (example below), can't be identified by index like //*[#class='select'][2], tried 'following' without success, but I may be not correct with syntax.
Example of dropdown element I'm unable to locate..
<a aria-required="false" class="select" aria-disabled="false" aria-
describedby="6280:0-label" aria-haspopup="true" tabindex="0" role="button"
title="" href="javascript:void(0);" data-aura-rendered-by="6290:0" data-
interactive-lib-uid="16">--None--</a>
Any ideas what am I missing?, except advanced xpath knowledge..
Thank you!
//*[#class='select'][2] will return you required node only if both links are children of the same parent, e.g.
<div>
<a class="select">Stage 1 - Needs Assessment</a>
<a class="select">--None--</a>
</div>
If links are children of different parents, e.g.
<div>
<a class="select">Stage 1 - Needs Assessment</a>
</div>
<div>
<a class="select">--None--</a>
</div>
you should use
(//*[#class='select'])[1]
for first
(//*[#class='select'])[2]
for second
Related
I'm trying to create a selector that matches "several" items in my dom.
Dom may look like this:
<a class="email-item">
<span class="title">Newsletter</span>
<span class="from">a#a.com</span>
</a>
<a class="email-item">
<span class="title">Newsletter</span>
<span class="from">a#a.com</span>
</a>
<a class="email-item">
<span class="title">Newsletter</span>
<span class="from">b#b.com</span>
</a>
I try to find all a-elements that do have the title "Newsletter" as innerText AND are from "a#a.com"
so kind of a combo-selector...
Thanks for your help!
Ray
Use the filter method to find elements that match the conditions.
I have one check box and two links with same classes & same Div.During the automation testing using protractor, i want to click on check box but it click on Links.
i am writing this code but its not working, please provide a solution.
Code:
element(by.id('Remember')).click();
[1
please find HTMl code:-
<div class="input-field">
<div class="pas_rembr">
<input name="remember" id="Remember" class="css-checkbox ng-dirty ng-valid-parse ng-touched ng-not-empty ng-valid ng-valid-required" ng-model="rememberMe" type="checkbox" ng-required="true" required="required">
<!-- <label for="Remember" class="css-label">I agree with the <a class="text_link" target="_blank" ng-href="{{baseUrl}}terms-conditions">Terms & Conditions</a>.</label> -->
<label for="Remember" class="css-label">I have read and I agree with <a class="text_link" target="_blank" ng-href="/lmd/terms-conditions" href="/lmd/terms-conditions">Terms and Conditions</a> and the <a class="text_link" target="_blank" ng-href="/lmd/privacy" href="/lmd/privacy">Privacy Policy</a> of this site.</label>
</div>
<span class="errorForm ng-hide" ng-show="(memberForm.remember.$dirty || submitted) && ((memberForm.remember.$error.required))">
<span class="errorForm ng-scope ng-hide" ng-show="memberForm.remember.$error.required" translate="TERAMS_CONDITION_IS_REQUIRED">Terms and condition is required</span>
</span>
</div>
Try this:-
var el = element(by.css('label[for="Remember"]'));
browser.actions().mouseMove(el, {x: 20, y: 3}).click().perform();
For your tests, the CSS selector would be
element = $$('label.css-label > a:nth-child(2)');
This should be able to click on the second a child of the label element.
Please help me the locate the check box and select. There are multiple check boxes, there is no way to locate them uniquely.
Here is the Code for one of such check box.
Thanks in Advance for the Help!!!
<div class="col-xs-2 col-sm-2 col-lg-2" style="height:65px">
<ul class="list-inline pull-right">
<li>
<md-input-container class="md-block">
<md-checkbox value="$index+1check" class="checkbox ng-valid ng-dirty ng-touched ng-empty" ng-model="item.Selectedd" ng-click="toggle($index+1, selected,item.TitleId,item)" icon,md-checkbox.md-checked._md-icon="{background-color: green;}" id="Cbk_List" role="checkbox" tabindex="0" aria-checked="false" aria-invalid="false" style=""><div class="_md-container md-ink-ripple" md-ink-ripple="" md-ink-ripple-checkbox=""><div class="_md-icon"></div></div><div ng-transclude="" class="_md-label">
</div></md-checkbox>
</md-input-container>
</li>
<li>
<div class="manageTitle_CirclCard">
<div class="ng-binding">2</div>
</div>
</li>
</ul>
</div>
You should try to locate using cssSelector with it's attribute tabindex as below :-
#Cbk_List[tabindex='0']
Edited :- If checkbox element has not any attributes with unique value, you should try using xpath with index, assuming you want to get first checkbox element, then try below xpath :-
(.//*[#id = 'Cbk_List'])[1]
Note :- In above xpath, just change the index from 1 to desire one checkbox to find.
<ul>
<li class="active">
<a href="#">
<i class="fa fa-home"></i><br>
<span class="title">Home</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-rss-square"></i><br>
<span class="title">Posts</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-calendar"></i><br>
<span class="title">Events</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-bar-chart-o"></i><br>
<span class="title">My Activity</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-edit"></i><br>
<span class="title">Assessments</span>
</a>
</li>
</ul>
I want to locate the respective span element. I want to check the order of the span elements using css selector. So when I use selenium IDE,I will verify it like below(using nth child concept).
verifyText | css=.title:nth(0) | Home
verifyText | css=.title:nth(1) | Posts
verifyText | css=.title:nth(2) | Events
verifyText | css=.title:nth(3) | My Activity
verifyText | css=.title:nth(4) | Assessments
But when I do the same thing in Selenium WebDriver I am not able to locate the elements with the order which I did using Selenium IDE.
Below are the codes that I used in WebDriver and it dint work.
driver.findElement(By.cssSelector(".title:nth(0)")); // to locate the "Home" element
driver.findElement(By.cssSelector(".title:nth-of-type(0)")); // to locate the "Home" element
driver.findElement(By.cssSelector(".title:nth-child(0)")); // to locate the "Home" element
Could anyone please help me.
You can generate the css-selector from ul like ul > li:nth-child(1) for home. See below:
driver.findElement(By.cssSelector("ul > li:nth-child(1)")); >> home
driver.findElement(By.cssSelector("ul > li:nth-child(2)")); >> posts
driver.findElement(By.cssSelector("ul > li:nth-child(3)")); >> events
also reachin span is the same:
driver.findElement(By.cssSelector("ul > li:nth-child(1) > a > span")); >> home
do you need css specifically? if not, you can also go for xpath, which imho reads better/clearer:
driver.findElement(By.xpath("(//span[#class='title'])[0]")); // home
driver.findElement(By.xpath("(//span[#class='title'])[1]")); // posts
...
<body>
<div class=parent>
<div></div>
<div></div>
<div></div>
</div>
</body>
If you already have the parent element and just need to find nth child
parent.find_element_by_css_selector('div:nth-child(2)')
would select the second div
We can write this way-
To get all the span text like-
Home
Posts
Events
My Activity
Assessments
Then driver.findElements(By.cssSelector("ul>li>a span:nth-child(3)"));
and
To get individual span text then you need to pass the index position in nth-child(index) method.driver.findElement(By.cssSelector("ul>li:nth-child(1)>a span")).getText();//Home driver.findElement(By.cssSelector("ul>li:nth-child(2)>a span")).getText();//Posts driver.findElement(By.cssSelector("ul>li:nth-child(3)>a span")).getText();//Events driver.findElement(By.cssSelector("ul>li:nth-child(4)>a span")).getText();//My Activity driver.findElement(By.cssSelector("ul>li:nth-child(5)>a span")).getText();//Assessments For more details please visit- CSS Selector in Details
driver.find_element_by_css_selector('ul>li:nth-of-type(1)>a>')
I have a Menu which have li
(list) elements which gets enabled after you mouse-hover a particular label.
driver.get("www.snapdeal.com"); Actions actions = new Actions(driver);
actions.moveToElement(driver.findElement(By.id("loggedOutAccount"))).build().perform();
//Wait for 5 Secs
driver.findElement(By.className("accountLink")).click();// Here it's throwing Element not visible exception
This code is doing the mouse-hover properly but not able to click the "SignIn Link" Link. Though on manually checking the element is Visible
DOM Structure -
<div id="loggedOutAccount" class="hd-rvmp-logout">
<a class="signIn" href="javascript:void(0);">
<i class="iconHeader accountUser"></i>
<label class="my-account-lang"> My Account</label>
<i class="mar_2_left right-downArrow breadcrumbArrow-down"></i>
</a>
<div class="sdNavDropWrapper accDetails" style="display: none; z-index: 999;">
<ul class="positionAbsolute pull-right">
<li class="customLoggedInState">
<div class="left triangle"></div>
<div class="right triangle"></div>
<div>
<a class="accountLink" href="javascript:void(0);">Click here to sign in ></a>
</div>
</li>
<li class="stop-event">
<li class="stop-event">
<li class="stop-event">
<li class="stop-event">
<li class="stop-event">
</ul>
</div>
</div>
Please use xpath for both element like below :
driver.get("www.snapdeal.com");
Actions actions = new Actions(driver);
actions.moveToElement(driver.findElement(By.xpath("yourxpathhere"))).build().perform();
driver.findElement(By.xpath("yourxpathhere")).click();
I think class/Id repeating for other elements also for style purpose. so Xpath is better to find unique element.