分度器を使用してuib-dropdownオプションを選択する

Question

DOMドロップダウンリストから特定のオプションを選択する際に問題が発生しましたが、uib-dropdown（https://angular-ui.github.io/bootstrap/#/dropdown）に対してテストしています。

<tr> 
 
<td> 
 
<div id="drpAccount"> 
 
    <div class="btn-group dropdown open" uib-dropdown=""> 
 
\t <button id="single-button" style="color:white;" type="button" class="btn btn-xs btn-link dropdown-toggle" uib-dropdown-toggle="" aria-haspopup="true" aria-expanded="true"> 
 
\t  Account : <b class="ng-binding">Assets</b> <span class="caret"></span> 
 
\t  
 
\t </button> 
 
\t <ul class="dropdown-menu accounts-dropdown" uib-dropdown-menu="" aria-labelledby="simple-dropdown"> 
 
\t  <li ng-repeat="accountChoice in ctrl.accountOptions" class="ng-scope"> 
 
\t \t <a ng-click="ctrl.selectOption(accountChoice)" style="font-family:Arial;" class="ng-binding">Assets</a> 
 
\t  </li><li ng-repeat="accountChoice in ctrl.accountOptions" class="ng-scope"> 
 
\t \t <a ng-click="ctrl.selectOption(accountChoice)" style="font-family:Arial;" class="ng-binding">Equity</a> 
 
\t  </li><li ng-repeat="accountChoice in ctrl.accountOptions" class="ng-scope"> 
 
\t \t <a ng-click="ctrl.selectOption(accountChoice)" style="font-family:Arial;" class="ng-binding">Liabilities</a> 
 
\t  </li> 
 
\t </ul> 
 
    </div> 
 
</div> 
 
</td> 
 
</tr>

と、この元のプロジェクトのマークアップ：

<td> 
 
<div id="drpOrg" style="height:18px;z-index:9999;"> 
 
    <div class="btn-group" uib-dropdown style="left:2px;top:2px;"> 
 
\t <button id="single-button" type="button" class="btn btn-xs btn-link" uib-dropdown-toggle> 
 
\t  Organization : <b>{{ctrl.selectedRoot.DESCRIPTION}}</b> <span class="caret"></span> 
 
\t </button> 
 
\t <ul class="dropdown-menu org-dropdown" uib-dropdown-menu aria-labelledby="simple-dropdown"> 
 
\t  <li ng-repeat="rootChoice in ctrl.rootOptions"> 
 
\t \t <a ng-click="ctrl.moreFuncs(rootChoice)">{{rootChoice.DESCRIPTION}}</a> 
 
\t  </li> 
 
\t </ul> 
 
    </div> 
 
</div> 
 
</td>

は、このレンダリングされたHTMLスニペットを取ると、例えば、私はAssetsドロップダウンオプションを選択します

私はProtractor E2Eテストフレームワーク使用して、このJavaScriptコードを持っている：

this.selectBalSheetDropdown = function (searchObj, drpIndex) { 
 

 
     var elem = element(by.id('drpAccount')); 
 
     var elementSwitcher = elem.element(by.css("div[uib-dropdown]"));   
 
     elementSwitcher.element(by.css("button[uib-dropdown-toggle]")).click(); // OPENS DROPDOWN FINE ! 
 
     
 
     // ***** HOW TO GET DROPDOWN VALUE FOR "Assets" option, as an example ?? 
 
     //elementSwitcher.element(by.css("a[value=Assets]")).click(); 
 
    };

特定のドロップダウンオプションを選択する上の任意のアドバイスは歓迎です。

に関して、 ボブ

Answer 1

私はちょうどby.linkText()を使用して、この解決策を見つけたが、私は他の方法に開いている：

this.selectBalSheetDropdown = function (searchObj, drpIndex) { 

    var elem = element(by.id('drpAccount')); 
    var elementSwitcher = elem.element(by.css("div[uib-dropdown]"));   
    elementSwitcher.element(by.css("button[uib-dropdown-toggle]")).click(); 

    // *** using by.linkText() works as well *** 
    elementSwitcher.element(by.linkText('Liabilities and Equity')).click(); 

};