I have a button on a page which I need to write a locator for - so far have been unsuccessful so would appreciate some help here :
<div class="border" style="border-radius: 10px 10px 10px 10px;">
<div>
<span id="btnAddClient" class="buttons">
<div id="clientContainer">
<div id="ClientAccordian_204" class="accordion ui-accordion ui-widget ui-helper-reset ui-accordion-icons" role="tablist">
<h3 id="H3Client_204" class="ui-accordion-header ui-helper-reset ui-state-active ui-corner-top" role="tab" aria-expanded="true" tabindex="0">
<div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" role="tabpanel" style="">
<span id="btnAddYear" class="buttons">
<button onclick="javascript:ShowHideAddYear(204,0);" style="float: right; background-color: rgb(238, 238, 238);">
<button id="btnEditClient_204" title="Edit" style="float:right;">
<br>
</span>
<div id="yearsContainer_204">
</div>
</div>
<div id="ClientAccordian_210" class="accordion ui-accordion ui-widget ui-helper-reset ui-accordion-icons" role="tablist">
<h3 id="H3Client_210" class="ui-accordion-header ui-helper-reset ui-state-active ui-corner-top" role="tab" aria-expanded="true" tabindex="0">
<div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" role="tabpanel" style="">
<span id="btnAddYear" class="buttons">
<button onclick="javascript:ShowHideAddYear(210,0);" style="float: right; background-color: rgb(238, 238, 238);">
<button id="btnEditClient_210" title="Edit" style="float:right;">
<br>
</span>
<div id="yearsContainer_210">
</div>
</div>
<div id="ClientAccordian_209" class="accordion ui-accordion ui-widget ui-helper-reset ui-accordion-icons" role="tablist">
<div id="ClientAccordian_211" class="accordion ui-accordion ui-widget ui-helper-reset ui-accordion-icons" role="tablist">
<div id="ClientAccordian_215" class="accordion ui-accordion ui-widget ui-helper-reset ui-accordion-icons" role="tablist">
<h3 id="H3Client_215" class="ui-accordion-header ui-helper-reset ui-state-active ui-corner-top" role="tab" aria-expanded="true" tabindex="0">
<div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" role="tabpanel" style="">
<span id="btnAddYear" class="buttons">
<button onclick="javascript:ShowHideAddYear(215,0);" style="float: right; background-color: rgb(238, 238, 238);">
<button id="btnEditClient_215" title="Edit" style="float:right;">
<br>
</span>
<div id="yearsContainer_215"></div>
</div>
</div>
</div>
</div>
On this page 3 of these button appear but there could be more <button onclick="javascript:ShowHideAddYear(i,j)..>
Common locators like css=#btnAddYear > button
or //span[@id=’btnAddYear’]/button[text()=’Add Year’]
do not work. Can someone help writing a reliable locator that selects the button uniquely ?