Xpath - Get parent class by matching two child nodes - xpath

I'd like to use xpath to select a link whose class="watchListItem", span="icon icon_checked", and h3="a test". I can use xpath to get either matching link and span, or link and h3, but not link, span, and h3.
Here's what I've tried:
//*[#class = 'watchListItem']/span[#class = 'icon icon_checked']
//*[#class= 'watchListItem']/h3[text()='AA']
I'm looking for something like this:
//*[#class = 'watchListItem']//*[span[#class = 'icon icon_checked'] and h3[text()='AA']]
<li>
<a class="watchListItem" data-id="thisid1" href="javascript:void(0);">
<span class="icon icon_checked"/>
<h3 class="itemList_heading">a test</h3>
</a>
</li>
<li>
<a class="watchListItem" data-id="thisid2" href="javascript:void(0);">
<span class="icon icon_unchecked"/>
<h3 class="itemList_heading">another test</h3>
</a>
</li>
<li>
<a class="watchListItem" data-id="thisid3" href="javascript:void(0);">
<span class="icon icon_checked"/>
<h3 class="itemList_heading">yet another test</h3>
</a>
</li>

You can use the child:: location paths like so:
//a[#class="watchListItem"
and child::span[#class="icon icon_checked"]
and child::h3[text()="another test"]]
This would select the anchor with data-id="thisid3".

Related

knime xpath node multiple tag selection

