Finding the Parent of an Element, then Clicking a Button Child of that Parent in C#/Selenium

Question

I am quite stuck while testing a web application. I am trying to check to ensure a class exists - in this case the class of "originalProductPrice" - out of a group of identical looking li items. Only some of them have this class and if one does I want to click the btn-primary (labeled See More below). Essentially what it feels like I need to do is find the originalProductPrice class - walk up to the top li parent and then drill back down to the button to make sure I am clicking the button associated with that class. However, I am lost as to how to do that. My closest attempt so far has been:

[When(@"I Click See More on the First Option with An Original Product Price")]
public void WhenIClickSeeMoreOnTheFirstOptionWithAnOriginalProductPrice()
{
    ReadOnlyCollection<IWebElement> packages = CurrentBrowser.FindElements
        (By.XPath("//span[@class = 'originalProductPrice:first-child']//tr"));
    ReadOnlyCollection<IWebElement> seeMore = packages.FindElements
        (By.XPath(".//li[@class='btn-primary:first-child']/div"));
    seeMore.Click();
}

Below is the corresponding HTML:

<li class="span4" id="Tile">
<div class="thumbnail">
    <div id="locationImage">
        <div id="sImage"></div>
    </div>
    <div name="InvokeWhiteSpaceWrap">
        <span id="sName">Name</span>
        <span name="ratings">
            <span id="sMinRating"></span>
            <span id="sMaxRating"></span>
        </span>
        <div id="sDescription">
        </div>
        <table class="table table-condensed table-striped" id="pList">
            <tbody>
                <tr>
                    <td>
                        <div name="pNameDiv">
                            Name                                
                        </div>
                    </td>
                    <td class="nowrap">
                        <span name="pPrice">
                            <span class="beforePriceCurrency">$</span>
                            180.00
                            <span class="afterPriceCurrency"></span>
                        </span>
                        <span name="originalProductPrice" 
                              class="originalProductPrice">
                            <span class="beforePriceCurrency">$</span>
                            200.00
                            <span class="afterPriceCurrency"></span>
                        </span>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
    <br>
    <a onclick="$.blockUI({ message: $('#waitMessage') });" 
        class="btn btn-block btn-link btn-small">
        More Options Available                                           
    </a>
    <a onclick="$.blockUI({ message: $('#waitMessage') });" 
        class="btn btn-block btn-primary">See More</a>
</div>

Any help is greatly appreciated!

Answer 1

Try the following.

IWebElement button = CurrentBrowser.FindElement(By.XPath("//span[@class='originalProductPrice']/ancestor::li//a[contains(@class,'btn-primary')]"));
button.Click();

The portion of note in this XPath is /ancestor::li. The XPath works by first finding the <span> element with class equal to "originalProductPrice", then searching for your button from the nearest <li> element that is a parent of that span.

Answer 2

Use below mentioned Xpath to locate your element:

//table[//span[@class='originalProductPrice']]/following::a[text()='See More']

Explanation :

//table[//span[@class='originalProductPrice']]

Locate the <table> where it found class = originalProductPrice for the <span>

/following::a[text()='See More']

Locate the anchor tag which follows the above located table.

OR

//table[//span[@class='originalProductPrice']]/../following-sibling::a[@class="btn btn-block btn-primary"]

OR

//span[@class='originalProductPrice']/ancestor::table/following::a[text()='See More']

Also there can be different ways to locate the same element. you can go through some tutorial to get the idea about using following contains ancestor sibling parent etc in xpath. Refer this site or google the same topic.