Rico Strydom
Rico Strydom

Reputation: 549

Selenium Webdriver click specific WebElement

I have the following html and would like the td with class tree-label-name ng-binding and text() Approver to be selected (clicked)

HTML:

<?xml version="1.0" encoding="UTF-8"?>
<treecontrol tree-model="vm.homeStats" expand-level="0" on-selection="vm.selectStatsNode(node)" on-node-toggle="vm.toggleTreeNode(node, expanded)" expanded-nodes="vm.expandedNodes" selected-node="vm.selectedNode" class="ng-isolate-scope">
   <ul class="ng-scope">
      <li ng-repeat="node in node.children | filter:filterExpression:filterComparator" ng-class="headClass(node)" class="ng-scope tree-collapsed tree-selected">
         <i class="tree-branch-head" ng-class="iBranchClass()" ng-click="selectNodeHead(node)"></i><i class="tree-leaf-head "></i>
         <div class="tree-label  tree-selected" ng-class="selectedClass()" ng-click="selectNodeLabel(node)" tree-transclude="">
            <table class="ng-scope">
               <tbody>
                  <tr>
                     <td class="tree-label-icon"><img bf-image-path="user" class="tree-icon" src="/Assets/img/icons/user.png"></td>
                     <td class="tree-label-name ng-binding">
                        Strydom, AJ (Rico)<br>
                        <progress-bar ng-if="::!node.isFolder" value="6" max-value="230" class="ng-scope">
                           <div class="progress-bar" ng-style="barStyles">
                              <div class="progress-bar-value" ng-style="valueStyles" style="width: 2.6087%;"></div>
                           </div>
                        </progress-bar>
                     </td>
                     <td width="30" class="text-right">
                      <strong class="process-bar-total ng-binding ng-scope" ng-if="::!node.isFolder">6</strong><!-- end ngIf: ::!node.isFolder -->
                     </td>
                  </tr>
               </tbody>
            </table>
         </div>
      </li>
      <li ng-repeat="node in node.children | filter:filterExpression:filterComparator" ng-class="headClass(node)" class="ng-scope tree-collapsed">
         <i class="tree-branch-head" ng-class="iBranchClass()" ng-click="selectNodeHead(node)"></i><i class="tree-leaf-head "></i>
         <div class="tree-label " ng-class="selectedClass()" ng-click="selectNodeLabel(node)" tree-transclude="">
            <table class="ng-scope">
               <tbody>
                  <tr>
                     <td class="tree-label-icon"><img bf-image-path="team" class="tree-icon" src="/Assets/img/icons/team.png"></td>
                     <td class="tree-label-name ng-binding">
                        Approver<br>
                        <progress-bar ng-if="::!node.isFolder" value="1" max-value="230" class="ng-scope">
                           <div class="progress-bar" ng-style="barStyles">
                              <div class="progress-bar-value" ng-style="valueStyles" style="width: 0.434783%;"></div>
                           </div>
                        </progress-bar>
                     </td>
                     <td width="30" class="text-right">
                     <strong class="process-bar-total ng-binding ng-scope" ng-if="::!node.isFolder">1</strong><!-- end ngIf: ::!node.isFolder -->
                     </td>
                  </tr>
               </tbody>
            </table>
         </div>
      </li>
      <li ng-repeat="node in node.children | filter:filterExpression:filterComparator" ng-class="headClass(node)" class="ng-scope tree-collapsed">
         <i class="tree-branch-head" ng-class="iBranchClass()" ng-click="selectNodeHead(node)"></i><i class="tree-leaf-head "></i>
         <div class="tree-label " ng-class="selectedClass()" ng-click="selectNodeLabel(node)" tree-transclude="">
            <table class="ng-scope">
               <tbody>
                  <tr>
                     <td class="tree-label-icon"><img bf-image-path="team" class="tree-icon" src="/Assets/img/icons/team.png"></td>
                     <td class="tree-label-name ng-binding">
                        Assigner<br>
                        <progress-bar ng-if="::!node.isFolder" value="230" max-value="230" class="ng-scope">
                           <div class="progress-bar" ng-style="barStyles">
                              <div class="progress-bar-value" ng-style="valueStyles" style="width: 100%;"></div>
                           </div>
                        </progress-bar>
                     </td>
                     <td width="30" class="text-right">
                      <strong class="process-bar-total ng-binding ng-scope" ng-if="::!node.isFolder">230</strong><!-- end ngIf: ::!node.isFolder -->
                     </td>
                  </tr>
               </tbody>
            </table>
         </div>
      </li>
   </ul>
</treecontrol>

This is my code which does not seem to perform he click action.

WebElement inboxTypeToSelect =  webdriver.findElement(By.xpath("//treecontrol[@class='ng-isolate-scope']/ul/li/div/table/tbody/tr/td[@class='tree-label-name ng-binding' and normalize-space(text() = '" +  inboxType + "')]"));
Actions action = new Actions(webdriver);
action.click(inboxTypeToSelect);
action.perform();

The value passed to inboxType is Approver so the xpath is:

//treecontrol[@class='ng-isolate-scope']/ul/li/div/table/tbody/tr/td[@class='tree-label-name ng-binding' and normalize-space(text() = 'Approver')]

Any idea why the action is not performed?

Upvotes: 0

Views: 920

Answers (2)

Naveen Kumar R B
Naveen Kumar R B

Reputation: 6398

try the following xpath:

//tr/td[contains(text(),"Approver")]

try as follows:

 WebElement inboxTypeToSelect =  webdriver.findElement(By.xpath("//tr/td[contains(text(),"Approver")]"));
    Actions action = new Actions(webdriver);
    action.click(inboxTypeToSelect).perform();

call perform() after the click method.

instead of action chains use click on WebElement itself.

WebElement inboxTypeToSelect =  webdriver.findElement(By.xpath("//tr/td[contains(text(),"Approver")]"));
inboxTypeToSelect.click();

Upvotes: 1

0xh3xa
0xh3xa

Reputation: 4859

you can find the right td of Approver by xpath:

html/body/treecontrol/ul/li[2]/div/table/tbody/tr/td[2]

driver.findElement(By.xpath("html/body/treecontrol/ul/li[2]/div/table/tbody/tr/td[2]")).click();

Upvotes: 0

Related Questions