I am trying to extract xml codes from html source. source is like this;
.
.
.
<h5>
<u>A</u>
</h5>
<ul class="listss">
<li>
<d>
<a href="link">
linktext
</a>
</d>
</li>
<li>
<d>
<a href="link2">
linktext2
</a>
</d>
</li>
</ul>
<h5>
<u>B</u>
</h5>
<ul class="listss">
.\
.(SAME TAGS AS ABOVE)
./
</ul>
<h5>
<u>C</u>
</h5>
<ul class="listss">
.\
.(SAME TAGS AS ABOVE)
./
</ul>
<h5>
<u>D</u>
</h5>
<ul class="listss">
.\
.(SAME TAGS AS ABOVE)
./
</ul>
Actually i need parent child relation so i need to extract node cell with xpath node first. But i couldn't achive to get range of xml code from "h5" to "/ul". So i need "h5" and "ul" tags together. Output must be like this;
<h5>
<u>A</u>
</h5>
<ul class="listss">
<li>
<d>
<a href="link">
linktext
</a>
</d>
</li>
<li>
<d>
<a href="link2">
linktext2
</a>
</d>
</li>
</ul>
I searched tons of links and tried everything but none of these xpath codes worked;
/.../*[self::dns:h5 or self::dns:ul]
/.../*[self::dns:h5|self::dns:ul]
/.../*[self::h5 or self::ul]
Any idea, thanks.
If you use Python, you can do this
from simplified_scrapy.simplified_doc import SimplifiedDoc
html = '''<h5>
<u>A</u>
</h5>
<ul class="listss">
<li>
<d>
<a href="link">
linktext
</a>
</d>
</li>
<li>
<d>
<a href="link2">
linktext2
</a>
</d>
</li>
</ul>
<h5>
<u>B</u>
</h5>
<ul class="listss">
.\
.(SAME TAGS AS ABOVE)
./
</ul>
<h5>
<u>C</u>
</h5>
<ul class="listss">
.\
.(SAME TAGS AS ABOVE)
./
</ul>
<h5>
<u>D</u>
</h5>
<ul class="listss">
.\
.(SAME TAGS AS ABOVE)
./
</ul>'''
doc = SimplifiedDoc(html)
items = doc.children
lastName = None
for item in items:
if item.tag == 'h5':
lastName = item.text
else:
links = item.getElementsByTag('a')
print (lastName,links)
result:
A [{'href': 'link', 'tag': 'a', 'html': 'linktext\n '}, {'href': 'link2', 'tag': 'a', 'html': 'linktext2\n '}]
B []
C []
D []

How to extract the value of an neighbour attribute node via XPath?

I have two different web pages and I want to extract some value using XPath.
What request can extract 2386028 from the first page and at the same time can extract 4019606 from the second page? I need one request that can universally extract that values.
First page fragment:
<ul class="g-ul b-properties">
<li class="b-properties__header">General</li>
<li class="b-properties__item">
<span class="b-properties__label">
<span>VendorCode</span>
</span>
<span class="b-properties__value">2386028</span>
</li>
<li class="b-properties__item">...</li>
<li class="b-properties__item">...</li>
<li class="b-properties__item">...</li>
and second page fragment:
<div class="b-properties-holder" id="tab_3">
<ul class="g-ul b-properties">
<li class="b-properties__header">General</li>
<li class="b-properties__item">
<span class="b-properties__label">
<span>Trademark</span>
</span>
<span class="b-properties__value">
<a class="link b-properties-link" href="/trademark/moist-diane/?sort=-date&currency=USD">Moist Diane</a>
</span>
</li>
<li class="b-properties__item">
<span class="b-properties__label">
<span>VendorCode</span>
</span>
<span class="b-properties__value">4019606</span>
</li>
<li class="b-properties__item">...</li>
<li class="b-properties__item">...</li>
You can select the <li> element, which has <span class="b-properties__label">element that contains <span> with value VendorCode, and then get value of <span class="b-properties__value"> under that <li> element.
For example:
//li[span[#class="b-properties__label"]/span="VendorCode"]/span[#class="b-properties__value"]/text()
Alternatively, you can select the <span class="b-properties__label">element , which has <span> with value VendorCode, and get its following sibling.
//span[#class="b-properties__label" and span="VendorCode"]/following-sibling::span/text()

How to get the xpath for menu in sidebar

I have to click on the Manage Orders option in the side bar menu. I tried with the xpath from firepath, but it is not working. Below is the code:
<div id="sidebar" class="navbar-collapse collapse">
<ul class="nav nav-list" style="height: auto;">
<!-- BEGIN Search Form -->
<li>
<!-- END Search Form -->
<li class="active" data-slug="dashboard">
<li data-slug="order">
<a class="dropdown-toggle" href="#">
<i class="fa fa-shopping-cart"/>
<span>Manage Orders</span>
<b class="arrow fa fa-angle-down"/>
</a>
<ul class="submenu" style="display: block;">
<li data-slug="promocode">
<a class="dropdown-toggle" href="https://bq.training/cp/promocode">
<span>Promo Code</span>
</a>
</li>
<li data-slug="transaction">
<a class="dropdown-toggle" href="https://bq.training/cp/order/list-order">
<span>Order Summary</span>
</a>
</li>
</ul>
</li>
Try Xpath =
//*[contains(text(), 'Manage Orders')]
Use a function like this, is written is c#, just modify slightly.
public IWebElement WaitElement(IWebDriver driver, String element)
{
IWebElement WebElement;
WebDriverWait wait = new WebDriverWait(driver, TimeSpan.FromSeconds(5)); //can be changed
return WebElement = wait.Until(ExpectedConditions.ElementIsVisible(By.XPath(element)));
}
call it like
WaitElement(driver, elementXpath).click();

How to make Xpath for button “li” elements of “ul” in Selenium WebDriver

I'm new to Selenium webdriver. Can someone help me how to make Xpath for (Flag button) on below code.
<div class="right-pan">
<ul class="right-pan-btn">
<li class="closeandtrain">
<a class="gray-color" onclick="btnChangeReviewStatusClick(3)">
<span class="statusiconclass icon-close1"/>
Close
</a>
</li>
<li>
<a onclick="btnChangeReviewStatusClick('3_1')" title="Close and train this policy">
<span class="icon-hats"/>
Close
</a>
</li>
<li class="noclassName">
<a onclick="btnChangeReviewStatusClick(4)">
<span class="flag"/>
Flag
</a>
</li>
<li>
<a onclick="btnChangeReviewStatusClick(5)">
<span class="esc"/>
Escalate
</a>
</li>
<li>
<a onclick="btnCaseClick()">
<span class="case"/>
Case
</a>
</li>
</ul>
<ul class="right-pan-links">
</div>
I tried it on Fire path that path is not working and its showing (Unable to locate element) exception
try xpath //span[#class='flag']
I am not able to comment to your post, so posting this as answer.
You can go through this link to learn about xpaths.
http://www.tizag.com/xmlTutorial/xpathtutorial.php
Can you try this
I think you should click parent of span
//span[#class='flag' and text()='Flag']/ancestor::a[1]
or
//span[#class='flag' and text()='Flag']/..

dropdown menu, Brootstrap, menu center, text left-sided

I am sure somebody has aleady posted such a question but I could not find a solution.
I am using Ruby on Rails, Brootstrap and I want to be my dropdown menu(whole) in the middle of the page, but the text (links like We, What we do and etc...) in the dropdown-menu should be left-sided.
How can I do it?
<div class="btn-toolbar">
<div class="btn-group">
<button id="action-btn" class="btn dropdown-toggle" data-toggle="dropdown">
About us
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li>
<a href="del">
<strong> We</strong>
</a>
</li>
<li>
<div class="mcol">
<ul class ="sub">
<div class ="subcolumns menuactivity">
What we do
</li>
Countries
</div>
</ul>
<li>
<a href="del">
<strong>References </strong>
</a>
</li>
</ul>
<div class="btn-group">
<button id="action-btn" class="btn dropdown-toggle" data-toggle="dropdown">
News & Events
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li>
<a href="del">
<strong>Calender</strong>
</a>
</li>
<ul class ="sub">
<div class ="subcolumns menuactivity">
<li>
News archive
</li>
</ul>
</div>
</ul>
</div>
If you're using bootstrap as it is by default you can try below
<a class="pull-left" href="details"> What we do </a>
I have updated with an example.
http://jsfiddle.net/acc8t/
I did this by using below css
.sub{margin-left:0px;}
I have founf as well another solution already.
Just to put in css the following code:
.dropdown-menu {
text-align: left;
}
.btn-toolbar{
text-align: center;
padding-bottom:40px;
}​

Resources