I want to access the 2nd element with same class name using css selectors.
1st element:
<a class="good">
2nd element:
<a class="good">
Css selector I am using :
a.good
but this accessing both of them.
How to access the 2nd one or anyone individually?
you can use pseudo selector, pseudo selector matches elements based on their position among a group of siblings.
check example link below
click here
Related
Please find the HTML :
<div id="086" data-activity-type="CompatCheck" class="Activity"></div>
Here only constant value is data-activity-type="CompatCheck" and classname is same for all the other elements.
while trying to print id using data-activity-type i.e. CompatCheck using xpath
Expected output:
086
Problem 2 : Observed that the only unique value is id, how can we fetch in this case.
Please Find the HTML :
<div id="0007" data-activity-type="CompatCheck" class="Activity"></div>
<div id="110007" data-activity-type="CompatCheck" class="Activity"</div>
While trying to use following code line :
findElement(By.xpath("//div[#data-activity-type='CompatCheck']")).getAttribute("id");
I'm getting only first id i.e; 0007
but I need always the second id="110007", can you please suggest to get the second id
As the attribute data-activity-type="CompatCheck" is unique you can use it and you can use either of the following the following locator strategies::
Using cssSelector:
System.out.println(driver.findElement(By.cssSelector("div[data-activity-type='CompatCheck']")).getAttribute("id"));
Using xpath:
System.out.println(driver.findElement(By.xpath("//div[#data-activity-type='CompatCheck']")).getAttribute("id"));
Console output:
086
With XPath or CSS Selectors you can locate web element based on any constant attribute value. I.e. it can be based on constant class name value or id or any other attribute. In your case the constant attribute value is data-activity-type="CompatCheck". So, you can locate this element by XPath or by CSS Selector and then extract the id attribute as following:
XPath
driver.findElement(By.xpath("//div[#data-activity-type='CompatCheck']")).getAttribute("id");
CSS Selector
driver.findElement(By.cssSelector("div[data-activity-type='CompatCheck']")).getAttribute("id");
Quick one, i am trying to avoid using xpath and using css selectors due to performance issues xpath can have so i would like to know the right approach of locating for example "A" in the list
<div class="input-search-suggests" xpath="1">
<div class="input-search-suggests-item">A</div>
<div class="input-search-suggests-item">B</div>
<div class="input-search-suggests-item">C</div>
</div>
Currently i am locating A using xpath / span but it would be indeed sufficient locating all elements and then grabbing A from the list that have same class which is "input-search-suggests-item"
#FindBy(xpath = "//span[contains(text(),'A')]")
CSS_SELECTOR does not have support for direct text what xpath has.
What this means is, for the below xpath
xpath = "//span[contains(text(),'A')]"
based on text A you can not write a css selector.
Instead to locate A using css selector, you can do :
div.input-search-suggests > div.input-search-suggests-item
In Selenium something like this :
#FindBy(cssSelector= "div.input-search-suggests > div.input-search-suggests-item")
Even though it will have 3 matching nodes, but findElement will take the first web element.
Also you may wanna look at nth-child(n)
div.input-search-suggests > nth-child(1)
to make use of index to locate A, B, C
Here is the Reference Link
I have this very complicated xpath:
/html/body/div/div/div[2]/div/div/div/div[3]/div/table[1]/tbody/tr/td/table/tbody/tr/td/table/tbody/tr/td/table/tbody/tr/td[1]/table/tbody/tr/td/table/tbody/tr[1]/td/div/div/table/tbody[1]/tr[3]/td[2]/div/table/tbody/tr/td/table/tbody/tr/td[1]/span/input
The span has this class="z-combobox-designation z-combobox".
I need to access the span element using its class and not through xpath. Is it possible with cssSelector? Can someone give me a hint how to do it?
Yes you can use css selector in this way to select your element based on compound classes
driver.findElement(By.cssSelector(".z-combobox-designation.z-combobox"));
or specify the tag name with classes like span.z-combobox-designation.z-combobox
If you have same kind of element more then one in your HTML then consider the unique parent of it and locate the same
E.g. there is parent table of your element which have unique id e.g. so you can consider that table tag fist and locate span based on that table e.g.
table#someid span.z-combobox-designation.z-combobox
My Problem:
The Page I try to test with NightwatchJS Contains Some Input Fields that have the Same beginning, but a random number is added. I want to Fill the Textfield on the page. Only one with this name is present on the same time.
<input id="groupNamec7aed06a-67a1-4780-9cc3-5b985666adb9" class="d-styled-input" data-value-update="keyup" data-bind="value: name" title="">
Is the definition of the Field. groupName is every Time the same, but the number changes.
Is there a possibility to use CSS Selector in nightwatch instead of XPATH?
You can try this way :
input[id^="groupName"]
From MDN > Attribute selectors :
[attr^=value] : Represents an element with an attribute name of attr and whose first value is prefixed by "value".
Unfortunately CSS Selector does not provide such a way. You could use a different CSS Selector to match inputs with an id and get those as a list. Afterwards using getAttribute('id') you could do it manually, but this seems like unnecessary effort to me and I'd recommend just using Xpath.
Ofcourse you could try and get a different unique CSS Selector. If it's in a form you could locate the form and use :nth-child but if I remember correctly this has limited/no support in IE.
Edit Apparently IE9 and later does support :nth-child
I have this code for xpath and html:
<a class="WatchButton inicon" rel="nofollow" data-productid="111124">
xpath=/html/body/div[2]/div[2]/div/div[2]/div[1]/div[1]/div[2]/div[8]/a
How can I get the data-productid value?
Just add #data-productid to the xpath expression:
/html/body/div[2]/div[2]/div/div[2]/div[1]/div[1]/div[2]/div[8]/a/#data-productid
Note that the xpath expression you have is very fragile since it depends on a bunch of elements and their relevant positions. Try to rely on the element's attributes or one of it's containers - look for id and class attributes. For example:
//a[contains(#class, "WatchButton")]/#data-productid
This gets the first link anywhere on a page that contains WatchButton class and retrieves it's data-productid attribute value.
* Sharing the link to the web page or showing the complete HTML could help to provide you with a more reliable xpath expression.