I Need To Scroll Inside a Drop Down Box - java

In Selenium, i Was Automating, But in That Drop down Menu i need to Click on The Element Which is Hidden Down.
It scrolls whole page down i want only specific dropdown scrolled down not page.
HTML Code For The Full Div :
<ul class="dropdown-menu drop_Loc" role="menu" style="display: none;" xpath="1"> <li>
<a href="carle_place.aspx" target="_self">
<span class="icon-fort icon-left" style="font-size: 40px;padding: 0px 8px;"></span> <span class="nav_icon_heading">Carle Place</span>
</a>
</li>
<li>
<a href="Selling-a-car-cutler-bay.aspx" target="_self">
<span class="icon2-cutlerbay icon-left" style="font-size: 24px;padding: 7px 8px;"></span>
<span class="nav_icon_heading">Cutler Bay</span>
</a>
</li>
<li>
<a href="Daytona.aspx" target="_self">
<span class="icon-daytona icon-left" style="font-size: 40px;padding: 0 8px"></span>
<span class="nav_icon_heading">Daytona</span>
</a>
</li>
<li>
<a href="Fort_lauderdale.aspx" target="_self">
<span class="icon-fort icon-left" style="font-size: 40px;padding: 0 8px"></span> <span class="nav_icon_heading">Fort Lauderdale</span>
</a>
</li>
<li>
<a href="Sell-my-car-longwood.aspx" target="_self">
<span class="icon-orlando icon-left" style="font-size: 40px;padding: 0 8px"></span>
<span class="nav_icon_heading">Longwood</span>
</a>
</li>
<li>
<a href="Melbourne.aspx" target="_self">
<span class="icon-melbourne icon-left" style="font-size: 40px;padding: 0 8px"></span>
<span class="nav_icon_heading">Melbourne</span>
</a>
</li>
<li>
<a href="miami.aspx" target="_self">
<span class="icon-miami icon-left" style="font-size: 40px;padding: 0 8px"></span>
<span class="nav_icon_heading">Miami</span>
</a>
</li>
<li>
<a href="Orlando.aspx" target="_self">
<span class="icon-orlando icon-left" style="font-size: 40px;padding: 0 8px"></span>
<span class="nav_icon_heading">Orlando</span>
</a>
</li>
<li>
<a href="St_James.aspx" target="_self">
<span class="icon-daytona icon-left" style="font-size: 40px;padding: 0 8px"></span>
<span class="nav_icon_heading">St James</span>
</a>
</li>
<li>
<a href="Treasure_coast.aspx" target="_self">
<span class="icon-treasure_coast icon-left" style="font-size: 40px;padding: 0 8px"></span>
<span class="nav_icon_heading">Stuart</span>
</a>
</li>
<li>
<a href="Tampa.aspx" target="_self">
<span class="icon-treasure_coast icon-left" style="font-size: 40px;padding: 0 8px"></span>
<span class="nav_icon_heading">Tampa</span>
</a>
</li>
<li>
<a id="last-child-location" href="West_palm_beach.aspx" target="_self">
<span class="icon-palm_beach icon-left" style="font-size: 40px;padding: 0 8px"></span>
<span class="nav_icon_heading">West Palm Beach</span>
</a>
</li>
</ul>
i Tried With These Code,
By Stuart = By.xpath("/html[1]/body[1]/div[1]/nav[1]/div[1]/div[2]/ul[1]/li[2]/ul[1]/li[10]/a[1]/span[2]");
JavascriptExecutor je = (JavascriptExecutor) driver;
WebElement element = driver.findElement(Stuart);
je.executeScript("arguments[0].scrollIntoView(true);",element);
Thread.sleep(4000);
The Above Code is Working,But it is Scrolling The Dropdown aswell as Webpage Also.
Please Sort Me out This Guys.

Your code is right i didn't find any problem in your code it should scroll till that element is visible.
Don't use absolute xpath, it's good practice to always use dynamic xpaths.
Please try below code,
browser.executeScript('window.scrollTo(0,0);').then(function () {
page.saveButton.click();
})

You can also use action class of selenium for scroll,
for that you will need to import it.
import org.openqa.selenium.interactions.Actions;
WebElement menuItem = Driver.findElement(menuItemPath);
Actions action = new Actions(Driver);
action.moveToElement(menuItem);
action.perform();
menuItem.click();

Related

Div wrap in Thymeleaf

