locating html elements with selenese in a test - testing

while writing some acceptance tests for my webapp (playframework based),I got confused by the usage of some selenium commands.
In my html page,I have a submit button like this
<input type="submit" id="removecartitem" value="remove"/>
to locate this,I used
assertElementPresent(id='removecartitem')
however,this fails,
assertElementPresent id='removecartitem' false
The selenium documentation says
id=id: Select the element with the specified #id attribute.
but,if i simply put
assertElementPresent('removecartitem')
Then,the test is executed correctly.This is the source for confusion, since the default way is to select the element whose name attribute is 'removecartitem' ,and I haven't mentioned any name attribute in my html
Any idea why this happens?

It looks like you need to remove the single quotes according to the documentation you provided...e.g:
assertElementPresent(id=removecartitem)

Related

Unable to locate the login box by type attribute or xpath

HTML looks like following
<input class="text-input text-input-md" dir="auto" ng-reflect-klass="text-input" ng-reflect-ng-class="text-input-md" type="email" aria-labelledby="lbl-14" autocomplete="off" autocorrect="off" placeholder="" ng-reflect-type="email">
the code fails to find login box...tried by attribute
var email_xpath = "//*[type='email']"
then xpath
var email_xpath = "/html/body/ion-app/ng-component/ion-split-pane/ion-nav/page-login/ion-content/div[2]/ion-list/ion-item[1]/div[1]/div/ion-input/input"
var email = webDriver.findElement(By.xpath(email_xpath))
but still unable to get the element....
===============Updated===============
most of the solutions posted below works with selenium firefox driver. The issue was really with htmlunit driver that i was using in scala. Probably it cannot handle javascript properly. I changed it with firefox driver and your solutions works well. The application being tested is an Ionic app (angular), hence i will have to look for another headless solution later.
//*[type='email'] is not correct XPath. Try below instead:
//*[#type='email']
Note that type='email' predicate means child node with string value 'email':
<input>
<type>email</type>
</input>
While #type='email' means attribute type with value "email"
The previous answer is correct but You can try this also //input[#type='email']
The generic syntax is something like as mentioned below for xpath
// - means relative xpath, can be present anywhere inside DOM
tagName - means html tags like td,tr,span,br,input etc
#- denotes start of attribute name present inside html tag
value - actual attribute value present inside DOM
//tagName[#attribute='value']
You can use any XPath, as some are already mentioned by #Andersson and #zsbappa
some others are
//input[#class='text-input text-input-md' and #type='email']
//input[contains(#type,'email')]
Since you are using WATIR, you don't have to write xpath, write the below code, it would work.
b.text_field(type: "email").set "abc#gmail.com"

Selenium WebDriver - Find Element

I've gone through the Selenium Documentation for locating elements, but I can't seem to figure out how to find the element in my code.
Here is my code from my .cshtml:
<a onclick="alter('#key', '#value')" href="#edit" id="#key-display">#value</a>
I am trying to locate and click the #value at the end.
Here is what it looks like when I inspect the value on Chrome:
<a onclick="alter('February 9, 2018', '1.00000')" href="#edit" id="February 9, 2018-display">1.00000 gallons</a>
I am able to locate the element by link text like this:
chromeDriver.FindElementByLinkText("1.00000 gallons").Click();
However, the link text will change constantly and I want to be able to locate it after it changes.
I have tried locating by several ways:
chromeDriver.FindElementByLinkText("#value").Click();
chromeDriver.FindElementByXPath("//a[#id='#key-display']").Click();
chromeDriver.FindElementById("#key-display").Click()
You will have to locate the element by the HTML in the page after it's rendered so the cshtml variable name can't be used. Having said that, you should be able to find a locator that will work. I would start with a CSS selector like
a[href='#edit']
That should work unless you have multiple edit links on the page. If that doesn't work, I would try
a[href='#edit'][id$='-display']
To find the element and invoke click() on the element you can use either of the following Locator Strategies :
xpath (where ID contains -display and href is #edit)
"//a[contains(#id,'-display') and #href='#edit']"
You can be more granular adding the onclick attribute as :
"//a[contains(#id,'-display') and #href='#edit' and starts-with(#onclick,'alter')]"
cssSelector (where ID ends with -display and href is #edit)
"//a[id$='-display'][href='#edit']"
You can be more granular adding the onclick attribute as :
"//a[id$='-display'][href='#edit'][onclick^='alter']"

Contains CSS Selector to fill a form with nightwatch / selenium

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

Handle elements that have changing ids all the time through Selenium Webdriver

I am running the script to automate test cases and having this unique problem.
I have detected and used IDs of the elements for click etc. purpose. However, all of a sudden these ids have changed and the script works no more.
Another weird thing is those IDs are same as in script when inspected in Chrome but different in Firefox driver browser.
Firebug for test driver: -
<p class="description" onclick="selectElementTextListForIE(this,'tile29', 'tile19');selectElementTextList(this,'tile29', '')" id="tile29_span_0_0">
Platinum
</p>
Chrome inspector for same element: -
<p class="description" onclick="selectElementTextListForIE(this,'tile20', 'tile19');selectElementTextList(this,'tile20', '')" id="tile20_span_0_0">
Platinum
</p>
Also, what could be the best strategy for detecting such elements whose IDs are generated on run.
I even tried using XPATH but that too contains id's reference
eg. #id="tile276_input
Any help will be appreciated.
Thanks.
Abhishek
You can utilize CSS for this. For your element, looks like its:
<* id="tile276_input" />
What you need to do is find out what is changing about it. I assume it's the number inbetween. If it is, then your selector would look something like:
By.cssSelector("*[id^='tile'][id$='input']")
This will look for anything that has an ID that "starts with tile" and "ends with input. In our case, "tile276_input" matches that.
See this article if you want more information
You also can try contains and starts-with() for such things
driver.findElement(By.xpath("//*[contains(#id,'title')]"))
or
driver.findElement(By.xpath("//* [start-with(#id,'title')]"))
WebElement element = driver.getElement(By.cssSelector("[id^='title']);
Or
WebElement element = driver.getElement(By.cssSelector("id:contains('title')"));
You Can use this element to do desired actions.

How to check if a text is in web page in Robot Framework and Selenium

I'm currently creating an automation test for a website and I want to check if a text(s) is in the page. I could use the keyword 'Page should contain' to check; however, I want it to be a little more specific on having it check specifically where the text exist in the page. Is there a way I can have it check if a specific div contains the text?
You can easily do this with a built-in Selenium2Library tags.
For a partial match use this:
Element Should Contain locator expected_text
For an exact match use this:
Element Text Should Be locator expected_text
If your HTML code is something like:
Your div tag and need to find FindMe
<div class="gwt-Label">This FindMe DIV</div>
Then you can find "FindMe" text like:
//div[#class='gwt-Label'][contains(string(),'FindMe')]