Search code examples
capybara

Extract text from a specific row in the table with Capybara

enter image description hereFriends for me to finish my test and I just need to extract the text of the tooltip from the specific line of the table. Thomas Walpole has helped me a lot. Now I can read the excel spreadsheet and I will validate with each line of the application.

****** I read excel and get the first line *************
Spreadsheet.client_encoding = 'UTF-8'
  book = Spreadsheet.open('c:/temp/Pasta1.xls', "r")
  sheet = book.worksheet 0
  #sheet.each do |row|
  pp hydrometer = sheet.row(1)

****** reading the specific row of the table *************

I just need to extract this text save in a variable and validate with the hydrometer variable that stores the row of my excel sheet

expect(page).to have_css('tr.tvRow:nth-child(2) .tvCell:nth-child(6) img[tooltip="Invisível"]')

see the code

<tr oncontextmenu="if(!this.cancelEvent) {sendEvent(0,event,this,true,0,'TVXWFMTGINSTATOCE','bdb','BtnDropDownRow#',1,'','','');return false;} delete this.cancelEvent;" onclick="if(notSelecting()) sendEvent(0,event,this,true,0,'TVXWFMTGINSTATOCE','bdb','Select#',1,'','','');" onmousedown="if(event.ctrlKey) this.cancelEvent=true;" class="tvRow tvRowEven tvRoll tvRowSelected" style="cursor:pointer;">
   <td valign="center" align="left" class="tvCell">XWFMSLETMATRICOLA_E</td>
   <td valign="center" align="left" class="tvCell"> Nº Hidrômetro</td>
   <td align="left" class="tvCell" valign="center" nowrap=""></td>
   <td valign="center" align="left" class="tvCell"></td>
   <td align="left" width="1" class="tvCell" valign="center" tooltip="[AIMPMATRICOLA]">
      <button onclick="event.cancelBubble=true;sendEvent(0,event,this,searchImage(this),0,'','bdb','AUTOFILLBTN#',1,'','','','');" class="but butAct" tabindex="0" tooltip="Preenchimento automático ativado" type="BUTTON">
         <div><img src="r/std/icons/checkboxselected64.png" class="icon" draggable="false" align="absmiddle"></div>
      </button>
   </td>
   <td valign="center" align="center" class="tvCell"><img tooltip="Invisível" src="r/std/static/minus16.gif"></td>
   <td align="center" width="30" style="line-height:1px;padding:0px;" class="tvCell" valign="center">
      <div onclick="event.cancelBubble=true;sendEvent(0,event,this,searchImage(this),0,'','bdb','BtnDropDownRow#',1,'','','','');" class="but">
         <div><img src="r/std/icons/menu64.png" class="icon" draggable="false" align="absmiddle"></div>
      </div>
   </td>
</tr>
<tr oncontextmenu="if(!this.cancelEvent) {sendEvent(0,event,this,true,0,'TVXWFMTGINSTATOCE','bdb','BtnDropDownRow#',2,'','','');return false;} delete this.cancelEvent;" onclick="if(notSelecting()) sendEvent(0,event,this,true,0,'TVXWFMTGINSTATOCE','bdb','Select#',2,'','','');" onmousedown="if(event.ctrlKey) this.cancelEvent=true;" class="tvRow tvRowOdd tvRoll" style="cursor:pointer;">
   <td valign="center" align="left" class="tvCell">XWFMSLETLETTURA_E</td>
   <td valign="center" align="left" class="tvCell"> Leitura</td>
   <td align="left" class="tvCell" valign="center" nowrap=""></td>
   <td valign="center" align="left" class="tvCell"></td>
   <td align="left" width="1" class="tvCell" valign="center" tooltip=""></td>
   <td valign="center" align="center" class="tvCell"><img tooltip="Invisível" src="r/std/static/minus16.gif"></td>
   <td align="center" width="30" style="line-height:1px;padding:0px;" class="tvCell" valign="center">
      <div onclick="event.cancelBubble=true;sendEvent(0,event,this,searchImage(this),0,'','bdb','BtnDropDownRow#',2,'','','','');" class="but">
         <div><img src="r/std/icons/menu64.png" class="icon" draggable="false" align="absmiddle"></div>
      </div>
   </td>
</tr>
Solution

  • If hydrometer contains the text you're checking for just interpolate it in the CSS selector you're using

    expect(page).to have_css("tr.tvRow:nth-child(2) .tvCell:nth-child(6) img[tooltip='#{hydrometer}']")

    Since your going through a loop you'd probably also want to interpolate the row number but I don't know what variable you have that in

    expect(page).to have_css("tr.tvRow:nth-child(#{row_number}) .tvCell:nth-child(6) img[tooltip='#{hydrometer}']")

    If you really want to get the tooltip text for a specific row you would do

    text = find("tr.tvRow:nth-child(2) .tvCell:nth-child(6) img[tooltip]")[:tooltip] # get the tooltip attribute value from the 2nd row

    but doing that and then comparing it to some other string is bad practice and will lead to flaky tests. It is much better to do the have_css shown above