I'm trying to wrap my list with div, here is my Thymeleaf structure:
<th:block th:if="${predStatus.namePrem}">
<div class="Holder">
<ul id="holder" class="price-table__info">
<li>
<p class="exam1" th:text="#{exam2}"></p>
</li>
</ul>
</th:block>
<ul id="holder" class="price-table__info">
<li>
<p th:unless="${predStatus.kom}" class="top" th:text="#{usp}"></p>
<p th:if="${predStatus.kom}" class="top" th:text="#{usp1}"></p>
</li>
</ul>
</div>
What I trying to achieve is this structure
<div class="Holder">
<ul id="holder" class="price-table__info">
<li>
<p class="top">Title 1</p>
</li>
</ul>
<ul id="holder" class="price-table__info">
<li>
<p class="top">Title 2</p>
</li>
</ul>
</div>
Can anybody help me?
Can you try the following?
Just put the condition in the div
<div class="Holder" th:if="${predStatus.namePrem}">
<ul id="holder" class="price-table__info">
<li>
<p class="exam1" th:text="#{exam2}"></p>
</li>
</ul>
<ul id="holder" class="price-table__info">
<li>
<p th:unless="${predStatus.kom}" class="top" th:text="#{usp}"></p>
<p th:if="${predStatus.kom}" class="top" th:text="#{usp1}"></p>
</li>
</ul>
</div>

xPath element location - selenium

