Using Element's tool tip as Locator in Selenium Webdriver - extjs

Can we use button's tool tip as a locator in selenium WebDriver? I came across this question because none of the default locators provided in selenium webdriver are useful for my applications elements.
Elements in the application i am testing randomly changes its,
Id,
Xpath-pos,
Xpath-relative Id, and
CSS
everytime the page is Refreshed! This happens because the application is created in ExtJs and HTML 5.

Yes, you can. But please show your HTML code. There are no general answers.
For example, this ExtJS demo here. http://try.sencha.com/extjs/4.1.1/demos/Ext.Button.tooltip.1/
<button id="button-1009-btnEl" type="button" class="x-btn-center" hidefocus="true" role="button" autocomplete="off" data-qtip="I'm a custom tooltip" style="height: 16px;">
<span id="button-1009-btnInnerEl" class="x-btn-inner" style="">Button w/ QuickTip (qtip) tooltip</span>
<span id="button-1009-btnIconEl" class="x-btn-icon "></span>
</button>
The tooltip is coded as data-qtip attribute. So you can use CSS Selector or XPath to find it.
XPath: //button[#data-qtip=\"I'm a custom tooltip\"]
CSS: button[data-qtip=\"I'm a custom tooltip\"]

Good question !
I would like to discuss it with some more experts but as far as my knowledge goes i dont think u can use tool tips as locators in webdriver!
Try this flow, may help you
don't bother if your script fails in IDE
Export it in webdriver/java/Junit
Try running the webdriver script now.

If the tooltip is in the HTML (which it must be), then you'll be able to use an XPath selector to find your element. Post a snippet of the HTML with the element you're trying to locate for more help

Related

XPath for the element with ng-click

I am trying to find a button and click on it. I am using selenium with c# and also have protractor. I am not able to find the element.
<button class="btn--primary quote-summary__card-btn" role="button" aria-label="Choose Essential Cover" ng-disabled="!quoteSecondaryOptionsCtl.pageLoaded" ng-click="quoteSecondaryOptionsCtl.selectCover('Essential', 0)" style="">Choose</button>
could anyone please help me in this?
Try following XPATH.
//button[#class='btn--primary quote-summary__card-btn' and text()='Choose']
It really depends how your page is structured. Do you have any unique identifiers other than the button text? If not, then locate it with XPath:
//button[contains(text(), 'Choose')]
If you want to locate it by your ng-click param then you can use css selector:
button[ng-click="quoteSecondaryOptionsCtl.selectCover('Essential', 0)"]

Unable to click on a link

I have been trying to click on a link in my application at work , but the control failed to click on the link whichever locator I used. I test all the locators with Selenium IDE and javascript before using them in the script and it all seem fine prior to running the test. I manage to identify and click on the link with this:
#FindBy(css ="/html/body/div[4]/div/div/div[2]/div[1]/a/strong") but I ran the test the second time but it failed to click on the link same.
See below the html code:
<div class="container container-outer">
<div class="row-fluid long-text-fitted content-container" id="page-content-container">
<div class="span12">
<div class="row-fluid container-alert">
</div>
<div class="left-side-spacer-layout right-side-spacer-layout" id="page-content">
<div class="button-spacer" id="breadcrumb-content">
<a href="/shopping/marketplace/landingPage">
<strong>< Back to Search Results</strong>
</a>
You should click on parameter. remove strong attribute.
/#FindBy(css ="/html/body/div[4]/div/div/div[2]/div[1]/a")
I would avoid using XPath in general and especially an XPath that starts at the HTML tag. That makes the test very fragile. I would suggest a CSS selector like the below.
driver.findElement(By.cssSelector("#breadcrumb-content > a")).click();
The CSS selector reads find an A tag that is a child (>) of an element with an ID (#) of breadcrumb-content.
Read more about CSS Selectors.
Using absolute Xpath is not a good idea. As you said it is working for the first time then possible your DOM strcture is changing after click it once
You can try with below xpath:
driver.findElement(By.xpath("//strong[contains(.,'< Back to Search Results')]")).click();
If still not working, you should try to click using JavascriptExecutor as it directly working on HTML DOM. Feel free to locate element in below code according to your convenience:
WebElement element=driver.findElement(By.xpath("//strong[contains(.,'< Back to Search Results')]"));
JavascriptExecutor executor = (JavascriptExecutor) driver;
executor.executeScript("arguments[0].click();", element);

Selenium Fluent WebDriver - Click does not work as expected

I have a pagination list, that is essentially constructed like so (I am using AngularJS):
<span id="latestResultsIndicator">
<ul>
<li ng-click="Item.action()"><span>1</span></li>
<li ng-click="Item.action()"><span>2</span></li>
</ul>
</span>
This works great in HTML, but when I try to write an integration test using Selenium WebDriver and the Fluent API I run into problems.
Specifically I want to click on the second li, to do this I am using the following code
I.Assert.Exists("#latestResultsIndicator");
var secondPageElement = I.Find("#latestResultsIndicator ul li:nth-child(2)");
I.Click(secondPageElement);
This doesn't actually work! If I use jQuery in the Chrome console to do $("#latestResultsIndicator ul li:nth-child(2)").trigger("click") then the second page is selected, so I know the selector is correct.
To test further I added a double click like so:
I.DoubleClick(secondPageElement);
What I noticed here is that the very first li gets selected. Its as if its trying to click or select the wrong one! (See the image).
What is happening?
I know Webdriver has some issues with css pseudo-selectors such as nth-child. You might be able to make it work with Xpath, which is just as fast and just as flexible.
var webDriver = (IWebDriver)I.Provider;
webDriver.FindElement(By.XPath("//*[#id='latestResultsIndicator']//ul//li[2]")).Click();
Not sure if it will work or not, as I have not used FluentAutomation.
The CSS selector as it is written in your question is not correct
"#latestResultsIndicator ul li:nth-child(2)"
The UL has the id you're looking for, so it should be
"ul#latestResultsIndicator li:nth-child(2)"
Not sure whether that is going to solve your problem, but it's a place to start. If not, please update with the results

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')

Selenium locator for span loaded with AJAX

I'm new to Selenium IDE and can't find exact answer to my question elsewhere.
I have Login form that loads error message in span tag using AJAX.
Code looks like this:
<dd class="field-error-template atk-form-error">
<i class="ui-icon ui-icon-alert"></i>
<span class="field-error-text">Incorrect login information</span>
</dd>
I used following Selenium code to verify that this span appeared on screen:
waitForElementPresent css=dd.field-error-text span
However it returns false so any other ideas? I don't want to put delay as I don't think it is good practice.
Thanks,
Gita
You got your classes mixed up; the selector should either be this
dd.field-error-template span
Or this
dd span.field-error-text
(or use both classes)

Resources