Using watir to click table element without id - watir

I have a dynnamic table that I would like to use watir to select a edit button. It doesn't have a traditional watir id that I can select (example: browser.img(:title, "iconname")) and there may be multiple edit icons to choose from. In the past I would get the correct element by querying the database. However this does not have a database entry to help me select the correct edit link this time.
In the code below what I am trying to select is from the section where it shows "autogenerated3" I am trying to select either the "onclick" element or the "img src"
Both are selectable items that will click the edit icon.
<div id="certificate_table" style="margin-bottom: 1em">
<table cellspacing="0">
<tbody>
<tr>
<th>Alias</th>
<th>Common Name</th>
<th class="centered">Status</th>
<th class="centered">In Use</th>
<th class="centered">Issued</th>
<th class="centered">Expires</th>
<th class="centered">Days</th>
<th>Actions</th>
</tr>
<tr class="normal">
<td>autogenerated2</td>
<td>default.domain.com</td>
<td class="centered"> Revoked </td>
<td class="centered">
<td class="centered"> 10/18/2013 19:46:34 GMT </td>
<td class="centered"> 10/17/2016 19:46:34 GMT </td>
<td class="centered">N/A</td>
<td>
<a onclick="new Ajax.Request('/media/certificates/edit_certificate/3', {asynchronous:true, evalScripts:true}); return false;" href="#">
<img title="Edit" src="/media/images/icons/edit.gif?1276876449" alt="Edit">
</a>
</td>
</tr>
<tr class="alt">
<td>autogenerated3</td>
<td>autogenerated3.domain.com</td>
<td class="centered"> CSR Issued </td>
<td class="centered">
<td class="centered"> 10/18/2013 20:54:55 GMT </td>
<td class="centered"> 10/17/2016 20:54:55 GMT </td>
<td class="centered">1092 </td>
<td>
<a onclick="new Ajax.Request('/media/certificates/edit_certificate/4', {asynchronous:true, evalScripts:true}); return false;" href="#">
<img title="Edit" src="/media/images/icons/edit.gif?1276876449" alt="Edit">
</a>
<a onclick="new Ajax.Request('/media/certificates/generate_csr/4', {asynchronous:true, evalScripts:true}); return false;" href="#">
<a onclick="new Ajax.Request('/media/certificates/import_certificate_reply/4', {asynchronous:true, evalScripts:true}); return false;" href="#">
<a onclick="if (confirm('Are you sure you want to revoke this certificate?')) { new Ajax.Request('/media/certificates/revoke_certificate/4', {asynchronous:true, evalScripts:true}); }; return false;" href="#">
</td>
</tr>
<tr class="normal">
<td>Original Certificate</td>
<td>localhost.localdomain</td>
<td class="centered"> Self Signed </td>
<td class="centered">
<td class="centered"> 10/03/2013 22:37:02 GMT </td>
<td class="centered"> 10/03/2014 22:37:02 GMT </td>
<td class="centered">347 </td>
<td>
<a onclick="new Ajax.Request('/media/certificates/edit_certificate/1', {asynchronous:true, evalScripts:true}); return false;" href="#">
<img title="Edit" src="/media/images/icons/edit.gif?1276876449" alt="Edit">
</a>
</td>
</tr>
<tr class="alt">
<td>vhost4</td>
<td>vhost4.domain.com</td>
<td class="centered"> Revoked </td>
<td class="centered">
<td class="centered"> 10/18/2013 15:58:01 GMT </td>
<td class="centered"> 10/17/2016 15:58:01 GMT </td>
<td class="centered">N/A</td>
<td>
<a onclick="new Ajax.Request('/media/certificates/edit_certificate/2', {asynchronous:true, evalScripts:true}); return false;" href="#">
<img title="Edit" src="/media/images/icons/edit.gif?1276876449" alt="Edit">
</a>
</td>
</tr>
</tbody>
</table>
I don't have trouble selecting a icon. Just trouble selecting the correct icon. Both the onclick and image values are selectable items. The icon may not be the last item in the list. I saw a post to try .last.click which does select the last icon in the list. Unfortunately the table posts the data in alphabetical order based on the Alias name. So it may not be the last item in the list and cannot use this method. Suggestions?
b.div(:id, "certificate_table").imgs(:src => "/media/images/icons/edit.gif?1276876449").last.when_present.click

