How to click random links one by one inside a table - watir

Question

I am automating a site in which I want to click on the links inside a table.
In UI, the table showing like this:
Action Contract Line Item Number Product Product Code
Edit | Del CLI-757042 OpenTable System (Guest Center) SYS010
Edit | Del CLI-757043 Guests Seated from Online GC
I want to click the links CLI-757042,CLI-757043,CLI-757044 one by one. The numbers are random.
Below is the html code:
<!-- WrappingClass -->
<div class="listRelatedObject customnotabBlock"><div class="bPageBlock brandSecondaryBrd secondaryPalette"><div class="pbHeader"> … </div><div id="800f00000006cQt_00Na000000ASdVK_body" class="pbBody"><table class="list" cellspacing="0" cellpadding="0" border="0"><tbody><tr class="headerRow"> … </tr>
<!-- ListRow -->
<tr class="dataRow even first" onmouseover="if (window.hiOn){hiOn(this);}" onmouseout="if (window.hiOff){hiOff(this);}" onfocus="if (window.hiOn){hiOn(this);}" onblur="if (window.hiOff){hiOff(this);}"><td class="actionColumn"> … </td><th class=" dataCell " scope="row"><a href="/a1if0000000ZfEv">
CLI-757042
</a></th><td class=" dataCell "> … </td><td class=" dataCell "> … </td><td class=" dataCell CurrencyElement"> … </td><td class=" dataCell "> … </td><td class=" dataCell CurrencyElement"> … </td><td class=" dataCell numericalColumn"> … </td><td class=" dataCell numericalColumn"> … </td><td class=" dataCell CurrencyElement"> … </td><td class=" dataCell "> … </td></tr>
<!-- ListRow -->
<tr class="dataRow odd" onmouseover="if (window.hiOn){hiOn(this);}" onmouseout="if (window.hiOff){hiOff(this);}" onfocus="if (window.hiOn){hiOn(this);}" onblur="if (window.hiOff){hiOff(this);}"><td class="actionColumn"> … </td><th class=" dataCell " scope="row"> … </th><td class=" dataCell "> … </td><td class=" dataCell "> … </td><td class=" dataCell CurrencyElement"> … </td><td class=" dataCell "> … </td><td class=" dataCell CurrencyElement"> … </td><td class=" dataCell numericalColumn"> … </td><td class=" dataCell numericalColumn"> … </td><td class=" dataCell CurrencyElement"> … </td><td class=" dataCell "> … </td></tr>
<!-- ListRow -->
<tr class="dataRow even" onmouseover="if (window.hiOn){hiOn(this);}" onmouseout="if (window.hiOff){hiOff(this);}" onfocus="if (window.hiOn){hiOn(this);}" onblur="if (window.hiOff){hiOff(this);}"> … </tr>
<!-- ListRow -->
<tr class="dataRow odd" onmouseover="if (window.hiOn){hiOn(this);}" onmouseout="if (window.hiOff){hiOff(this);}" onfocus="if (window.hiOn){hiOn(this);}" onblur="if (window.hiOff){hiOff(this);}"> … </tr>
<!-- ListRow -->
<tr class="dataRow even last" onmouseover="if (window.hiOn){hiOn(this);}" onmouseout="if (window.hiOff){hiOff(this);}" onfocus="if (window.hiOn){hiOn(this);}" onblur="if (window.hiOff){hiOff(this);}"> … </tr></tbody></table><div class="pShowMore"> … </div></div><div class="pbFooter secondaryPalette"> … </div></div></div><div class="listElementBottomNav"></div><script> … </script>
<!-- End ListElement -->
</div>
<!-- End RelatedListElement -->
<!-- Begin RelatedListElement -->
<div id="800f00000006cQt_00Na000000ASdVM" class="bRelatedList"><a name="800f00000006cQt_00Na000000ASdVM_target"></a>
<!-- Begin ListElement -->
<!-- motif: Contract -->
<!-- WrappingClass -->
<div class="listRelatedObject Custom18Block"><div class="bPageBlock brandSecondaryBrd secondaryPalette"><div class="pbHeader"><table cellspacing="0" cellpadding="0" border="0"><tbody><tr><td class="pbTitle"><img class="minWidth" width="1" height="1" title="" alt="" src="/s.gif"></img><img class="relatedListIcon" title="Order" alt="Order" src="/s.gif"></img><h3 id="800f00000006cQt_00Na000000ASdVM_title"> … </h3></td><td class="pbButton"> … </td><td class="pbHelp"> … </td></tr></tbody></table></div><div id="800f00000006cQt_00Na000000ASdVM_body" class="pbBody"> … </div><div class="pbFooter secondaryPalette"> … </div></div></div><div class="listElementBottomNav"></div><script> … </script>
<!-- End ListElement -->
</div>
<!-- End RelatedListElement -->
<!-- Begin RelatedListElement -->
<div id="800f00000006cQt_00Na000000ASdVR" class="bRelatedList"> … </div>
<!-- End RelatedListElement -->
<!-- Begin RelatedListElement -->
<div id="800f00000006cQt_RelatedActivityList" class="bRelatedList"> … </div>
<!-- End RelatedListElement -->
<!-- Begin RelatedListElement -->
<div id="800f00000006cQt_RelatedHistoryList" class="bRelatedList"> … </div>
<!-- End RelatedListElement -->
<!-- Begin RelatedListElement -->
<div id="800f00000006cQt_00Na000000AT3VB" class="bRelatedList"> … </div>
<!-- End RelatedListElement -->
<!-- Begin RelatedListElement -->
<div id="800f00000006cQt_RelatedNoteList" class="bRelatedList"> … </div>
<!-- End RelatedListElement -->
<!-- Begin RelatedListElement -->
<div id="800f00000006cQt_00N3000000A6gu9" class="bRelatedList"> … </div>
<!-- End RelatedListElement -->
<!-- Begin RelatedListElement -->
<div id="800f00000006cQt_RelatedEntityHistoryList" class="bRelatedList"> … </div>
<!-- End RelatedListElement -->
<div class="fewerMore"> … </div><script> … </script>
<!-- Body events -->
<script type="text/javascript"> … </script><div id="datePicker" class="datePicker"> … </div>
<!-- End page content -->
</td></tr></tbody></table></div><div class="bPageFooter noTableFooter"> … </div><div></div></div><script> … </script><script src="/jslibrary/1402506602000/sfdc/ChatterDefer.js" defer="true"></script><script src="/jslibrary/1404472812000/sfdc/Zen.js" defer="true"></script><script> … </script><script async="" defer="" src="/jslibrary/1400606638000/sfdc/SfdcSessionBase190.js"></script><iframe title="sessionserver" style="position: absolute; top: -999px; left: -999px;" src="https://test.salesforce.com/login/sessionserver190.html"></iframe><div id="devSlide" style="display: block;"> … </div><div id="InlineEditDialog" class="overlayDialog cssDialog inlineEditDialog" role="dialog" aria-live="assertive" aria-describedby="InlineEditDialogTitle" style="margin-top: 0px; margin-left: 0px;"> … </div>
When I inspect element in the 1st link it shows table with class=datacell. But there are 2-3 more tables in the page with same class name.

Answer 1

You can use the links method to collect the links and then iterate through the link collection.
Here's a contrived table as an example:
<table class="foo"><tr>
<td>one</td>
<td>two</td>
</tr></table>
<table class="foo"><tr>
<td>three</td>
<td>four</td>
</tr></table>
<table class="bar"><tr>
<td>five</td>
<td>six</td>
</tr></table>
You can collect all the links on the page or target a specific table based on its class attribute or index position.
# print the text attribute for all links
b.links.each { |link| puts link.text}
#=> one
#=> two
#=> three
#=> four
#=> five
#=> six
# print the text attribute for links in the table with a class attribute of "foo"
b.table(:class => "foo").links.each { |link| puts link.text}
#=> one
#=> two
# print the text attribute for links in the table with a index position of 1
b.table(:index => 1).links.each { |link| puts link.text}
#=> three
#=> four
# print the text attribute for links in the table with a class attribute of "bar"
b.table(:class => "bar").links.each { |link| puts link.text}
#=> five
#=> six
In theory--once you've collected the appropriate set of links--you can iterate through the links and click them (although I find this prone to StaleElementReferenceError errors).