How to Click the hyper Links in the table columns of webpage using Selenium web driver and how to store it - selenium

Here is my HTML Script:
How to capture the link element in the tenth row?
HTML image
<table id="dataTableParticipantSearchResults" class="display" width="100%" cellspacing="0" cellpadding="0" border="0">
<thead>
<tr align="left">
<th class="ui-state-default" width="20%" style="width: 154px;">
<div class="DataTables_sort_wrapper"></div>
</th>
<th class="ui-state-default" width="20%" style="width: 96px;"></th>
<th class="ui-state-default" width="15%" style="width: 69px;"></th>
<th class="ui-state-default" width="10%" style="width: 44px;"></th>
<th class="ui-state-default" width="20%" style="width: 156px;"></th>
<th class="ui-state-default" width="15%" style="width: 68px;"></th>
</tr>
</thead>
<tbody>
<tr class="odd" align="left">
<td></td>
</tr>
2.How to store that value, so that i can call the same value to access the link element?

You can always find these kinds of hyperlinks by first identifying the root table id- in this case it will be like this:
WebElement table = driver.findelement(by.id("dataTableParticipantSearchResults"));
Now you can use Xpath or Css Selector to select the link
try this:
table.findelement(by.cssSelector("a[href='LINK']")).click();
or try
table.findelement(by.linktext("LINK")).click();
or try
table.findelement(by.xpath(".//*[#id='dataTableParticipantSearchResults']/tbody/tr/td[0]")).click();
let me know if these work....cheers !

U can store the value in a WebElement and call any number of times.
WeElement link = table.findelement(by.xpath(".//*[#id='dataTableParticipantSearchResults']/tbody/tr/td[9]"));
now call it any number of times:
link.click();---------1st time
link.click();--------- 2nd time
and so on.....cheers !

Related

remove bordering from <tfoot element

I have created this table in my Qweb report and as you can see this table has borders. But how can I remove border for <tfoot element only? It should be bordered on <thead and <tbody.
Do I need to do it with custom CSS somehow?
<table style="border-color:grey;" class="table-bordered table-sm o_main_table" name="moves_table">
<thead>
<tr>
<th>No</th>
<th>Description</th>
<th class="text-center">Code</th>
<th class="text-right">Units</th>
<th class="text-right">Quantity</th>
<th class="text-right">Package quantity</th>
<th class="text-right">Net weight (kg)</th>
<th class="text-right">Weight incl. packaging</th>
<th class="text-right">Type of package</th>
</tr>
</thead>
<tbody class="invoice_tbody">
<tr t-foreach="o.move_ids_without_package" t-as="l">
<td class="text-center">
<span t-esc="l_index + 1" />
</td>
<td>
<span t-field="l.name"/>
</td>
<td>
<span t-field="l.product_id.default_code"/>
</td>
<td class="text-right">
<span t-field="l.product_uom.name"/>
</td>
<td class="text-right">
<span t-esc="'%.2f'%(l.product_uom_qty)"/>
</td>
<td class="text-right">
<span t-esc="'%.2f'%(l.product_uom_qty)"/>
</td>
<td class="text-right">
<span t-esc="'%.2f'%(l.product_uom_qty)"/>
</td>
<td class="text-right">
<span t-esc="'%.2f'%(l.product_uom_qty)"/>
</td>
<td class="text-right">
<span t-esc="'%.2f'%(l.product_uom_qty)"/>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td></td>
<td></td>
<td></td>
<td class="text-right"><span><strong>Total amount</strong></span></td>
<td class="text-right"><span t-esc="sum(o.move_ids_without_package.mapped('product_uom_qty'))"/></td>
<td class="text-right"><span t-esc="sum(o.move_ids_without_package.mapped('product_uom_qty'))"/></td>
<td class="text-right"><span t-esc="sum(o.move_ids_without_package.mapped('product_uom_qty'))"/></td>
<td class="text-right"><span t-esc="sum(o.move_ids_without_package.mapped('product_uom_qty'))"/></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td class="text-right"><span><strong>Total Weight</strong></span></td>
<td></td>
<td></td>
<td></td>
<td class="text-right"><span t-esc="sum(o.move_ids_without_package.mapped('product_uom_qty'))"/></td>
</tr>
</tfoot>
</table>
I suggest you do this the right way using css file, not style attributes because if you need this table, in another report you are going to repeat your self a lot and you are going to define style attribute in every td tag inside tfoo tag:
create and add css file to reports:
<template id="assets_common" name="Table no foot border" inherit_id="web.report_assets_common">
<xpath expr="." position="inside">
<link href="/your_folder_name/static/src/css/table_report_css.css" rel="stylesheet"/>
</xpath>
</template>
In your table_report_css.css file use a special class to distinct your table no-footer-border and gray-border to make border gray:
/* notice the table should have this two class */
.table-bordered.gray-border {
border-color:grey;
}
/* hide tr border inside tfoo I think this is not needed */
.table-bordered.no-footer-border tfoo tr{
border: border: none;
}
/* hide border td border inside tfoo tag this is required */
.table-bordered.no-footer-border tfoo td{
border: border: none;
}
Now in your template this two class to your table tag add table-bordered,gray-border and no-footer-border classes:
<!-- remove the style -->
<table class="table-bordered table-sm o_main_table gray-border no-footer-border" name="moves_table">
Note: don't forget to add the XML file that extends the report_assets_common to manifest, when you edit the css file no need to restart the server or upgrade your module. and this is for Odoo version >= 11.0, in < 11.0 the template of report assets is report.assets_common.

