sonia sharma sonia sharma - 24 days ago 12
Javascript Question

How to click on drop down with on-toggle property

<div ng-if="domainList.length>1" class="form-group ng-scope">
<div class="col-sm-3">
<label translate="ZillaMain.Authentication" class="ng-scope">Authentication</label>
</div>
<div class="col-sm-9">
<label uib-dropdown="" keyboard-nav="true" on-toggle="toggled(open)" class="dropdown">
<a href="" tabindex="0" aria-label="" uib-dropdown-toggle="" class="dropdown-toggle" aria-haspopup="true" aria-expanded="false">
<!-- ngIf: authentication_domain -->
<!-- ngIf: !authentication_domain --><h3 ng-if="!authentication_domain" class="ng-scope">
<span translate="ZillaMain.Select" class="ng-scope">Select</span>
<i class="icon angle-down-icon"></i>
</h3><!-- end ngIf: !authentication_domain -->
</a>
------
------
------


With the above mentioned code I am trying to clcik on the dropdown:

this.AuthDD = element(by.css('[on-toggle="toggled(open)"]'));

AuthDD.click();


But this does not click on the drop down and My test does not fail also... I am not sure what is wrong with it.

I have also tried changing the locator by:
element(by.css('a.dropdown-toggle'));
or
element(by.css('[translate="ZillaMain.Select"]'));
but it does not clcik on the dropdown.

Is there any different way available in protractor to click on a dropdown ?

Answer

I got this working by making following changes:

 this.AuthDD = element(by.css('i.angle-down-icon'));

 AuthDD.click();