Question

DOM我正在针对uib-dropdown（https://angular-ui.github.io/bootstrap/#/dropdown）进行测试，但无法从下拉列表中选择特定选项。

以此呈现的HTML片段为例，我想选择Assets下拉选项：

<tr>
<td>
<div id="drpAccount">
    <div class="btn-group dropdown open" uib-dropdown="">
	<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">
	    Account : <b class="ng-binding">Assets</b> <span class="caret"></span>
	    
	</button>
	<ul class="dropdown-menu accounts-dropdown" uib-dropdown-menu="" aria-labelledby="simple-dropdown">
	    <li ng-repeat="accountChoice in ctrl.accountOptions" class="ng-scope">
		<a ng-click="ctrl.selectOption(accountChoice)" style="font-family:Arial;" class="ng-binding">Assets</a>
	    </li><li ng-repeat="accountChoice in ctrl.accountOptions" class="ng-scope">
		<a ng-click="ctrl.selectOption(accountChoice)" style="font-family:Arial;" class="ng-binding">Equity</a>
	    </li><li ng-repeat="accountChoice in ctrl.accountOptions" class="ng-scope">
		<a ng-click="ctrl.selectOption(accountChoice)" style="font-family:Arial;" class="ng-binding">Liabilities</a>
	    </li>
	</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;">
	<button id="single-button" type="button" class="btn btn-xs btn-link" uib-dropdown-toggle>
	    Organization : <b>{{ctrl.selectedRoot.DESCRIPTION}}</b> <span class="caret"></span>
	</button>
	<ul class="dropdown-menu org-dropdown" uib-dropdown-menu aria-labelledby="simple-dropdown">
	    <li ng-repeat="rootChoice in ctrl.rootOptions">
		<a ng-click="ctrl.moreFuncs(rootChoice)">{{rootChoice.DESCRIPTION}}</a>
	    </li>
	</ul>
    </div>
</div>
</td>

我有这个javascript代码，使用Protractor e2e测试框架：

 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();

};

使用Protractor选择uib-dropdown选项

1 个答案: