How to identify in selenium IDE an input followed by a label? - selenium

I have to identify a check-box using the label which follows it.
the code is the following:
<input type="checkbox" checked="" value="1" id="email-100-100" name="email-100-100">
<label for="email-100-100" class="firefinder-match">Email me when someone asks me to set a flag</label>
<br>
</td>
I tried
Target://following-sibling::label[text()="Email me when someone asks me to set a flag"]
Target://preceding-sibling::label[text()="Email me when someone asks me to set a flag"]
but in both cases selenium finds the text of label but not the check-box.
Could somebody help me in this?
Thank you in advance

Try
Target://label[text()="Email me when someone asks me to set a flag"]/../input[#type='checkbox']
It will work as long as the containing element of the label and checkbox only has one checkbox in it.

You can also find a label that contains text, which is useful for a partial match. In my case I had something like this:
<label for="blah">
<input name="blah" id="blah" type="checkbox" />
Store Locator Plus
</label>
The accepted solution worked for the specific example cited but requires an exact match. Since this comes up on the top of search results I figured I'd present the partial-match solution here as well.
For Selenium IDE you can set a target like this:
//label[contains(text(),'Store Locator Plus')]//input[#type="checkbox"]
The contains function was required because the label text had an HTML element as well which thwarted the //label[text()='Store Locator Plus'] target.

Related

KarateUI - Finding inputs by placeholder attribute

I've been having trouble around finding elements by attribute/property. Following UI visible example:
<input tabindex="0" placeholder="www.stuff.com/example" type="text" id="sub-selector-37" class="form-control" value="">
The unique piece is the placeholder text.
I've tried the following:
And waitFor('input[placeholder=www.stuff.com/example]') - Error
And waitFor('input[placeholder="www.stuff.com/example"]') - Error
And waitFor('input[placeholder='www.stuff.com/example']') Finds nothing
Also tried a more direct input approach:
Then waitFor('{}Something else')
Then input('input[placeholder=www.stuff.com/example']', 'Stuff')
I'm hoping this is just good old PEBKAC on my part. Any suggestions would be greatly appreciated.
Here you go, use double-quotes and nest single-quotes:
And waitFor("input[placeholder='www.stuff.com/example']")
A tip: use the debugger and you can experiment with things like highlightAll('input') and narrow down what works: https://twitter.com/KarateDSL/status/1252817691963830272

How to match xpath for id element that changes each time page loads?

I have these 2 xpath that are different each time I load a webpage.
The xpaths were recorded by Selenium-IDE and always have mainForm_view within the id string and the text before and after this always changes.
xpath=//input[#id='abc_hyd_wuu2_8333nd_mainForm_view_jjd_uueue2_jjd_11_jkdhd']
xpath=//div[#id='abc_hyd_wuu2_8333nd_mainForm_view_kcjjcs_sjsjs_jjdj_994_kkk']/div/div[2]/div/div/div/a[1]/h2
I've tried to locate the id like below but doesn't work.
xpath=//input[contains(#id,'mainForm_view')]
xpath=//div[contains(#id,'mainForm_view')]
Which would be the correct way to do it?
Thanks in advance.
UPDATE
I've tried with CSS selector like below but it seems is taking another id that is within an input element
document.querySelector("input[id*='mainForm_view']").id
Examining the html code I see that the id I need is related with a unique class. The code is like below:
<div class="Class_p2">
<div class="Class_p3" style="...">
<input name="8333nd$mainForm$view$jjd$uueue2" type="text" class="class a1 n1-Control" value="xyz" id="8333nd_mainForm_view_jjd_uueue2" disabled="disabled" style="..">
</div>
<input name="8333nd$mainForm$view$ttyi" type="text" disabled="disabled">
</div>
I've tried the following Javascript code in Chrome console but it doesn't work
document.getElementsByClassName("class a1 n1-Control").id
How would be to get the id=8333nd_mainForm_view_jjd_uueue2 that is related with Class=class a1 n1-Control?
UPDATE2
I was finally able to do it with
document.getElementsByClassName("class a1 n1-Control")[0].id
Thanks for all the help and time.
You can write css selector as :
input[id*='mainForm_view']
for div it'd be :
div[id*='mainForm_view']
Asterisk is to match the sub string part.
Note that if any id contains mainForm_view that will also be selected, so better to check in developers tool before proceeding.
You can try finding some other element for which xpath/css locator remains same and then try to reach to this element by traversing from there. You can use parent, ancestor, preceding-sibling, following-sibling keywords in order to traverse. Hope it helps :)

