How to locate the element using Selenium Java - selenium-webdriver

<input name="txtAnswer" class="box1" id="txtAnswer" type="text" maxlength="20">
My code:
driver.findElement(By.name("txtAnswer")).sendKeys("green");

To locate the desired element you can use either of the following Locator Strategies:
Using cssSelector:
driver.findElement(By.cssSelector("input#txtAnswer[class^='box'][name='txtAnswer']")).sendKeys("green")
Using xpath:
driver.findElement(By.xpath("//input[starts-with(#class, 'box') and #id='txtAnswer'][#name='txtAnswer']")).sendKeys("green")
Update
As you are seeing the error Unable to locate element you need to induce WebDruverWait for the element to be clickable and you can use either of the following solutions:
Using cssSelector:
new WebDriverWait(driver, 20).until(ExpectedConditions.elementToBeClickable(By.cssSelector("input#txtAnswer[class^='box'][name='txtAnswer']"))).sendKeys("green")
Using xpath:
new WebDriverWait(driver, 20).until(ExpectedConditions.elementToBeClickable(By.xpath("//input[starts-with(#class, 'box') and #id='txtAnswer'][#name='txtAnswer']"))).sendKeys("green")

Id and class are two attributes for an web-element. to identify web element uniquely(one) id is used and to identify web elements use common properties like class, tag name etc..
so writing xpath with id attribute will give you unique match.
Answer: driver.findElement(By.id("txtAnswer")).sendKeys("green");

Related

How to locate element in selenium for href

I am trying to locate the element for this:
<a ng-if="showLink && customer.partnerType == 2 && customer.isDirectCustomer" class="cp_text_link ng-binding ng-scope" ng-href="/?orgId=77bc101729ad844e39c4c1e17231c7e4&orgName=Attunix" href="/?orgId=77bc101729ad844e39c4c1e17231c7e4&orgName=ABC">
ABC
</a>
I tried the XPath and CssSelector but its unable to locate element.
Can someone pls help me locate the element
TIA
Simply use text:
driver.findElement(By.xpath("//a[contains(text(),'abc')]"));
It is quite hard to come up with an exact locator without seeing the full code of the page, you're trying to automate.
From what I can see so far it makes sense to stick to ABC text so try the following:
Partial Link Text
driver.findElement(By.partialLinkText("ABC"));
Or the equivalent XPath
driver.findElement(By.xpath("//a[contains(text(),'ABC')]"));
Try using class
driver.findElement(By.cssSelector("a.cp_text_link"))
The desired element is an Angular element so to locate and invoke click() on the element you have to induce WebDriverWait for the element to be clickable and you can use either of the following Java based Locator Strategies:
partialLinkText:
new WebDriverWait(driver, 10).until(ExpectedConditions.elementToBeClickable(By.partialLinkText("ABC"))).click();
cssSelector:
new WebDriverWait(driver, 10).until(ExpectedConditions.elementToBeClickable(By.cssSelector("a.cp_text_link.ng-binding.ng-scope[ng-href*='orgId'][href$='ABC']"))).click();
xpath:
new WebDriverWait(driver, 10).until(ExpectedConditions.elementToBeClickable(By.xpath("//a[#class='cp_text_link ng-binding ng-scope' and contains(#ng-href, 'orgId')][contains(#href, 'ABC')]"))).click();

Selenium webdriver convert CSS selector to XPath

This is for Selenium webdriver xPath. Please refer to screen capture. I am writing following XPath for Collection #1 button, but this is just temporary text which has been given to button. but this text will be change once BLL is implemented. So how do I define XPath? In screen capture UI and HTML is there.
For now I gave following xpath in my script.
//*[#class='infix' and text()='Collection #1']
This is xPath
/html/body/esx-root/div/esx-prospect-landing/esx-community-search-hero/div[2]/div[2]/div/button[1]
This is CSS
html body esx-root div.container esx-prospect-landing.ng-star-inserted esx-community-search-hero div.content-wrapper div.bottom-wrapper div.hero-actions button span.infix
This is CSS Selector
.hero-actions > button:nth-child(1) > span:nth-child(2)
How do I define short way XPath in my script.
You should go for some tutorial to write effective and customized xpath or css path
There are lots of tutorials website you can refer as per your interest.
https://www.guru99.com/xpath-selenium.html
https://www.softwaretestinghelp.com/css-selector-selenium-locator-selenium-tutorial-6/
https://selenium-by-arun.blogspot.com/2012/12/25-locate-ui-elements-by-xpath.html
Always prefer relative xpath instead of absolute xpath and top of it, prefer CSS selector until you don't have final choice to using xpath (locate element based on text)
Now for your case you can refer below xpath to locate the element based on text
//div/button[contains(.,'Collection #1')]
OR
//button/span[class='infix'][contains(.,'Collection #1')]
And below CSS selector
.hero-actions>button span.infix
Additionally, you can take the other surrounding elements to make it unique.

