I am trying to capture list from this drop down.
<input aria-autocomplete="list" aria-owns="typeaheadDataPlain" autocomplete="off" class="clear-btn-input gcw-storeable text gcw-origin gcw-required gcw-distinct-locations " data-gcw-field-type="origin" data-gcw-storeable-name="gcw-origin" data-js-theme="autocomplete" data-lob="FLIGHTS" data-locale="en_US" data-mask="95" data-minchar="1" data-provide="utypeahead" data-template="hbs/templates/destinationCustom" data-tooltip-id="typeaheadDataPlain" data-version="v4" data-airport_code_element="flight-origin-hp-flight-airport_code" data-hotel_id_element="flight-origin-hp-flight-hotel_id" data-lat_long_element="flight-origin-hp-flight-lat_long" data-region_id_element="flight-origin-hp-flight-region_id" data-region_type_element="flight-origin-hp-flight-region_type" data-station_code_element="flight-origin-hp-flight-station_code" data-city_element="flight-origin-hp-flight-city" data-country_code_element="flight-origin-hp-flight-country_code" data-category_element="flight-origin-hp-flight-category" data-heds_element="flight-origin-hp-flight-heds" data-search_name_element="flight-origin-hp-flight-search_name" data-ta_element="flight-origin-hp-flight-ta" id="flight-origin-hp-flight" placeholder="City or airport" spellcheck="false" type="text">
but I can't find no "ul" and I don't know where it's getting the list from. This is what I see when the list appears in HTML.
<div class="autocomplete-dropdown" style="left: -2px; max-width: 604px; min-width: 286px; width: 604px; display: none;"></div>
Related
I am just not sure what will be the syntax for this
This is a drop-down which changes its ID so I wish to choose the label above to navigate the click
Here is the HTML
<label class="form-title">Charging and Billing Alignment</label>
<select name="ratingAndBillingAlignment" class="reverse-toggle-select check-if-form-row-visible hide-child-if-not-visible loadable-drop-down-37 loadable-drop-down-select" id="ratingAndBillingAlignment" makeloadabledropdown="37" style="display: none;" fixed_position=".popup-content-inner">
<option value="TRUE" class="done-into-select-dd">Yes</option>
<option value="FALSE" selected="selected" class="done-into-select-dd">No</option>
</select><span num="37" class="loadable-drop-down loadable-drop-down-container loadable-drop-down-container-37" id="makeLoadableDropDown37" style="position: relative;" title="No" title2="No"><span class="dropdown-label initialized" style="width: 100%;"><span class="dropdown-html"><span class="value_box" style="display: none;">FALSE</span><span class="text">No</span></span></span><span style="display: none; position: absolute; width: 100%; left: 0px;" class="dropdown-list custom-drop-down-dropdown-list custom-drop-down-dropdown-list-37" stop="0" loading="0" data-counter="37"><div class="option-list" style="max-height: 250px;"><div class="dropdown-link the-dd-counter-1 first-dd-link" c="1" title="Yes"><span class="dropdown-html"><span class="value_box" style="display: none;">TRUE</span><span class="text">Yes</span></span></div><div class="dropdown-link the-dd-counter-2 last-dd-link selected" c="2" title="No"><span class="dropdown-html"><span class="value_box" style="display: none;">FALSE</span><span class="text">No</span></span></div></div></span></span>
driver.findElement(By.xpath(
"//span[#class='dropdown-label initialized']/following-sibling::label[contains(text(),'Charging and Billing Alignment')and(#xpath='1')]"))
.click();
Thanks for your help!
Here is the xpath that you can use with name. As name does not update as it did in the case of id.
//select[#name='ratingAndBillingAlignment']
Locating <select> won't work in your case as its hidden. style="display: none;"
Try using below xpath to click on span looks alike dropdown
//label[contains(.,'Charging and Billing Alignment')]/following-sibling::span[contains(#class,'loadable-drop-down')]
Hi I have two exact element on the page I want to click first or second.When using 1 [0] two elements are marked
what I tryed is '//span[contains(text(), "CTA Button")]' but both elements are marked
also '//spancontains(text(), "CTA Button")' again both are marked
<div class="ng-untouched ng-pristine ng-valid ng-star-inserted">
<!---->
<!----><!---->
<mat-slide-toggle class="mat-slide-toggle mat-accent ng-untouched ng-pristine ng-valid ng-star-inserted" id="mat-slide-toggle-6"><label class="mat-slide-toggle-label"><div class="mat-slide-toggle-bar"><input class="mat-slide-toggle-input cdk-visually-hidden" type="checkbox" id="mat-slide-toggle-6-input" tabindex="0"><div class="mat-slide-toggle-thumb-container" style="touch-action: none; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);"><div class="mat-slide-toggle-thumb"></div><div class="mat-slide-toggle-ripple mat-ripple" mat-ripple=""></div></div></div><span class="mat-slide-toggle-content">
CTA Button
</span></label></mat-slide-toggle>
<!---->
</div>
This is to query first element: (//span[contains(text(), "CTA Button")])[1]
This is to query second element: (//span[contains(text(), "CTA Button")])[2]
In our application there is a task view page. For different tasks, xpath for the same button found change every time as below
WIN_1_1000000014
WIN_2_1000000014
WIN_3_1000000014
WIN_4_1000000014
WIN_5_1000000014
I am providing html codes for two of such scenarios below . I am using following xpaths to find that button but not working for me.
//div[#ardbn='Assignee Organization']//a[#class = 'btn btn3d menu']//img
//img[#alt='Menu for Organization']
Help me guys
<div id="WIN_1_1000000014" class="df arfid1000000014 ardbnAssigneeOrganization Char" arid="1000000014" artype="Char" ardbn="Assignee Organization" arlbox="0,4,78,17" ardcf="1" style="z-index:998;top:84px; left:5px; width:263px; height:21px;" arwindowid="1">
<label id="label1000000014" class="label f6" for="x-arid_WIN_1_1000000014" style="top: 4px; left: 0px; width: 78px; height: 17px;">Organization</label>
<textarea id="arid_WIN_1_1000000014" class="text sr " cols="20" maxlen="60" style="top:0px; left:83px; width:154px; height:21px;" armenu="CTM:SGP:SupportOrganization3-Q" mstyle="2" arautoc="1" arautocmb="1" arautocak="0" arautoctt="400" rows="1" title="Service_Desk_First_Tier"
wrap="off"></textarea>
<a class="btn btn3d menu" href="javascript:" style="top:0px; left:242px; width:21px; height:21px;">
<img class="btnimg" src="../../../../resources/images/mt_sprites.gif" alt="Menu for Organization" title="" style="background-color: transparent;">
</a>
<div id="WIN_3_1000000014" class="df arfid1000000014 ardbnAssigneeOrganization Char" arid="1000000014" artype="Char" ardbn="Assignee Organization" arlbox="0,4,78,17" ardcf="1" style="z-index:998;top:84px; left:5px; width:263px; height:21px;" arwindowid="3">
<label id="label1000000014" class="label f6" for="x-arid_WIN_3_1000000014" style="top: 4px; left: 0px; width: 78px; height: 17px;">Organization</label>
<textarea id="arid_WIN_3_1000000014" class="text sr " cols="20" maxlen="60" style="top:0px; left:83px; width:154px; height:21px;" armenu="CTM:SGP:SupportOrganization3-Q" mstyle="2" arautoc="1" arautocmb="1" arautocak="0" arautoctt="400" rows="1" title="Service_Desk_Resolver"
wrap="off"></textarea>
<a class="btn btn3d menu" href="javascript:" style="top:0px; left:242px; width:21px; height:21px;">
<img class="btnimg" src="../../../../resources/images/mt_sprites.gif" alt="Menu for Organization" title="" style="background-color: transparent;">
</a>
you can write the xpath for the latest task as below:
(//div[contains(#id,'WIN_')])[last()]//img[#alt='Menu for Organization']
Use below code for click or any other operations:
List<WebElement> elements = driver.findElements(By.xpath("//img[#alt='Menu for Organization']"));
for(int i=1;i<=elements.size();++i){
elements.get(i).click();
}
xpath working for 1st 3 elements is
(//div[#ardbn='Assignee Organization']//a[#class = 'btn btn3d menu']//img)[last()]
xpath working for rest elements is
(//div[#ardbn='Assignee Organization']//a[#class = 'btn btn3d menu']//img)[position()<3]
I am tring to get the attribute type="radio" but I'm not sure how to in the selenium webdriver.
I tried by using
if(driver.findElement(By.id("userStatusEnable")).getAttribute("type").equals("radio"))
and also by changing the id to x-auto-210
<div id="userStatusEnable" class="x-form-check-wrap x-form-field x-component " role="presentation" style="position: relative;">
<input id="x-auto-210" class=" x-form-radio" type="radio" name="gxt.RadioGroup.5" style="position: relative; left: 0px; top: 4px;" tabindex="0" value="enabled" aria-describedby="x-auto-190" checked="">
<label class="x-form-cb-label" for="x-auto-210" htmlfor="x-auto-210" style="position: relative; left: 1px; top: 3px;">Enable</label>
</div>
One possible approach is to use findElements() and an xpath selector to find input tags with a type="radio":
if(driver.findElements(By.xpath("//input[#type='radio']")).size() == 2)
From your question it sounds like you want to find all input elements with the id x-auto-210 and the type radio. You can do that with the following XPath:
"//input[#id='x-auto-210' and #type='radio']"
I've added an explanation of what the XPath expression is doing
The // says we want to search all element
The input means we are only interested in input elements
The [] contains the conditions we want the input to match (namely, that the id is x-auto-210 and the type is radio)
If you use this expression in conjunction with findElements in selenium, you should be able to find the desired elements
if (driver.findElements(By.XPath("//input[#id='x-auto-210' and #type='radio']")).size() == 2) {
//Do stuff
}
I tried tweaking the CSS coding and no prevail. Things i want:
search box with border radius of 5px
enlarge the search icon with out getting it dispalced
both search box and search icon evenly placed around the div
HTML CODE:
<div class="search"
<div class="searchbox">
<form action="/search" method="get" class="search_form">
<input type="text" value="Search Blog..." class="search_text" name="q">
<input type="image" src="http://s25.postimg.org/d3fu892zz/search_button_without_text_md.png" height="20" width="20"class="button">
</form>
</div>
</div>
CSS CODE:
.search{position:fixed;
height:25px;
width:194px;
top:189px;
left:14px;
border:2px solid black;
background-color:black;
border-radius:10px;
padding-left:2px;
padding-bottom:4px;
opacity:.8;}
Notice: Your class="search" div is not closed !!
Here is the code that should work and fullfill all the three conditions of yours
<div class="search">
<div class="searchbox">
<form action="/search" method="get" class="search_form">
<input type="text" value="Search Blog..." class="search_text" name="q">
<input type="image" src="http://i42.tinypic.com/fayl43.png" class="button">
</form>
</div>
Css Code:
.search{position:absolute;
height:28px;
width:190px;
top:140px;
left:100px;
border:2px solid black;
background-color:black;
border-radius:10px;
padding-left:2px;
padding-bottom:4px;
opacity:.8;
}
form#input{
display:inline-block;
}
.searchbox{
}
.search_text{
margin-top:4px;
margin-left:5px;
border-radius:5px;
text-align:center;
}
.button{
margin-top:5px;
margin-left:2px;
position:absolute;
height:20px;
width:20px;
}
.button:hover{
-webkit-transform:scale(1.3);
-moz-transform:scale(1.3);
-o-transform:scale(1.3);
opacity: 3;
}
Working JSfiddle Demo - http://jsfiddle.net/vg8Mn/
Hope this helps :)