Question

I have the following HTML on a page that I am trying to test with cucumber.

<div class='try_options'>
  <ul>
    <li>
      <div>
        <img alt="" src="/images/main_page1.jpg" />
        <div class='right_section'>

          <p>
            Feature 1
          </p>
          <a class='suggest_btn' href='url1'>Try Now</a>
        </div>
      </div>
    </li>
    <li>
      <div>
        <img alt="" src="/images/main_page2.jpg" />
        <div class='right_section'>

          <p>
            Feature 2
          </p>
          <a class='suggest_btn' href='url2'>Try Now</a>
        </div>
      </div>
    </li>
    <li>
      <div>
        <img alt="" src="/images/main_page3.jpg" />
        <div class='right_section'>

          <p>
            Feature 3
          </p>
          <a class='suggest_btn' href='url3'>Try Now</a>
        </div>
      </div>
    </li>
    <li>
      <div>
        <img alt="" src="/images/main_page4.jpg" />
        <div class='right_section'>

          <p>
            Feature 4
          </p>
          <a class='suggest_btn' href='url4'>Try Now</a>
        </div>
      </div>
    </li>
  </ul>
</div>

Basically, there are features, each with a “Try Now” link. I want to test if clicking on the link takes me to the page for the respective feature.

I found a simalar step implementation here, but there is something wrong with the XPATH. Any help would be much appreciated.

Answer 1

When I’ve done something similar before, I’ve used XPath to locate the ‘identifier’ element – in your case the p tag containing e.g. ‘Feature 1’, then walked up the DOM to a common parent (li here), and down again to find whatever sibling I was after (e.g. the link associated with the p). This may work for you:

def find_link_for_feature(feature_name)
    find(:xpath, "//p[contains(.,'#{feature_name}')]/ancestor::li/descendant::a")
end

find_link_for_feature('Feature 1').click

You may want to add extra filtering so that it only finds the link with the suggest_btn class, depending on your situation.

As I mentioned in the comment on the question, however, I much prefer to modify the markup so that it’s actually testable without having to jump through hoops such as these! I consider this kind of XPath to be something of a last resort for when I’m not able to modify the markup.

EDIT:

Thinking about your comment asking how to do other things in the scope of the parent element, I’d be more tempted to do something like the following, which gives you more flexibility, and trims down the ugly XPath slightly:

def find_section_for_feature(feature_name)
    find(:xpath, "//p[contains(.,'#{feature_name}')]/ancestor::li")
end

within find_section_for_feature('Feature 1') do
    click_link 'Try Now'
    # Anything else you want to do
and