Click an edit link in a table with xpath and cucumber

Question

How can I use cucumber to click an edit link in a list of items in a table using xpath?

I've got a selector working that returns the link I need, but it's one of many results.... how can I return only 1 result?

Here is my cucumber step

When /^I click the "([^\"]*)" link for "([^\"]*)"$/ do |link, cell_value|
  within "//*[.//td[contains(.,'#{cell_value}')] and .//a[text()='#{link}']]" do |scope|
    scope.click_link link
  end
end

As you can see this will work, but will just click the first edit link in the table even though it knows about the others that it has matched... so that's no good.

Here is the table and selector: http://pastie.textmate.org/private/9od335pmsj4hi9nbe9lbow

Thank you!

This is the source of that file as well in case the service is down or linking to external code is frowned upon.

## HTML source table

<table>
  <tr>
    <th>
      Name
    </th>
    <th>
      Enabled
    </th>
    <th>
      Does Nicotine Testing
    </th>
    <th colspan='3'>
      Actions
    </th>
  </tr>
  <tr>
    <td nowrap='nowrap'>
      Microsoft
    </td>
    <td>
      Yes
    </td>
    <td>
      No
    </td>
    <td nowrap='nowrap'>
      <a href="/employers/407">Show Portal</a>
    </td>
    <td>
      <a href="/employers/407/edit">Edit</a>
    </td>
    <td>
      <a href="/employers/407" onclick="if (confirm('Are you sure you want to delete the employer \'Microsoft\'? \n\nAll of this employer\'s locations will be deleted which include: \n  \nAll users associations to those locations will also be removed. \n\nThere is NO UNDO. Proceed?')) { var f = document.createElement('form'); f.style.display = 'none'; this.parentNode.appendChild(f); f.method = 'POST'; f.action = this.href;var m = document.createElement('input'); m.setAttribute('type', 'hidden'); m.setAttribute('name', '_method'); m.setAttribute('value', 'delete'); f.appendChild(m);f.submit(); };return false;">Delete</a>
    </td>
  </tr>
  <tr>
    <td nowrap='nowrap'>
      IBM
    </td>
    <td>
      Yes
    </td>
    <td>
      No
    </td>
    <td nowrap='nowrap'>
      <a href="/employers/406">Show Portal</a>
    </td>
    <td>
      <a href="/employers/406/edit">Edit</a>
    </td>
    <td>
      <a href="/employers/406" onclick="if (confirm('Are you sure you want to delete the employer \'IBM\'? \n\nAll of this employer\'s locations will be deleted which include: \n &nbsp;&nbsp;&nbsp;1) appleton\n \nAll users associations to those locations will also be removed. \n\nThere is NO UNDO. Proceed?')) { var f = document.createElement('form'); f.style.display = 'none'; this.parentNode.appendChild(f); f.method = 'POST'; f.action = this.href;var m = document.createElement('input'); m.setAttribute('type', 'hidden'); m.setAttribute('name', '_method'); m.setAttribute('value', 'delete'); f.appendChild(m);f.submit(); };return false;">Delete</a>
    </td>
  </tr>
</table>

## XPath Selector (not working) trying to target this link: <a href="/employers/406/edit">Edit</a> (the 2nd edit link in the table)

//*[.//text()='IBM' and .//a[text()='Edit']]

Answer 1

Your xpath regex ("//*[.//td[contains(.,'#{cell_value}')] and .//a[text()='#{link}']]") is returning more than one "scope" in the form of an array, so you can specify which one to use by specifying the element: scope[0].click_link link # for the first scope[1].click_link link # for the second