It sounds like you need to find an element based on its siblings, so you might find this blog post useful. The post gives two options you might consider.
If the text you are looking for is unique - ie the row that has the text is definitely going to be the right row, you can find the td, go to the parent row and then get the link.
b.td(:text => 'autogenerated3').parent.link.click
If you need to ensure that the text is in the first column, then you can do:
b.trs.find{ |tr|
tr.td.exists? and tr.td(:index => 0).text == 'autogenerated3'
}.link.click
The tr.td.exists? is added since some of your rows do not have any tds, which would cause an exception when checking the second criteria.

Related

How do I parse this html with Python lxml & xpath that finds the parent table of a specific span id?

Here is the HTML I don't have any control over. This is condensed HTML of the real page.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Little League</title>
</head>
<body>
<table>
<span>lot of unrelated text</span>
</table>
<table>
<span>lot of unrelated text</span>
</table>
<table>
<span>lot of unrelated text</span>
</table>
<table>
<tbody>
<tr>
<td class="rightTD">
<p>
<span id="teams_players">Player Teams</span>
</p>
</td>
</tr>
<tr>
<td>
<table border="1" cellspacing="0" cellpadding="0" class="tableBorder table table-bordered" width="100%">
<tbody>
<tr>
<td>
<table border="0" width="100%" class="tableData">
<tbody>
<tr id="team_listings">
<td colspan="3">Team Listings
<br>
<br>
</td>
</tr>
<tr>
<td>(a) </td>
<td colspan="2">Team Name </td>
</tr>
<tr>
<td></td>
<td colspan="2">
<span class="blue_color">Foxes</span>
</td>
</tr>
<tr>
<td>(b) </td>
<td colspan="2">Team Rank</td>
</tr>
<tr>
<td></td>
<td colspan="2">
<span class="blue_color">1</span>
</td>
</tr>
<tr>
<td>(c) </td>
<td colspan="2">Team Location
</td>
</tr>
<tr>
<td></td>
<td colspan="2">
<table width="100%">
<tbody>
<tr>
<td>City:
<br>
<span class="blue_color">Tualatin</span>
</td>
<td>State:
<br>
<span class="blue_colorLined"></span>
<br>
<span class="blue_color">Oregon</span>
</td>
<td>Country:
<br>
<span class="blue_colorLined"></span>
<br>
<span class="blue_color">United States</span>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<br>
<table border="1" cellspacing="0" cellpadding="0" class="tableBorder table table-bordered" width="100%">
<tbody>
<tr>
<td>
<table border="0" width="100%" class="tableData">
<tbody>
<tr>
<td>(a) </td>
<td colspan="2">Team Name </td>
</tr>
<tr>
<td></td>
<td colspan="2">
<span class="blue_color">Tigers</span>
</td>
</tr>
<tr>
<td>(b) </td>
<td colspan="2">Team Rank</td>
</tr>
<tr>
<td></td>
<td colspan="2">
<span class="blue_color">3</span>
</td>
</tr>
<tr>
<td>(c) </td>
<td colspan="2">Team Location
</td>
</tr>
<tr>
<td></td>
<td colspan="2">
<table width="100%">
<tbody>
<tr>
<td>City:
<br>
<span class="blue_color">Tigard</span>
</td>
<td>State:
<br>
<span class="blue_colorLined"></span>
<br>
<span class="blue_color">Oregon</span>
</td>
<td>Country:
<br>
<span class="blue_colorLined"></span>
<br>
<span class="blue_color">United States</span>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>
I am trying to get to the table tag immediately preceding the span tag with id team_players.
I tried these but failed -
//table/span[#id="teams_players"]
ancestor::table[span[#id="teams_players"][position() = 1]]
This works but is not elegant and I prefer not to hardcode it -
//span[#id="teams_players"]/../../../../..
While //table[#class="tableData"] this might seem like it should work, there are many such tables in the HTML that has the same class with unrelated data. So this is ruled out.
Here is the code so far with my attempts (definitely not efficient, once I find a way of fetching both tables, I plan on looping through them to extract the data -
def parse_team():
# team data structure
teams = []
team_dict = { 'team': '', 'rank': '', 'location': { 'city': '', 'state': '', 'country': '' } }
filename = f'team.html'
f = open(filename, encoding="utf8").read()
parser = etree.HTMLParser()
tree = etree.parse(StringIO(f), parser)
# fetch the table dom and parse each team table
# fetch the parent table that contains teams_players span id
team_tables = tree.xpath('ancestor::table[span[#id="teams_players"][position() = 1]]')
print(team_tables)
root_tables = tree.xpath('//table/span[#id="teams_players"]')
print("root tables", root_tables)
# this provides each team table but in full html, the same class is being used for other unrelated data
name = tree.xpath('//table[#class="tableData"]')
print(name)
eachvaltr = name[0].xpath('.//tr')
teamname = name[0].xpath('.//td[contains(text(),"Team Name")]//parent::tr/following-sibling::tr[1]//span[#class="blue_color"]/text()')
print("teamname", teamname)
teamrank = name[0].xpath(
'.//td[contains(text(),"Team Rank")]//parent::tr/following-sibling::tr[1]//span[#class="blue_color"]/text()')
print("teamrank", teamrank)
city = name[0].xpath(
'.//td[contains(text(),"City")]//span[#class="blue_color"]/text()')
state = name[0].xpath(
'.//td[contains(text(),"State")]//span[#class="blue_color"]/text()')
country = name[0].xpath(
'.//td[contains(text(),"Country")]//span[#class="blue_color"]/text()')
print(city[0], state[0], country[0])
team_dict['team'] = teamname
team_dict['rank'] = teamrank
team_dict['location']['city'] = city[0]
team_dict['location']['state'] = state[0]
team_dict['location']['country'] = country[0]
print(team_dict)
Desired output is a list of teams where each team is a dict.
[{'team': ['Foxes'], 'rank': ['1'], 'location': {'city': 'Tualatin', 'state': 'Oregon', 'country': 'United States'}}]
//table[.//span[#id="teams_players"]]
or
//span[#id="teams_players"]/ancestor::table

Use HTML Table without headers

I've a table, where the normal guidance for HTML tables arn't followed.
My best move will be, to just create a proper JSON-object, and using that.
But i'll like to ask, if there is any options for parsing an HTML table, "without headers", and define them in Tabulator, instead.
I know the case id odd, but i'll just like to hear :-)
Example where no thead and th is in the HTML-source:
<table border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr height="16">
<td colspan="16">
Something
</td>
<td colspan="16">
14
</td>
<td colspan="16">
2020-01-28
</td>
</tr>
</tbody>
</table>
Im afraid not.
When Tabulator is built on a table element, it parses the HTML to create a JavaScript object for each row of the table, using the column headers as property names.
Without headers it would have no reasonable way to map the column values onto an object.
I solve problem like this
<table border="0" cellpadding="0" cellspacing="0">
<tr height="16" hidden>
<td colspan="16">
</td>
<td colspan="16">
</td>
<td colspan="16">
</td>
</tr>
<tr height="16">
<td colspan="16">
Something
</td>
<td colspan="16">
14
</td>
<td colspan="16">
2020-01-28
</td>
</tr>
</table>

beautifulsoup for looping and getting text and Href

I'm in a bit of a quinch here:
its an ASP site which is really messy that I am trying to get data from:
I'm trying to use a for loop to get an href and the text of all the rows of the 4th table that is on the site, so I first did:
table = soup.findAll('table')[3]
Then from this table I need to get all text inside the <tr> tags and the href's of the <a> inside.
i tried something like this:
for product in table.findAll('tbody'):
product_title = product.find('tr').text
product_link = product.find('a')['href']
print (product_title, product_link)
But I get nothing in return
The table Im working on:
<tr bgcolor="#EFEFEF">
<td>
<a href="free.asp?detail=hide&c_id=4342141">
<img align="absmiddle" border="0" hspace="0" src="pic/bullet.gif" vspace="0"/>
</a>
</td>
<td>
4342141
</td>
<td width="10">
</td>
<td>
25.07.2018 09:00
</td>
<td width="10">
</td>
<td>
Ankara
</td>
<td width="10">
-
</td>
<td>
Konya
</td>
<td colspan="2">
</td>
</tr>
<tr bgcolor="#EFEFEF" height="3">
<td colspan="10">
</td>
</tr>
<tr bgcolor="#FFFFFF" height="1">
<td colspan="10">
</td>
</tr>
<tr bgcolor="#DDDDDD" height="6">
<td colspan="10">
</td>
</tr>
<tr bgcolor="#FFFFFF" height="1">
<td colspan="10">
</td>
</tr>
<tr bgcolor="#DEE3E7" height="3">
<td colspan="10">
</td>
</tr>
<tr bgcolor="#DEE3E7">
<td>
<a href="free.asp?detail=hide&c_id=4134123">
<img align="absmiddle" border="0" hspace="0" src="pic/bullet.gif" vspace="0"/>
</a>
</td>
<td>
4134123
</td>
<td width="10">
</td>
<td>
26.07.2018 09:00
</td>
<td width="10">
</td>
<td>
Van
</td>
<td width="10">
-
</td>
<td>
Istanbul
</td>
<td colspan="2">
</td>
</tr>
Instead of extracting text from tbody from table, you can directly get all tr tags.
Based on your snippet you can refer to this code snippet for data extraction from table.
soup = BeautifulSoup(text, 'html.parser')
all_products = []
for tr in soup.find_all('tr'):
text = tr.get_text(separator=' ', strip=True)
if text:
a_tag = tr.find('a')
if a_tag:
product_link = a_tag.attrs['href']
all_text = text + ' ' + product_link
all_products.append(all_text.split(' '))
print(all_products)
Output is:
[['4342141', '25.07.2018', '09:00', 'Ankara', '-', 'Konya', 'free.asp?detail=hide&c_id=4342141'], ['4134123', '26.07.2018', '09:00', 'Van', '-', 'Istanbul', 'free.asp?detail=hide&c_id=4134123']]

How to pass product TVs to SimpleCart's scGetCart snippet?

I need some TVs (weight, dimensions, etc) I've associated with my products to appear in the Cart page of my SimpleCart site.
Problem is I have no idea how to do this. I don't understand how the SimpleCart cart is built and there isn't documentation for this.
Would anyone know how I can show TVs associated with each product in the cart output chunk?
The cart snippet has the following code which gets data from the cart and puts it into Chunks:
$sc = $modx->getService('simplecart','SimpleCart',$modx->getOption('simplecart.core_path',null,$modx->getOption('core_path').'components/simplecart/').'model/simplecart/',$scriptProperties);
if (!($sc instanceof SimpleCart)) return '';
 
$controller = $sc->loadController('Cart');
$output = $controller->run($scriptProperties);
The output Chunk looks like:
<div id="simplecart">
<form action="[[~[[*id]]]]" method="post" id="form_cartoverview">
<input type="hidden" name="updatecart" value="true" />
<table>
<tr>
<th class="desc">[[%simplecart.cart.description]]</th>
<th class="price">[[%simplecart.cart.price]]</th>
<th class="quantity">[[%simplecart.cart.quantity]]</th>
[[+cart.total.vat_total:notempty=`<th class="quantity">[[%simplecart.cart.vat]]</th>`:isempty=``]]
<th class="subtotal">[[%simplecart.cart.subtotal]]</th>
<th> </th>
</tr>
[[+cart.wrapper]]
[[+cart.total.discount:notempty=`<tr class="total first discount">
<td colspan="[[+cart.total.vat_total:notempty=`3`:isempty=`2`]]"> </td>
<td class="label">[[%simplecart.cart.discount]]</td>
<td class="value">- [[+cart.total.discount_formatted]]</td>
<td class="extra">[[+cart.total.discount_percent:notempty=`([[+cart.total.discount_percent]]%)`:isempty=` `]]</td>
</tr>`:isempty=``]]
[[+cart.total.vat_total:notempty=`
<tr class="total [[+cart.total.discount:notempty=`second`:isempty=`first`]]">
<td colspan="3"> </td>
<td class="label">[[%simplecart.cart.total_ex_vat]]</td>
<td class="value">[[+cart.total.price_ex_vat_formatted]]</td>
<td class="extra"> </td>
</tr>
[[+cart.vat_rates]]
<tr class="total [[+cart.total.discount:notempty=`third`:isempty=`second`]]">
<td colspan="3"> </td>
<td class="label">[[%simplecart.cart.total_vat]]</td>
<td class="value">[[+cart.total.vat_total_formatted]]</td>
<td class="extra"> </td>
</tr>
<tr class="total [[+cart.total.discount:notempty=`fourth`:isempty=`third`]]">
<td colspan="3"> </td>
<td class="label">[[%simplecart.cart.total_in_vat]]</td>
<td class="value">[[+cart.total.price_formatted]]</td>
<td class="extra"> </td>
</tr>
`:isempty=`
<tr class="total [[+cart.total.discount:notempty=`second`:isempty=`first`]]">
<td colspan="2"> </td>
<td class="label">[[%simplecart.cart.total]]</td>
<td class="value">[[+cart.total.price_formatted]]</td>
<td class="extra"> </td>
</tr>
`]]
</table>
<div class="submit">
<input type="submit" value="[[%simplecart.cart.update]]" />
</div>
</form>
This does appear to be documented:
Product Options (TVs)
and to output them:
Modifying the Product Template
It appears that you would just output them normally [[*myProductOptions]]
Though, it appears that your template is using a placeholder, I would try
[[+cart.myProductOptions] as well. If all else fails you might try debugging the simplecart class and dump the array of product data before it populates the chunk, there might be a clue in there.
Found (through trial and error) you must use:
[[+product.tv.name_of_tv]]

cellSpace not working in DreamWeaver CS6

I've pasted table code to new div in gridContainer div (using the Fluid Grid Layout option)
Everything seems fine but the cell spacing defined, when I try to change the spacing nothing happens, it keeps it on 0.
Following is the table markup:
<table align="center" cellpadding="0" cellspacing="15">
<col span="7" width="160px" />
<row span="7" width="160px" />
<!---Row 1--->
<tr align="center" height="160px">
<td colspan="2" >
<img src="images/buttons/Optimus.png" />
</td>
<td colspan="2" >
<img src="images/buttons/MapleSim.png">
</td>
<td colspan="2" >
</td>
<td colspan="1" bgcolor="#40b040">
<img src="images/buttons/about_us.png">
</td>
</tr>
<!---Row 2--->
<tr align="center" height="160px">
<td colspan="2" bgcolor="#40b040">
<img src="images/buttons/QFD.white.png">
</td>
<td colspan="1" bgcolor="#cc00cc">
<img src="images/buttons/learning_maple.png">
</td>
<td colspan="3" rowspan="2"
align="left" valign="top" bgcolor="#aaaaff">
<img src="images/buttons/news.png">
News will be shown here
</td>
<td colspan="1" bgcolor="#ff0000">
<img src="images/buttons/services.png">
</td>
</tr>
<!---Row 3--->
<tr align="center" height="160px">
<td colspan="1" bgcolor="#6766cc">
<img src="images/buttons/events.png">
</td>
<td colspan="1" bgcolor="#cccc00">
<img src="images/buttons/forum.png">
</td>
<td colspan="1" bgcolor="#4040ff">
<img src="images/buttons/links.png">
</td>
<td colspan="1" bgcolor="#ffbf00">
<img src="images/buttons/shopping_cart.png">
</td>
</tr>
<!---Row 4--->
<tr align="center" height="160px">
<td colspan="2" bgcolor="#ff0000">
<img src="images/buttons/commercial_users.png">
</td>
<td colspan="1" bgcolor="#ffbf00">
<img src="images/buttons/student_special.png">
</td>
<td colspan="1" bgcolor="#40b000">
<img src="images/buttons/student_special.png">
</td>
<td colspan="1" bgcolor="#ff00cc">
<img src="images/buttons/instruction.png">
</td>
<td colspan="1" bgcolor="#cc00cc">
<img src="images/buttons/learning_maple.png">
</td>
<td colspan="1" bgcolor="#4040ff">
<img src="images/buttons/download.png">
</td>
</tr>
</table>
You can see in this line <table align="center" cellpadding="0" cellspacing="15"> the spacing is 15, but when checking on any browser it shows as it set to 0
Any ideas how to solve it?
Thanks in advance,
Shahar
Ok, I guess I was too hasty.
It appears that the table used two definitions from boilerplate.css
table {
/* [disabled]border-collapse: collapse; */
/* [disabled]border-spacing: 0; */
}
As you can see, simply disabling them resolved the issue.
If there is any other option to override without disabling (maybe usage of !important) I'll be glad to know about it.

Resources