Selenium IDE Markup Tester
A set of Markup used to illustrate a perceived issue with Selenium XPath syntax.
http://stackoverflow.com/questions/23767962/how-to-select-a-child-node-by-conditionally-excluding-a-parents-previous-sibling
HTML
<div class="primary">
<div class="results">
<!-- This result has attributes, but has a range of prices -->
<div class="item-result first">
<h3 class="item-title">Item 1</h3>
<span class="item-detail">This is an item with a price range.</span>
<a class="detail-link" href="javascript:void(0);" title="Item 3 Details">Details</a>
<div class="price-range">
<span class="range-label">From:</span>
<span class="price minimum">$134.99</span>
<span class="separate">-</span>
<span class="price maximum">$225.95</span>
</div>
</div>
<!-- This result has attributes and a single price -->
<div class="item-result">
<h3 class="item-title">Item 2</h3>
<span class="item-detail">This is an item without a price-range.</span>
<a class="detail-link" href="javascript:void(0);" title="Item 3 Details" onclick="fun();">Details</a>
<div class="price-range">
<span class="price maximum">$445.00</span>
</div>
</div>
<!--This result has no attributes, so no link -->
<div class="item-result">
<h3 class="item-title">Item 3</h3>
<span class="item-detail">This is an item without a price-range and no attributes.</span>
<div class="price-range">
<span class="price maximum">$212.50</span>
</div>
</div>
</div>
<div class="pager-results">
<a href="javascript:void(0);" title="Previous"><</a>
<a href="javascript:void(0);" title="Page 1">1</a>
<a href="javascript:void(0);" title="Page 2">2</a>
<a href="javascript:void(0);" title="Next">></a>
</div>
</div>
CSS
.primary {
margin: 0px auto;
max-width: 650px;
width: 100%;
min-height: 200px;
border-radius: 6px;
background-color: rgba(200,200,200, .8);
color: #121212;
border: solid 1px #343434;
display: block;
padding: 2px;
}
.results {
background-color: rgba(230,230,255, .7);
margin: 2px 2px;
padding: 2px;
border-radius: 6px;
border: solid 1px #efefef;
}
.pager-results {
display: block;
margin: 0px auto;
text-align: center;
border: solid 1px #232323;
border-radius: 6px;
padding: 2px;
margin: 1px 2px;
background-color: rgba(45,45,45,.7);
}
.pager-results A{
color: #8989de;
text-decoration: none;
font-size: 105%;
display: inline-block;
border: solid 1px #6767fe;
padding: 3px;
border-radius: 4px;
background-color: rgba(23,23,23,.8);
cursor: pointer;
}
.pager-results A:HOVER {
background-color: rgba(170,170,170,.8);
color: #4545a9;
}
.item-result {
display: inline-block;
border: solid 1px #000000;
border-radius: 6px;
background-color: #ffffff;
padding: 1px 3px;
min-width: 120px;
max-width: 170px;
margin: 1px;
min-height: 122px;
vertical-align: top;
}
h3.item-title {
margin-top: 0px;
}
.price {
color: #4444aa;
}
a.detail-link {
display: block;
text-align: right;
}
.range-label {
font-weight: bold;
}
JavaScript
function fun()
{
alert('hai');
}