Have following source on the webpage , what I want is to click on the button which is under class fa fa-repeat. Tried to use xpath = "//*[#id=\"accountsList\"//following-sibling::i[#class='fa fa-repeat']" but it doesn't work. Could anyone help/explain me why ? And what could be the best alternative to locate such elements (not necessary via xpath, could be css selector as well) ...
My HTML code is as below:
<li class="list-group-item">
<div class="row account-item">
<div class="col-xs-10">
<span class="label label-danger account-status">O<br>F<br>F</span>
<div><b>assssss</b></div>
<div>company</div>
</div>
<div class="col-xs-2 text-right">
<i data-account="ababa" class="fa fa-repeat"></i>
<i class="account-options fa fa-ellipsis-v" data-toggle="dropdown"></i>
<ul class="dropdown-menu" role="menu">
<li>
<a data-account="fds" class="account-option toggle-active">
<i class="fa fa-play"></i> Start </a>
</li>
</ul>
</div>
</div>
</li>
The target i element is not sibling of *[#id='accountsList'] but descendant :
//*[#id='accountsList']//i[#class='fa fa-repeat']
or using more specific path :
//*[#id='accountsList']/div/div/i[#class='fa fa-repeat']

Click the menu that use span class

The code snippet of the page and have the link where I need to click.
<div class="xwq" style="position:absolute;left:0px;right:0px;top:0px;bottom:0px">
<div style="position:absolute;width:100%;height:100%">
<div id="pt1:sdi1" class="af_showDetailItem" style="position:absolute;width:auto;height:auto;top:0px;left:0px;bottom:0px;right:0px">
<div>
<a id="pt1:cb1" class="xfc p_AFTextOnly" href="#" onclick="return false;">
<span class="x106">Cadastro de cliente</span>
</a>
</div>
<div>
<a id="pt1:cb2" class="xfc p_AFTextOnly" href="#" onclick="return false;">
<span class="x106">Relacionar cliente à Proposta de Venda</span>
</a>
</div>
<div>
<a id="pt1:cb3" class="xfc p_AFTextOnly" href="#" onclick="return false;">
<span class="x106">Iniciar processo de Análise de Crédito</span>
</a>
</div>
</div>
</div>
Command in selenium was used :
WebElement menuCadCliente = driver.findElement(By.linkText("Cadastro de cliente"));
menuCadCliente.click();
What has been identified is that a single class and inside it has different values ​​. This is my if I have not understood erroado.
Try this if you are getting an exception when you invoke menuCadCliente.click():
WebElement menuCadCliente = driver.findElement(By.cssSelector("a#pt1\\:cb1 span.x106"));
menuCadCliente.click();

Selenium Webdriver - How to select element in CSS Menu

I do not know how to click a menu item on a CSS dropdown menu.
The structure of the menu looks like this:
<ul id="nav" class="clearfix" role="navigation">
<li>
<li class="navMenu navActive">
Allfinanzberatung
<ul class="subMenu" role="navigation">
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/beratung/wie-ich-sie-unterstuetze/">Wie ich Sie unterstütze</a> <- I want to Select this Menu Point
</div>
</li>
</ul>
<li class=" subMenuPoint">
<li class=" subMenuPoint">
<li class="last subMenuPoint">
</ul>
I've tried it with the following code but it doesn't work: (Eclipse Junit)
WebElement elems=driver.findElement(By.linkText("Wie ich Sie unterstütze"));//Menu Item
WebElement elems1=driver.findElement(By.xpath("//li[#nav']/a"));//Menu
Actions builder = new Actions(driver);
Actions hoverOverRegistrar = builder.moveToElement(elems1);
hoverOverRegistrar.perform();
elems.click();//at last Menu Item Click
First of all, thank you all,
but unfortunately it still does not work properly.
here is again the code for the menu.
<ul id="nav" class="clearfix" role="navigation">
<li class="navMenu">
beratung
<ul class="subMenu" role="navigation">
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/beratung/wie-ich-sie-unterstuetze/">Wie ich Sie unterstütze</a>
</div>
</li>
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/beratung/wie-ich-sie-berate/">Wie ich Sie berate</a>
</div>
</li>
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/beratung/produktwelt/">Produktwelt</a>
</div>
</li>
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/beratung/auszeichnungen/">Auszeichnungen</a>
</div>
</li>
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/beratung/premium-partner/">Premium-Partner</a>
</div>
</li>
<li class="last subMenuPoint">
<div class="left">
<a class="right" href="/test.user/beratung/ihr-allfinanzcheck/">Ihr Allfinanzcheck</a>
</div>
</li>
</ul>
</li>
<li>
<img alt="" src="/test.user/javax.faces.resource/pic_bg_main_menu_separator.png.xhtml?ln=images/frontend/menus" />
</li>
<li class="navMenu">
Karriere
<ul class="subMenu" role="navigation">
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/karriere/ihre-perspektiven/">Ihre Perspektiven</a>
</div>
</li>
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/karriere/ihr-neuer-beruf/">Ihr neuer Beruf</a>
</div>
</li>
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/karriere/ihr-karrierefahrplan/">Ihr Karrierefahrplan</a>
</div>
</li>
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/karriere/ihr-karrierecheck/">Ihr Karrierecheck</a>
</div>
</li>
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/karriere/was-andere-sagen/">Was andere sagen</a>
</div>
</li>
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/karriere/auszeichnungen/">Auszeichnungen</a>
</div>
</li>
<li class=" subMenuPoint">
<div class="left">
<a class="right" href="/test.user/karriere/freie-stellen/">Freie Stellen</a>
</div>
</li>
<li class="last subMenuPoint">
<div class="left">
<a class="right" href="/test.user/karriere/im-falschen-film/">Führen Sie selbst Regie</a>
</div>
</li>
</ul>
</li>
</ul>
This code selects me the fourth element so "karriere" thats good driver.findElement(By.cssSelector("#nav > li:nth-child(4) a")).click();
But unfortunately I could not select the second element of it -> Karriere -> Ihr neuer Beruf
I try this but it dosnt work
driver.findElement(By.cssSelector("#nav > li:nth-child(4) li:nth-child(2) a")).click();
What is the error?
Try
driver.findElement(By.cssSelector(".navMenu a")).click();
This finds the elements with class navMenu, then selects the first child that is an html <a> element (aka your link) and clicks it.
Css selector doesnot support cross platform browsers, you have to use xpath.
if you want to select "Wie ich Sie unterstütze"
then use
element= driver.findelement(By.xpath("//ul[#class='clearfix']/li/ul/li[1]/div/a"));
element.click();
if you want to select "Wie ich Sie berate"
element= driver.findelement(By.xpath("//ul[#class='clearfix']/li/ul/li[1]/div/a"));
element.click();

Search for elements with same class names in webdriver

I need to write script for drop-down boxes. There are two dropdown elements on same screen and both the dropdown boxes have got similar class names (Dropdown boxes are of search and select kind),and there is no unique-id for any element.
So the script works fine to select element from first dropdown, But it fails when it supposed to perform same for second dropdown.
Do reply
Regards
<div class="title-edit-form" id="49156080-2097-ea0f">
<div class="control-group required">
<label class="control-label">Title
</label>
<div class="controls row-fluid">
<div class="select2-container span12 select2-container-active select2-dropdown-open" id="s2id_title">
<a href="#" onclick="return false;" class="select2-choice" tabindex="-1">
<span>de</span>
<abbr class="select2-search-choice-close" style="display:none;">
</abbr>
<div>
<b></b>
</div>
</a>
</div>
<input class="span12" id="title" type="hidden" style="display: none;" value="-1">
</div>
</div>
<div class="select2-drop select2-drop-active" style="display: block; top: 177px; left: 536px; width: 530px;">
<div class="select2-search">
<input type="text" autocomplete="off" class="select2-input select2-focused" tabindex="-1" style="">
</div>
<ul class="select2-results">
<li class="select2-results-dept-0 select2-result select2-result-selectable select2-new">
<div class="select2-result-label">
<span class="select2-match">de</span>
</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable">
<div class="select2-result-label">
<span class="select2-match">De</span>
"an"
</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable select2-highlighted">
<div class="select2-result-label">
"Stu"
<span class="select2-match">de</span>
"nt"
</div>`enter code here`
</li>
</ul>
</div>
the best way is to use cssSelector() for that kind of things, and especially the nth-child() function from cssSelector().
Exemple :
// gets the first div that contains school as a class value.
driver.findElement(By.cssSelector("div.school:nth-child(1)"));
More about cssSelector()
exemple wokring here -> JSfiddle

Categories