Friends 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>
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
I have coded an email template and it works great overall but I have an issue with the length of the divider line:
The divider is way too long when I send a test mail to my outlook mail but have the right length on all other mail clients.
<table border="0" agrepeatingblock="active" role="presentation" cellpadding="0" width="100%" cellspacing="0" style="width: 100%;" agid="greenline-development_group_2_block_11">
<tr>
<td align="center" style="vertical-align:top;padding:Block::Margin_top|INTEGER|0px 0 Block::Margin_bottom|INTEGER|0px;">
<table width="100%" border="0" cellspacing="0" cellpadding="0" role="presentation" style="width:100%;background-color:Block::Block_container|COLOR|transparent;">
<tr>
<td align="center" style="vertical-align: top;">
<!--[if (gte mso 9)|(IE)]>
<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" style="width:100%;" role="presentation">
<tr>
<td align="center" valign="top" width="100%" style="width:100%; max-width:706px">
<![endif]-->
<table border="0" cellpadding="0" width="100%" cellspacing="0" style="width:100%;max-width:706px;Margin:0 auto;background-color:Block::Content_container|COLOR|transparent;" role="presentation">
<tr>
<td align="center" style="vertical-align:top;padding:${blockparam:Block::Padding_top|INTEGER|10}px 12px 0;" class="pt-10">
<table width="100%" border="0" cellspacing="0" cellpadding="0" role="presentation" style="width: 100%;">
<tr>
<td align="center" style="vertical-align: top; padding: 10px 12px;">
<table width="100%" border="0" cellspacing="0" cellpadding="0" role="presentation" style="width: 100%;">
<tr>
<td
height="${blockparam:Block::Padding_bottom|INTEGER|10}"
style="border-top:${blockparam:Horizontal_rule::Size|INTEGER|1}px solid ${blockparam:Horizontal_rule::Color|COLOR|#47c16c};height:${ref:Block::Padding_bottom}px;font-size:${ref:Block::Padding_bottom}px;line-height:${ref:Block::Padding_bottom}px;"
class="h-sm-10"
></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</td>
</tr>
</table>
</td>
</tr>
</table>
Is it possible to provide dropdownlist in the new row added to WebGrid? I tried adding this
'<td >#Html.DropDownList("Team", (IEnumerable<SelectListItem>)ViewBag.Teams, "")</td>'
and it says
Uncaught SyntaxError: Invalid or unexpected token at <td ><select id="Team" name="Team"><option value=""></option>.
Code:
var row = '<tr class="webgrid-row-style">'+
'<td class="col3Width"><input type="text" id="Date" value="" class="edit-mode date-picker" /></td>' +
'<td >#Html.DropDownList("Team", (IEnumerable<SelectListItem>)ViewBag.Teams, "")</td>' +
'<td ><span><input type="text" id="Name" value="" class="edit-mode /></span></td>' +
'<td ><span><input type="text" id="Category" value="" class="edit-mode/></span></td>' +
'<td ><span><input type="text" id="Received_Count" value="" class="edit-mode" /></span></td>' +
'<td ><span><input type="text" id="Done_Count" value="" class="edit-mode" /></span></td>' +
'<td ><button class="add-item edit-mode">Add</button> <button class="remove-item edit-mode">Cancel</button></td>' +
'</tr>';
$('table tbody:last').append(row);
Error:
When you use #Html.DropDownList in a javascript string like
'<td >#Html.DropDownList("Team", (IEnumerable<SelectListItem>)ViewBag.Teams, "")</td>'
it generates a string in multiple lines like below
'<td ><select id="Team" name="Team"><option value=""></option>
<option>Sukantha</option>
<option>Shruti</option>
<option>Shilpa</option>
<option>Sachin</option>
<option>Ramya</option>
<option>Nishmitha</option>
<option>Mahesh</option>
</select></td>'
which is invalid, hence you got the error.
As a workaround, try to place the #Html.DropDownList inside a hidden div somewhere in your view
<div id="divTeams" style="display: none;">
#Html.DropDownList("Team", (IEnumerable<SelectListItem>)ViewBag.Teams, "")
</div>
then get the generated string using $('#divTeams').html()
var row = '<tr class="webgrid-row-style">'+
'<td class="col3Width"><input type="text" id="Date" value="" class="edit-mode date-picker" /></td>' +
'<td >' + $('#divTeams').html() + '</td>' +
'<td ><span><input type="text" id="Name" value="" class="edit-mode /></span></td>' +
'<td ><span><input type="text" id="Category" value="" class="edit-mode/></span></td>' +
'<td ><span><input type="text" id="Received_Count" value="" class="edit-mode" /></span></td>' +
'<td ><span><input type="text" id="Done_Count" value="" class="edit-mode" /></span></td>' +
'<td ><button class="add-item edit-mode">Add</button> <button class="remove-item edit-mode">Cancel</button></td>' +
'</tr>';
$('table tbody:last').append(row);
I try to import an email-template in campaign monitor, but it shows always the same problem:
No unsubscribe link We require a single-click unsubscribe link in every campaign you send. Please add the tags and around the words you want to become an unsubscribe link.
What I do not understand is, that I have the tag in my template:
<layout label="POST-FOOTER25">
<table width="100%" bgcolor="#fff" cellpadding="0" cellspacing="0" border="0" id="backgroundTable">
<tbody>
<tr>
<td width="100%">
<table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidthinner">
<tbody>
<!-- Top Spacing -->
<tr>
<td width="100%" height="10" style="font-size: 0;line-height: 0;border-collapse: collapse;"> </td>
</tr>
<!-- Top Spacing -->
<tr>
<td width="100%">
<table width="560" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidthinner">
<tbody class="">
<tr class="">
<td width="100%" align="right" valign="middle" style="font-family: 'Open Sans', Arial, sans-serif; font-size: 12px; line-height: 16px; color: rgb(62, 69, 76); text-align: center; font-weight: 400;" mgedit="text" class="aligncenter">
<multiline label="text617_86">
<!--[if !mso]><!-->
<span style="font-family: 'Open Sans', Arial, sans-serif;">
<!--<![endif]-->
You are receiving this email because you subscribed for updates on our website. <unsubscribe>Click here to Unsubscribe</unsubscribe><br /><br />
<preferences>Manage your subscription</preferences>
<!--[if !mso]><!-->
</span>
<!--<![endif]-->
</multiline>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<!-- Bottom Spacing -->
<tr>
<td width="100%" height="10" style="font-size: 0;line-height: 0;border-collapse: collapse;"> </td>
</tr>
<!-- Bottom Spacing -->
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</layout>
There is no comment or if-case around the unsubscribe-tag. Any other idea?
Greets, yab86
I'd recommend moving the unsubscribe and preferences markup out of the multiline markup area. It's likely their system doesn't recognize it because it's put into the editable multiline WYSIWYG Editor
I have been spending a lot of time working with jsPDF trying to create a pdf doc that uses a table with images in some cells and text in other cells. I am misunderstanding something critical. Even though I am converting the images to data urls, the images are not appearing in the final PDF. I have also tried .fromHTML but the resulting page is blank.
The only thing i can get to work so far is a straight, single column of divs with only a single item in each div. Using .fromHTML works in this way, but it doesn't seem to work with more than one div side-by-side limiting my ability to include a graphic border around the dynamic content in the middle of the doc, which is retrieved from URL-encoded pairs in the address.
So I've been trying to do it with a table instead. Here's a picture of what I am trying to achieve. Certificate Sliced . This is exported out of Photoshop using slices (shown). The table is quite simple, although it does have some colspans which could be part of my problem. I then used DataURL Maker to encode the graphic parts, and leaving the middle cells that have text-only alone as html text.
Here's the table as output from Photoshop (with original image links):
<html>
<head>
<title>Certificate 2015-table</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Save for Web Slices (Certificate 2015-table.psd) -->
<table id="Table_01" width="997" height="750" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="5"><img src="images/small-table_01.png" width="997" height="222" alt=""></td>
</tr>
<tr>
<td><img src="images/small-table_02.png" width="86" height="46" alt=""></td>
<td colspan="3"><img src="images/small-table_03.png" width="826" height="46" alt=""></td>
<td><img src="images/small-table_04.png" width="85" height="46" alt=""></td>
</tr>
<tr>
<td><img src="images/small-table_05.png" width="86" height="45" alt=""></td>
<td colspan="3"><img src="images/small-table_06.png" width="826" height="45" alt=""></td>
<td><img src="images/small-table_07.png" width="85" height="45" alt=""></td>
</tr>
<tr>
<td><img src="images/small-table_08.png" width="86" height="74" alt=""></td>
<td colspan="3"><img src="images/small-table_09.png" width="826" height="74" alt=""></td>
<td><img src="images/small-table_10.png" width="85" height="74" alt=""></td>
</tr>
<tr>
<td><img src="images/small-table_11.png" width="86" height="75" alt=""></td>
<td colspan="3"><img src="images/small-table_12.png" width="826" height="75" alt=""></td>
<td><img src="images/small-table_13.png" width="85" height="75" alt=""></td>
</tr>
<tr>
<td><img src="images/small-table_14.png" width="86" height="56" alt=""></td>
<td colspan="3"><img src="images/small-table_15.png" width="826" height="56" alt=""></td>
<td><img src="images/small-table_16.png" width="85" height="56" alt=""></td>
</tr>
<tr>
<td><img src="images/small-table_17.png" width="86" height="54" alt=""></td>
<td colspan="3"><img src="images/small-table_18.png" width="826" height="54" alt=""></td>
<td><img src="images/small-table_19.png" width="85" height="54" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="3"><img src="images/small-table_20.png" width="565" height="99" alt=""></td>
<td><img src="images/small-table_21.jpg" width="255" height="19" alt=""></td>
<td colspan="2" rowspan="3"><img src="images/small-table_22.png" width="177" height="99" alt=""></td>
</tr>
<tr>
<td><img src="images/small-table_23.png" width="255" height="22" alt=""></td>
</tr>
<tr>
<td><img src="images/small-table_24.png" width="255" height="58" alt=""></td>
</tr>
<tr>
<td colspan="5"><img src="images/small-table_25.png" width="997" height="78" alt=""></td>
</tr>
<tr>
<td><img src="images/spacer.gif" width="86" height="1" alt=""></td>
<td><img src="images/spacer.gif" width="479" height="1" alt=""></td>
<td><img src="images/spacer.gif" width="255" height="1" alt=""></td>
<td><img src="images/spacer.gif" width="92" height="1" alt=""></td>
<td><img src="images/spacer.gif" width="85" height="1" alt=""></td>
</tr>
</table>
<!-- End Save for Web Slices -->
</body>
The goal of course will be to have a single certificate that can be customized for each student and each course that can be downloadable as PDF. Is it possible to include pictures in cells of a table and save with jsPDF?
Thanks for any help,
--Kevin