How to indent kit component items on Advanced PDF packing slip

I am setting up a customized packing slip form via Advanced PDFs in NetSuite and need help fulfilling a certain formatting request. I am having trouble with the placement of the code to indent only kit items and not their components. NetSuite will not accept my changes on the form due to the misplacement of #list and #if tags. If someone could assist clearing this issue up for me by showing an example of what that should look like, it would be most appreciated. Let me know if more information is needed here and thanks! -Ryan I have tried placing the code before and after the #list tag.
<table class="itemtable" style="width: 100%; margin-top: 10px;">
<thead>
<tr>
<th colspan="12">${salesorder.item[0].item#label}</th>
<th align="right" colspan="4">${salesorder.item[0].quantityordered#label}</th>
<th align="right" colspan="4">${salesorder.item[0].quantityremaining#label}</th>
<th align="right" colspan="4">${salesorder.item[0].quantity#label}</th>
</tr>
</thead>
<#list salesorder.item as tranline> //callout to list items from item fulfillment
<#if tranline.custcol_9r_noncomponent='T'> //checks to see if items are kits items or not
<#if tranline.custcolitemtype="Kit/Package"><tr style="font-weight:bold"> //bolds kit items
<#else><tr style="font-weight:normal"> //if not kit item, uses normal formatting
</#if> //for kit items use this formatting
<td width="15%" class="item" font-size="7pt">${tranline.item}</td>
<td width="20%" class="item">${tranline.description}</td>
<td width="8%" class="item" align="center">${tranline.quantityremaining}</td>
<td width="8%" class="item" align="center">${tranline.quantity}</td>
<td width="8%" class="item"> </td>
<td width="9%" class="item"> </td>
</tr>
<#else> //for component items, use this formatting
<tr>
<td width="15%" class="kititem" font-size="7pt"> ${tranline.item}</td>
<td width="20%" class="kititem">${tranline.description}</td>
<td width="8%" class="kititem" align="center">${tranline.quantityremaining}</td>
<td width="8%" class="kititem" align="center">${tranline.quantity}</td>
<td width="8%" class="kititem"> </td>
<td width="9%" class="kititem"> </td>
</tr>
</#if> //should refer to tranline.custcol_9r_noncomponent='T'statement
</#list> //should close the callout for list items
</table> //ends table

How to find relative Xpath if element is not having unique identifier

Please someone help me to write relative Xpath for below:
html/body/div[1]/table/tbody/tr/td[2]/table/tbody/tr[4]/td/table/tbody/tr/td[2]/table/tbody/tr[2]/td[1]/table[1]/tbody/tr[2]/td
As it do not contains any unique identifier firepath is giving an absolute Xpath but i want to use relative Xpath.
As the provided html code doesn't contains any class or id, thus you need to use below mentioned Xpath only:
html/body/div[1]/table/tbody/tr[3]/td/table/tbody/tr[1]/td[2]/div/font/b
But if you add some class or id in your html like shown below:
<html><body><div><table width="100%" cellspacing="0" cellpadding="0" border="0"> <tbody> <tr> <tr> <tr valign="top"> <td height="101"> <table width="270" cellspacing="0" cellpadding="2" border="0"> <tbody> <tr bgcolor="#CCCCCC"> <td width="80%"> <td width="20%"> <div id="price" align="right"> <font face="Arial, Helvetica, sans-serif, Verdana" size="2"> <b>$398</b> </font> </div> </td> </tr> <tr> <tr bgcolor="#CCCCCC"> <tr> <tr bgcolor="#CCCCCC"> </tbody> </table> </td> </tr> </tbody> </table></div></body></html>
Then you can use below mentioned Xpath:
.//*[#id='price']/font/b

Why does a table in a collapsible Bootstrap panel change width?

I have put together a Bootply demonstration here: http://www.bootply.com/Ss2aAnzqlZ.
It's a panel with a table as per http://getbootstrap.com/components/#panels-tables. However, I've also made the panel collapsible. The collapsing bit works OK, but the table itself doesn't retain shape. As you'll see in the Bootply, it doesn't fill the width of the panel when you first load the page. When you click "Improvements" in the panel header to collapse the panel, the table takes up the full panel width during the animation, then disappears. When you click again to show the panel content, the table is the full width until the animation stops, at which point, it shrinks back to what looks like an "auto" width.
Oddly enough, inspecting the table element shows that the table itself is full width, but the thead, tbody and tfoot aren't.
I've sort of tracked it down to the presence of the "collapse" class in the table. If you start the Bootply without the "collapse" class, it's full width until you collapse the panel. When you expand it, it goes back to auto width. I don't know why ... do you?
Here's the snippet, but the collapsing doesn't appear to run here. The Bootply is better.
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<div style="margin:15px">
<div class="panel panel-default">
<div class="panel-heading">
Improvements
</div>
<table id="improvementsPanel" class="table panel-collapse collapse in" aria-expanded="true" style="">
<thead>
<tr>
<th>Description</th>
<th class="text-right">Qty</th>
<th>UOM</th>
<th class="text-right">Rate</th>
<th class="text-right">Value</th>
</tr>
</thead>
<tbody>
<tr>
<td>Item 1</td>
<td class="text-right">133.00</td>
<td>m²</td>
<td class="text-right">425.00</td>
<td class="text-right">56,525</td>
</tr>
<tr>
<td>Item 2</td>
<td class="text-right">85.00</td>
<td>m²</td>
<td class="text-right">70.00</td>
<td class="text-right">5,950</td>
</tr>
<tr>
<td>Item 3</td>
<td class="text-right">25.00</td>
<td>m²</td>
<td class="text-right">100.00</td>
<td class="text-right">2,500</td>
</tr>
<tr>
<td>Item 4</td>
<td class="text-right"></td>
<td></td>
<td class="text-right"></td>
<td class="text-right">1,500</td>
</tr>
</tbody>
<tfoot>
<tr>
<th class="text-right" colspan="4">Total</th>
<th class="text-right">66,475</th>
</tr>
</tfoot>
</table>
</div>
</div>
The collapse class toggles the display style on the table between none and block and this appears to be interfering with the standard table CSS.
You can resolve this by putting your table inside a div and setting that div to collapse rather than the table.
New Bootply: http://www.bootply.com/L8h2OdpMuD
HTML:
<div style="margin: 15px">
<div class="panel panel-default">
<div class="panel-heading">
Improvements
</div>
<div id="improvementsPanel" class="panel-collapse collapse in" aria-expanded="true">
<table class="table">
<thead>
<tr>
<th>Description</th>
<th class="text-right">Qty</th>
<th>UOM</th>
<th class="text-right">Rate</th>
<th class="text-right">Value</th>
</tr>
</thead>
<tbody>
<tr>
<td>Item 1</td>
<td class="text-right">133.00</td>
<td>m²</td>
<td class="text-right">425.00</td>
<td class="text-right">56,525</td>
</tr>
<tr>
<td>Item 2</td>
<td class="text-right">85.00</td>
<td>m²</td>
<td class="text-right">70.00</td>
<td class="text-right">5,950</td>
</tr>
<tr>
<td>Item 3</td>
<td class="text-right">25.00</td>
<td>m²</td>
<td class="text-right">100.00</td>
<td class="text-right">2,500</td>
</tr>
<tr>
<td>Item 4</td>
<td class="text-right"></td>
<td></td>
<td class="text-right"></td>
<td class="text-right">1,500</td>
</tr>
</tbody>
<tfoot>
<tr>
<th class="text-right" colspan="4">Total</th>
<th class="text-right">66,475</th>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
Alternatively, you can add the css:
table.collapse.in {
display: table;
}
Arguably this could be a patch to component-animations.less.

Selenium - pulling data from a website table assign to variable

I am attempting to pull a value and a header (string) from a website, but unable to find the element using selenium.
My Code
I used Firebug to get the XPath and this is what it determined:
//*[#id="DimensionForm"]/p[1]/table/tbody/tr[3]/td[3]
Code
Dim Right as double
Dim Marker as string
Marker = selenium.findElementByXPath("//*[#id="DimensionForm"]/p[1]/table/tbody/tr[2]/td[3]").getAttribute("value")
Right = selenium.findElementByXPath("//*[#id="DimensionForm"]/p[1]/table/tbody/tr[3]/td[3]").getAttribute("value")
HTML CODE
<form id="DimensionForm" name="validate" action="Dimension" method="post">
<div style="margin-top: 7px"></div>
<p><table width="100%" cellspacing="0" border="0" cellpadding="0" class="element">
<tr>
<td> </td><td class="formtitlenobg" colspan="6" align='right'>
AREA DIMENSIONS (AREA A) <span class='quote'> Front</span> 25.24</td>
</tr>
<tr align="right">
<td class="tablerowlightgreen" width=10> </td>
<th class="formtitle" width=250 align="left">Property</th>
<th class="formtitle" width=50>Check</th> <th class="formtitle" width=75>Front</th>
<th class="formtitle" width=75>Center</th><th class="formtitle" width=75>Left</th>
<th class="formtitle" width=120>Right</th>
<th class="formtitle" width=100>Total</th>
<td class="tablerow" width=50> </td>
<td class="tablerow"> </td>
</tr>
<tr align="right" nowrap>
<td> </td>
<td class="table" align="left"><strong>
Property O</strong></td>
<td class="table">+</td>
<td class="table">10</td>
<td class="table">12</td>
<td class="table"><strong>12</strong></td>
<td class="table"><strong><font class="front">
100</font></strong></td>
<td class="table">120</td>
<td> </td>
<td> </td>
</tr>
</table></td>
</tr></table>
You have incorrectly nested quotes:
selenium.findElementByXPath("//*[#id="DimensionForm"]/p[1]/table/tbody/tr[2]/td[3]")
Perhaps you meant:
selenium.findElementByXPath("//*[#id='DimensionForm']/p[1]/table//tr[2]/td[3]")
Note the single-quotes in the second line!