Finding an element with a xpath that changes - selenium

Hello I am new to selenium and trying to find an element on a dropdown that expands to a list. The xpath constantly changes so cannot use it. Also tried the full xpath and did not work either. Other drop downs that I have used I have been able to use the cssselector but really do not have much to work with in here. I have tried with 'Account Maintenance' text but it did not work or did not do it properly. If I need to provide any additional information or more html please let me know.
<li class="k-item" role="treeitem" data-uid="706aa3e9-cd95-45c3-9ad0-e990887f9484" aria- selected="true" aria-expanded="false">
<div class="k-mid">
<span class="k-icon k-i-expand">
::before
</span>
<span class="k-in k-state-selected">Account Maintenance</span>
</div>
<ul "THIS IS THE LIST THAT EXPANDS AFTER CLICKING ON THE 'Acount Maintenance' text above but not my issue </ul>
</li>

Related

How to click on an element in a list in robot framework

How can i select settings from this dropdown list.
I tried Click Element by(class/id..) but none of them work for me.
First i have to click on the profile icon, then choose the settings element
here is the html code of the icon :
<li class="dropdown userMenu hidden-sm hidden-xs" id="y7">
<a data-toggle="dropdown" class="dropdown-toggle pad10-top no-padding-left no-padding-right center" href="javascript:void(0)" id="yu">
<span class="ellipsis-menu no-margin pad5-bottom" data-toggle="tooltip" data-placement="bottom" title="Profile" id="yui_3_">
<i aria-hidden="true" class=" icon-user_icon pad5-right" id="y"></i>
</span>
<b class="caret"></b>
</a>
and here is the element of the list that i want to select :
<li id="y8">
<a id="settings" href="/cc/settings.html"><i class=""></i>Settings</a></li>
Any help please?
This should work.
Assuming that the list line element is of profile icon (It was unclear to me from the HTML you pasted, but you may better figure out on your application by inspecting it).
If needed be, you may apply a Sleep of 1-2 sec in between the two lines
Click Element xpath: //*[#title='Profile']
Click Element id: settings
P.S. I am assuming that you have imported all the required libraries for this (in fact, it is only SeleniumLibrary that is required for these two lines)

Selenium element being blocked by non-existent element

I'm trying to run some Selenium tests in Java but some fields are being blocked by another one and aren't clickable. The problem is, that other field doesn't actually exist in the page source.
The error is: Element <select id="pets" class="sumo form-control SumoUnder" name="pets"> is not clickable at point (1025.833351135254,677.4000244140625) because another element <span> obscures it
There is no element that doesn't have other tags (id, class, etc.) with it. So what is this mysterious field?
Interestingly, if I try to access some other fields first, I get different obscuring fields, which ALSO don't exist on the page. Such as:
<p class="CaptionCont SelectBox">
Watching the test interactively doesn't help; there's nothing visible that's blocking the elements when the error's thrown.
Where are these phantom fields coming from, and how do I stop them from blocking my fields?
EDIT: I have found that these fields are being added by SumoSelect. They don't show up when you view the source of the page, but they're there if you save the page and open it locally.
<div class="col form-group">
<label for="pets">Pets</label>
<div class="SumoSelect sumo_pets" tabindex="0" role="button" aria-expanded="false">
<select id="pets" name="pets" class="sumo form-control SumoUnder" tabindex="-1">
<option value="">Select</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<p class="CaptionCont SelectBox" title="Select">
<span class="placeholder">Select</span>
<label><i></i></label>
</p>
<div class="optWrapper">
<ul class="options">
<li class="opt"><label>Select</label></li>
<li class="opt"><label>1</label></li>
<li class="opt"><label>2</label></li>
<li class="opt"><label>3</label></li>
</ul>
</div>
</div>
</div>
if not clickable, may be selectable.
Select pets = new Select(driver.findElement(By.id("pets")));
pets.selectByIndex(1);
When you are using a JS library to enhance the Select - you need to see the final DOM created by the JS library. In the case of SumoSelect - the CSS for the select box itself is:
<p class="CaptionCont SelectBox" title=" Volvo">
<span> Volvo</span>
<label><i></i></label>
</p>
See the span there? If you want to click the dropdown - you need to click that span.
Try to click using JavaScript Executor.
Reference Link:- http://learn-automation.com/click-in-selenium-webdriver-using-java-script/