Get selected content in a number input when click

I guess is not too much difficult but your help will be useful as always.
I had before a text input where the user if click in it select all the content from this input to be able to replace faster his content like in the next example:
<input type="text" value="whatever" onclick="this.setSelectionRange(0, this.value.length)">
So, my question will be, how can I do the same behaviour in a numeric input like the next one?
<input type="number" value="1111">
I tried to add obviously this onclick="this.setSelectionRange(0, this.value.length)" but seems only to work on the text inputs.
Actually, was easy.
I found this solution that works good.
<input type="number" value="111" onclick="this.select();">

Checkbox id keeps changing in webpage causing selenium script to fail

I am trying to automate a click on a certain checkbox. However after every run the checkbox id changes and script fails to find the element. Is there an alternate way of writing an xpath
<span id="field_key$0993573c-83b4-30d4-9139-44e44b496d0f$1food_contamination-checkbox" class="v-checkbox v-widget" ca-help-field-id="undefined">
<input id="gwt-uid-193" type="checkbox" value="on" tabindex="0" checked=""/>
<label for="gwt-uid-193"/>
</span>
xpath I used was this:
//*[#id='gwt-uid-193']
If the parent <span> id is fixed you can use it and go one level down to the checkbox
driver.findElement(By.cssSelector("#field_key$0993573c-83b4-30d4-9139-44e44b496d0f$1food_contamination-checkbox > input"));
Or use the parent class
driver.findElement(By.cssSelector(".checkbox > input"));
And if you have only one checkbox you can use the type attribute
driver.findElement(By.cssSelector("[type='checkbox']"));
I found a solution myself. We can use xpath based on the position of the checkbox, i.e.:
// input[#type='checkbox'])[position()=3]
This can be used for radio buttons as well. Replace checkbox with radio.

Can't select label by text when label contains more than text

I am driving myself bonkers with this.
I have three form fields in a form:
Customer: required dropdown field
Weight: required text field
Status: optional text field
Each element has that label. The required fields' labels contain a span with an asterisk.
I'm using Xpather in Chrome. When I search for this, I receive 2 results, when I should get 3:
//*[contains(text(),'t')]
This makes no sense to me At All.
Customer, which is working:
<label for='customer-field'>
<span class='required-marker'>*</span>
Customer
<input id='customer-field' type='text' />
</label>
Weight, which is not working:
<label class='control-label'>
<span id='ctl01_requiredMarker' class='required-marker'>*</span>
Weight
</label>
Status, which is working:
<label class='control-label'>
Status
</label>
The only workaround that works for me is removing the required marker from the Weight label container. However, that doesn't explain how "Customer" gets matched at all.
Noteworthy: I'm trying to automate testing this page, so I can't really remove that span tag.
What's going on? And/or what do I do?
Try changing your XPath to the following:
//*[text()[contains(.,'t')]]
The source of this fix breaks it down far better than I could've done, so refer to that for detailed explanation! I've tested it myself using the XPath Checker extension for Firefox, and it matches your three items.
Try with the below method
driver.findElement(By.xpath("//span[#class='required-marker']/..")).getText().contains("Weight")
Please Let me know above method is working or not.
I think your html is where the issue lies.
This is probably what your html should look like:
<span class='required-marker'>*
<label for='customer-field'>Customer</label>
<input id='customer-field' type='text' />
</span>
<span id='ctl01_requiredMarker' class='required-marker'>*
<label class='control-label'>Weight</label>
</span>
<label class='control-label'>Status</label>
Are you using Selenium or WebDriver? What does WebDriver return as a response? Also make sure you add a "." before the xpath like .//*[contains(text(),'t')]
What does this print?
List<WebElement> elements = driver.findElement(By.xpath(".//*[contains(text(),'t')]"));
s.o.p(elements.size());