I have a web page with multiple tables , all the tables have TR with a similar TD
here is that button in an ObservationStation table
<input type="button" class="gwf-round-button" value="^" onclick="InsertRowBefore('ObservationStations', this, 'TextBox')" title="Add row before">
And here it is in a MeteorlogicalVariables table
<input type="button" class="gwf-round-button" value="^" onclick="InsertRowBefore('MeteorologicalVariables', this, 'TextBox')" title="Add row before">
What I want to do is select the first occurrence of the button in the MeteorlogicalVariables table and click it. The only identifier that differentiate the buttons in the each table is in the onclick , how would I access the very first button in the MeteorlogicalVariables table ?
here is what I have now:
edit_button = driver.find_element("xpath", '//button[text()="^" and @class="gwf-round-button"][1]')
edit_button.click()
here is what the MeteorologicalVariables table looks like (the highlighted button is what I want to click):
any help in getting this figured out is appreciated
here is the HTML for the specific table I want to click the first occurrence of ^ in
<table id="MeteorologicalVariables" class="gwf_variable_table">
<colgroup>
<col>
<col style="min-width:150px">
<col style="min-width:200px">
<col style="min-width:200px">
<col style="min-width:200px">
<col style="min-width:220px">
<col style="min-width:220px">
<col style="min-width:275px">
</colgroup>
<tbody>
<tr style="display: table-row;">
<td class="gwf_variable_table_control_column"></td>
<td style="max-width:150px" class="fmc-table-label-font fmc-tb-height">Variable</td>
<td style="max-width:200px" class="fmc-table-label-font fmc-tb-height">Station Name</td>
<td style="max-width:200px" class="fmc-table-label-font fmc-tb-height">Sensor(s)</td>
<td style="max-width:200px" class="fmc-table-label-font fmc-tb-height">Height / Depth (m)</td>
<td style="max-width:220px" class="fmc-table-label-font fmc-tb-height">Record Period</td>
<td style="max-width:220px" class="fmc-table-label-font fmc-tb-height">Measurement Frequency</td>
<td style="max-width:275px" class="fmc-table-label-font fmc-tb-height">Notes / Details</td>
</tr>
<tr>
<td class="gwf_variable_table_control_column">
<div class="gwf_tooltip"><input type="button" class="gwf-round-button" value="^" onclick="InsertRowBefore('MeteorologicalVariables', this, 'TextBox')" title="Add row before"></div>
<div class="gwf_tooltip"><input type="button" class="gwf-round-button" value="X" onclick="DeleteRow('MeteorologicalVariables', this)" title="Delete current row"></div>
<div class="gwf_tooltip"><input type="button" class="gwf-round-button" value="v" onclick="InsertRowAfter('MeteorologicalVariables', this, 'TextBox')" title="Add row after"></div>
</td>
<td><input type="text" class="fmc-tb-appearance fmc-tb-font fmc-tb-height" style="width:100%"></td>
<td><textarea class="fmc-tb-appearance fmc-tb-font" style="height:60px;min-width:200px;width:200px;max-width:200px;"></textarea></td>
<td><textarea class="fmc-tb-appearance fmc-tb-font" style="height:60px;min-width:200px;width:200px;max-width:200px;"></textarea></td>
<td><input type="text" class="fmc-tb-appearance fmc-tb-font fmc-tb-height" style="width:100%"></td>
<td><input type="text" class="fmc-tb-appearance fmc-tb-font fmc-tb-height" style="width:100%"></td>
<td><input type="text" class="fmc-tb-appearance fmc-tb-font fmc-tb-height" style="width:100%"></td>
<td><textarea class="fmc-tb-appearance fmc-tb-font" style="height:60px;min-width:275px;width:275px;max-width:275px;"></textarea></td>
</tr>
<tr>
<td class="gwf_variable_table_control_column">
<div class="gwf_tooltip"><input type="button" class="gwf-round-button" value="^" onclick="InsertRowBefore('MeteorologicalVariables', this, 'TextBox')" title="Add row before"></div>
<div class="gwf_tooltip"><input type="button" class="gwf-round-button" value="X" onclick="DeleteRow('MeteorologicalVariables', this)" title="Delete current row"></div>
<div class="gwf_tooltip"><input type="button" class="gwf-round-button" value="v" onclick="InsertRowAfter('MeteorologicalVariables', this, 'TextBox')" title="Add row after"></div>
</td>
<td><input type="text" class="fmc-tb-appearance fmc-tb-font fmc-tb-height" style="width:100%"></td>
<td><textarea class="fmc-tb-appearance fmc-tb-font" style="height:60px;min-width:200px;width:200px;max-width:200px;"></textarea></td>
<td><textarea class="fmc-tb-appearance fmc-tb-font" style="height:60px;min-width:200px;width:200px;max-width:200px;"></textarea></td>
<td><input type="text" class="fmc-tb-appearance fmc-tb-font fmc-tb-height" style="width:100%"></td>
<td><input type="text" class="fmc-tb-appearance fmc-tb-font fmc-tb-height" style="width:100%"></td>
<td><input type="text" class="fmc-tb-appearance fmc-tb-font fmc-tb-height" style="width:100%"></td>
<td><textarea class="fmc-tb-appearance fmc-tb-font" style="height:60px;min-width:275px;width:275px;max-width:275px;"></textarea></td>
</tr>
select the first occurrence of the button in the MeteorlogicalVariables table
There are various ways to do it, for eg.
Follow closely the structure of the HTML:
//table[@id="MeteorologicalVariables"]/tbody/tr[2]/td[1]/div[1]/input[1]
i.e. select the first input
in the first div
of the first td
of the second tr
of the MeteorlogicalVariables table
.
Generate a sequence that satisfies your constraints and take the first one out of it:
(//table[@id="MeteorologicalVariables"]//input[@value="^"])[1]
i.e. Select the first input
with a value of ^
in the MeteorlogicalVariables table