Selecting Dynamic ID

<div class="html5-video-player iv-module-created iv-module-loaded endscreen-created paused-mode" tabindex="-1" id="player_uid_960859542_1" data-version="//s.ytimg.com/yts/jsbin/player-en_US-vfl_cdzrt/base.js" aria-label="YouTube Video Player">
Is there a way for me to select the above element? The id is randomly generated each time and is the css selector (#player_uid_960859542_1) and xpath (//*[#id="player_uid_960859542_1"]). I've tried using the class but it's a compound name. I tried By.cssSelector(".html5-video-player.iv-module-created.iv-module-loaded.endscreen-created.paused-mode") but that also failed.
The mentioned XPath and CSS path is not working because the value of ID is generated dynamically and both XPath and CSS are designed such that it takes ID value to generate the paths while using firebug. however you can try this XPath :
//*[#data-version='//s.ytimg.com/yts/jsbin/player-en_US-vfl_cdzrt/base.js'][#aria-label='YouTube Video Player] In case if it doesn't work you have an option to find a stable element in the DOM and then have an privilage of moving on parent node, child node or sibling node (watch the video for more detail; links are below).
Earlier I was facing the very similar issue and after a lot of R&D I found many ways to handle it using XPath and CSS selector customization.
I have made a video to get the more insights of it. Watch these two videos:
Create XPath for dynamic elements and
Create CSS path for dynamic elements
I'm sure it will help you out as there are many ways to design path to reach out to this element.

Finding a link in selenium webdriver

<div class="list_details">
<p class="lnk_primary show_inline" rv-text="config.app.message.Label.abc.SmallScreen.58384" rv-on-click="current.eventGoToName">Add name</p>
</div>
I tried finding the link 'Add name' by using 'linktext' and 'partiallinktext' but it throws unable to locate element. I tried using classname but it also failed. Finally i used xpath to work.
My Code:
driver.findElement(By.linkText("Add name")).click();
driver.findElement(By.partiallinkText("name")).click();
driver.findElement(By.className("lnk_primary show_inline")).click();
Please let me know whether am i making any mistake?
Sample program to find link using linktext :
FirefoxDriver driver = new FirefoxDriver();
driver.get("https://www.google.co.in/?gfe_rd=cr&ei=2FqBVNuuJOzV8gea24GwDA&gws_rd=ssl#q=google");
driver.findElement(By.linkText("Google")).click();
please share your site URL so I can check.
By.linkText and By.partiallinkText are only looking for the
<a> tag. Since your link is in a <p> tag, it will not be found. Finding the element by xpath, like you have been able to do, is the better solution!
Based off experience and this question, By.className will not work for finding elements with more than one class. You could use xpath again or By.cssSelector instead to locate the element, such as:
By.cssSelector('.lnk_primary.show_inline')

how to locate an element by value using css selector in webdriver?

For the following element, how to find it by the value of the td using css selector? In this case it's "unique text"
<td class="someclass" colspan="3">
unique text
</td>
You could use something like this,
With CSS Selector,
By.cssSelector("td[class='someclass'][value='unique text']");
For more information on using css selector, See here
We can create a XPath something like the below:
//td[contains(text(), 'unique text')]
Using the following XPath always gives me expected result and performance. See my another answer here
//td[.='unique text']
WebElement element =
driver.findElement(By.cssSelector("input[value='value to be taken']")); //This line is to select Radio Button
element.click();
You may use the CSS method to locate the element by its class name.
css=".someclass"
See more examples here.
You can locate the WebElement either using dynamic xpath or dynamic css
css-
WebElement css = driver.findElement(By.cssSelector("td#someclass"));
xpath-
WebElement xpath = driver.findElement(By.xpath("//td[text,'unique text']"));

Resources