量角器 - 单击表格中的按钮

时间:2015-07-09 17:17:07

标签: javascript angularjs protractor angularjs-e2e

如下面的HTML代码中所列,每个测试站点旁边都有一个包含测试站点链接列表和删除按钮的表。

 /* element locators in table */
var testSiteLinks = element.all(by.css('a[ui-sref^="testpages"]'));
var deleteBtnCssStart = "body > div.container > div > div > div > div > div > div:nth-child(2) > table > tbody > tr:nth-child(";
var deteletBtnCssEnd  = ") > td > button";

var testSite = {
deleteSite: function(siteName){
        
        testSiteLinks.each(function(element,index){
                
              
              var temp = index;
              element.getText().then(function(text) {

                  
                 temp++;
                 var patt = new RegExp(siteName);
                 if(patt.test(text)){
                   
                    //css locator for delete button, corresponding to test site
                    var test = deleteBtnCssStart + temp + deteletBtnCssEnd;
                   
                    element(by.css(test)).click();  //this step failing stating, not a function.
                 } 

 


            });   
 }); 
}

我正在尝试添加如上所示的函数,以在表中搜索testsite并删除该表中可用的站点。但是在尝试单击“删除”按钮时测试失败,说明“TypeError:object不是函数”。如果需要任何更正,请你告诉我。

请在下面找到表格的HTML代码以及测试网站链接。

<table class="table card">
    <thead></thead>
          <tbody>
          <!-- ngRepeat: site in Sites --><tr ng-repeat="site in Sites" class="ng-scope">
            <td>
              <button ng-hide="role.DeletingSite===true" ng-click="role.DeletingSite=true" class="delSite pull-right btn btn-sm btn-danger" tabindex="0" aria-hidden="false">Delete</button>

              <div ng-show="role.DeletingSite===true" class="pull-right ng-hide" aria-hidden="true">
               <a ng-click="role.DeletingSite=false" class="btn btn-sm btn-default pull-right" tabindex="0">Cancel</a>
               <a ng-click="deleteSite(site)" class="reallyDelete btn btn-sm btn-danger pull-right " tabindex="0">Delete</a>
              </div>

             <a ui-sref="testpages({id:site.id, name:site.name, host:site.host, httpsSupported:site.httpsSupported})" class="ng-binding" href="#/testsite/pages/40288a884cdaa49a014cdbfb08270003/testsite/testsite/true   ">testsite (testsite)</a>
                        </td>
                    </tr><!-- end ngRepeat: site in Sites --><tr ng-repeat="site in Sites" class="ng-scope">
                        <td>
                            <button ng-hide="role.DeletingSite===true" ng-click="role.DeletingSite=true" class="delSite pull-right btn btn-sm btn-danger" tabindex="0" aria-hidden="false">Delete</button>

                            <div ng-show="role.DeletingSite===true" class="pull-right ng-hide" aria-hidden="true">
                                <a ng-click="role.DeletingSite=false" class="btn btn-sm btn-default pull-right" tabindex="0">Cancel</a>
                                <a ng-click="deleteSite(site)" class="reallyDelete btn btn-sm btn-danger pull-right " tabindex="0">Delete</a>
                            </div>

                            <a ui-sref="testsitepages({id:site.id, name:site.name, host:site.host, httpsSupported:site.httpsSupported})" class="ng-binding" href="#/test/pages/40288a884cd57e14014cd60701890001/TestSite.org/testsite.org/false   ">Testsite.org (testsite.org)</a>
                        </td>
                    </tr><!-- end ngRepeat: site in Sites -->
                </tbody>
            </table>

1 个答案:

答案 0 :(得分:2)

首先,element(by.css(test))调用将使用来自element回调的内部范围中的each()变量。

相反,我会使用filter()evaluate()来接近它:

element.all(by.repeater("site in Sites")).filter(function (site) {
    return site.evaluate("site.name").then(function (name) {
        return name == siteName;
    });
}).then(function (sites) {
    if (sites) {  // we have a match - find and click the Delete button
        sites[0].element(by.linkText("Delete")).click();
    }
});

这里的想法是迭代转发器中的所有站点,评估site.name并检查它是否是所需的站点。如果是,请单击转发器块内的Delete按钮。