Selenium XPATH for dynamic class for dropdown

I am new to selenium and I am having trouble to write an xpath selector for this dropdown element:
<li style="" class="dropdown open" data-bind="visible: currentServers().length > 0">
<a id="employeeList" href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="true" data-bind="text: currentServerName()">employee servers</a>
<ul role="menu" class="dropdown-menu">
I have tried various xpath and it was not able to click on the dropdown.
Can any one help me with the xpath? I have used xpath with id , class, cssselector . But none of them worked.
If the root issue is the li element changes its class when opened - as stated in the comments, then the solution would be not to go after an exact match in it, but rather containing the looked for string. I.e.:
//li[contains(#class, "dropdown")]
Prepend/append any other elements as needed (e.g. an a element beneath it, if it is the one to relieve the click, etc)
Try to do this way.
Explanation: Your html inside the li tag, so start your xpath with li tag and then move ahead with a tag along with text method.
//li/a[contains(text(), 'employee servers')]

Selenium XPath of preceding element

I have a scenario wherein the html tags are generated dynamically through ajax as shown below
<div>
<span class="rptName">QLMS</span>
<span id="button_id_91">//generated dynamically
<span id="button_span_right_91">
<span id="button_91"/>
</span>
</span>
<span class="rptName">QLRS</span>
<span id="button_id_92">//generated dynamically
<span id="button_span_right_92">
<span id="button_92"/>
</span>
</span>
</div>
The span elements are generated dynamically, in such scenarios how do we get the xpath based on the text search(QLMS,QLRS present in span).
I need to do an click event on the
<span id="button_92" or "91"/>
Please let me know how to achieve in such scenario.
Seems pretty tricky. Using following-sibling should help. I am also filtering out the span with the partial id right. Try this:
//span[contains(text(),'QLRS')]/following-sibling::span//span[not(contains(#id,'right'))]

how to click on a button when specific image is asscoiated with it

I am using selenium for testing my application.
In my application there are 5 buttons, each have a different image associated with it.
I want to click on button which have a specific image associated.
Currently i am using a while loop to get the node of image and then replacing this node into xpath of button to select it.
is there any way either with xpath or css to do this directly.
Providing more information-this is like submit button is there and then below this image is there. submit button and images are sibling element and need to click submit button when the next element is specific image
<div class="select">
<span class="sysTxtBtn submit xxs">
<span class="btnTagDummy">
</span>
<div class="specialRateMarking">
<img width="79" height="11" alt="Marking2" src="someimages"/>
</div>
<div class="select">
<span class="sysTxtBtn submit xxs">
<span class="btnTagDummy">
</span>
<div class="specialRateMarking">
<img width="79" height="11" alt="Marking1" src="someimages"/>
</div>
Could you include a snippet of your HTML? Below is an example of an image in a form and a few ways of locating it using Selenium, but these may not be relevant depending on your implementation:
<input id="submitForm" name="imgbtn" type="image" src="images/submit.png" />
id=submitForm
name=imgbtn
//input[#src='images/submit.png']
//input[contains(#src, 'submit.png')]
css=input[src='images/submit.png']
UPDATE:
Given the HTML:
<div class="select">
<span class="submit">
<div class="marking1"></div>
<div class="select">
<span class="submit">
<div class="marking2"></div>
You can locate the 'submit' span parent of the 'marking2' div using the following XPaths:
//div[#class='marking2']/..
//div[#class='marking2']/parent::*
//div[#class='marking2']/parent::span
UPDATE 2:
Based on the HTML now included in the question, you can locate the span with the class of submit related to the image many ways, a few examples follow:
//div[//img[#alt='Marking2']/span[contains(#class, 'select')]
//img[#alt='Marking2']/../../span
//div[img[#alt='Marking2']]/preceding-sibling::span
I hope this gives you some ideas. I'd certainly recommend XPath over CSS for locating these elements as it's much better at these sorts of relationships.