For example, I have a table like this:
<tbody>
<tr>aaaa</tr>
<tr>bbbb</tr>
<tr>cccc</tr>
</tbody>
Now, I want to find the index of the <tr> which contains the text "bbbb". I already get the <tr> element by searching the text. Now I want to know if it is possible to get the index of the <tr> (which is 1). Thanks.
You could do something like this:
List<WebElement> trElements = driver.findElements(By.cssSelector("tbody>tr"));
int trIndex = trElements.indexOf("bbbb");
Related
I want to use hx-swap-oob to replace a table row of the existing page "out of band".
in browser:
<table>
<tr id="offer_1">....</tr>
<tr id="offer_2">....</tr> (old)
<tr id="offer_3">....</tr>
</table>
From Server to client:
<table hx-swap-oob="outerHTML:#offer_2" hx-select="#offer_2">
<tr id="offer_2"> .... </tr> (new)
</table>
But up to now this is the result:
<table>
<tr id="offer_1">....</tr>
<table hx-swap-oob="outerHTML:#offer_2" hx-select="#offer_2">
<tr id="offer_2"> .... </tr> (new)
</table>
<tr id="offer_3">....</tr>
</table>
I guess hx-select does not get evaluated when htmx get this snippet from the server.
How can I swap a row out-of-band?
Take a look at the new extension multi-swap.
https://htmx.org/extensions/multi-swap/
It allows swapping multiple elements marked with the id attribute.
For each element it is possible to choose which swap method should be used.
This does work:
<tr hx-swap-oob="true" id="offer_2"> .... </tr> (new)
But it has a drawback:
You need to modify the method which creates this row. Depending on your context, you might already have a method for this. Why modify this method, just because the result of this method should get used out-of-band?
If you use Django, this snippet could get used to add the hx-swap-oob attribute after the HTML got created:
def add_oob_attribute(html):
"""
I would like to avoid this ugly hack
https://github.com/bigskysoftware/htmx/issues/423
"""
assert isinstance(html, SafeString)
new, count = re.subn(r'(<\S+)', r'\1 hx-swap-oob="true"', html, count=1)
if not count == 1:
raise ValueError(f'Could not add hx-swap-oob: {html}')
return mark_safe(new)
I created an issue to find a better solution in the future:
https://github.com/bigskysoftware/htmx/issues/423
I have an issue with selecting a table to be read in Selenium.
I have a table in which there is two 'tr' elements inside the 'thead', and I need to find a way to ignore the first of these.
Here is the code:
<table class="noselect">
<thead>
<tr>
<th> </th>
<th class="number IOL">Interest Rates</th>
<th class="number IO">
</tr>
<tr>
<th>Description</th>
<th class="number">Value</th>
<th class="number">Percentage</th>
</tr>
</thead>
<tbody>
<tr>
<tr class="">
<tr class="">
<tr class="">
<tr>
<tr>
</tbody>
</table>
Using Selenium I will ask it to record the value of a certain row and column . This will then look at the Table element I will give it (hopefully using an XPath I can get working in this case), look at the thead and record the headers of each column. In this case that I am struggling with, the fact there is an extra 'tr' at the top of this table gets in the way of this process.
This is how the element is currently used:
[TableAlias("Detailed table")]
protected virtual IWebElement DetailedTable()
{
return Driver.FindElement(By.XPath("//table[#class='noselect']"));
}
I have tried many different ways which I can't get to work, but the gist of what I've been going for is:
//table[#class='noselect movements']/thead/tr/th[not(text()='Interest Rates')]/../../..
Here I'm stuck on going to the 'tr' element, telling it not to use it then backing out, but that selects it back again - and even that doesn't unselect the whole 'tr' element. It doesn't seem to help (to me) that the 'tr' element I'm trying to remove is blank with no class or defining features.
Is there a way of selecting the entire table except for the first 'tr' element in 'thead' as one element?
combine two xpathes. The 1st xpath take thead without the 1st tr and the 2nd tbody
//table/thead/tr[not(position()=1)] | //table/tbody
In your function that processes the THEAD tag, get the collection of TRs and start with [1] (skipping [0]) and process the rest.
I am hoping I can get some help, I need to know how to accomplish something but not sure how as I am new to selenium commands.
I tried the following:
storeEval
javascript{window.document.getElementById('myDiv');}
myResult
then
gotoIf
${myResult} == false
lblWhereToGoIfStyleDisplayIsNotVisible
This does not give me what I want as I always have the div in my page, even if the style = display : none.
What I need is to get the display property of the style of the div and check that value to see if none to then jump to the lblWhereToGoIfStyleDisplayIsNotVisible label
I was thinking I need to use storeAttribute or storeElementPresent but not sure how to implement properly to get result needed.
Any help is appreciated, thanks in advance.
I finally got my script working on my own as I was getting no quick responses, I tried many other type of searches about the gotoIf, css attributes, etc... and found one link at
http://sysmagazine.com/posts/190358/
which helped alot...
here is the final code if someone is interested in knowing how to get a div, display property value, store it, compare it to == NONE (if div is hidden) and go to the next label (test location in the script) in order to continue testing (setting dropdown values)....
this allows me to set values only if the div exists and is visible meaning the dropdown will have selections
This allowed me also to define 1 script for multiple possible test cases, just by changing the url based on the test I want to have.
Cheers!
<tr>
<td>pause</td>
<td>2000</td>
<td></td>
</tr>
<tr>
<td>storeEval</td>
<td>window.getComputedStyle(window.document.getElementById('trProtection'),null).getPropertyValue('display');</td>
<td>myResult</td>
</tr>
<tr>
<td>echo</td>
<td>javascript{storedVars['myResult'];}</td>
<td></td>
</tr>
<tr>
<td>gotoIf</td>
<td>storedVars['myResult'] == "none"</td>
<td>lblDivision</td>
</tr>
<tr>
<td>select</td>
<td>id=selProtection</td>
<td>label=DISABILITY</td>
</tr>
<tr>
<td>label</td>
<td>lblDivision</td>
<td></td>
</tr>
<tr>
<td>pause</td>
<td>2000</td>
<td></td>
</tr>
I'm writing test cases for a webpage that has a table as the main focus of the page. I'm checking that the page contains a new entry via the Page Should Contain fucntion, I then want to find the xpath for this element. I am doing this because each entry is added to the end of the table so I cannot set a static xpath for it because I don't know how many entries will be added between each run of this particular test.
Thanks in advance.
<table class="fw-table">
<thead>
<tr class="affix-header">
<th class="columnwidth-description">Email</th>
<th>Account</th>
<th>Signed up</th>
<th>Number of invalid attempts</th>
</tr>
</thead>
<tbody>
<tr>
<td>devtest</td>
<td>Account</td>
<td>true</td>
<td>0</td>
</tr>
<tr>
<td>test#testing.com</td>
<td>Account</td>
<td>true</td>
<td>1</td>
</tr>
search for: xpath=//body/div[2]/div/div[2]/div[2]/div/div/table/tbody/tr[1]/td[1]
If you need to verify that last table row contains certain text you can use the Page Should Contain Element keyword and provide an xpath locator which will find the last table row containing your text:
Page Should Contain Element xpath=//table[#class="fw-table"]//tr[last()]//td[contains(text(),'bottomline')]
is there a way to add cells in a row column in html table without adding another table inside the row column
I have attached the image. and here is my code
<tr>
<tbody>
<td>Name</td>
<td><div id="span1">Units</div>
<div id="span2" class="side-border">price</div>
<div id="span2" class="r">value</div>
</td>
</tbody>
</tr>
If you want to have some different structure of your rows, you should check colspan and rowspan. The numbers should add up.
Example
<table border="1px">
<tr>
<td colspan="5">Hello</td>
<td>World</td>
</tr>
<tr>
<td rowspan="2">col 1</td>
<td colspan="4">CENTER</td>
<td>right</td>
</tr>
<tr>
<td colspan="3">Text</td>
<td colspan="3">bottom right</td>
</tr>
</table>
If you were to add the numbers from colspan they add to 6 and rowspan goes to 3. There are some things you have to take care of though. It's a little hard for me to explain now what those are, just try to visualise how you want your table to look, and then follow this:
The table should have the max number of rows
The table should have the max number of columns
rowspan used across table has to add up (more or less)
colspan used across table has to add up (more or less).
Follow that, and after writing the HTML for a few "complex" tables, you'll get the gist of it.