1

i have been searching for 2 days but i couldnt come to a solution, i want a drop down to be selected. When i click on the drop down using some element.all css locator it clicks on the drop down(Drop down Opens up but error displayed). so i tried to use linkText to open up the drop down(Opens up perfectly). But after that i was not able to select the option in the drop down. (Element Not Visible displayed). also i was not able to select the option through the linkText. below r the details

<div class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-right" style="margin-right:0px">
 <li>
    <div uib-dropdown="" style="margin-right: 5px;" class="dropdown">
                                Tenant
    <a href="" id="simple-dropdown" uib-dropdown-toggle="" class="dropdown-toggle" aria-haspopup="true" aria-expanded="false">
    <span class="breadcrumb ng-binding" style="padding-bottom: 2px; padding-top: 2px;">cust1</span>
    </a>
      <ul class="uib-dropdown-menu dropdown-menu" role="menu" aria-labelledby="single-button">
    <!-- ngRepeat: tenant in tenantList --><li ng-repeat="tenant in tenantList" class="ng-scope">
    <a ng-click="selectTenant(0)" href="">
    <span ng-show="selectedTenant.Identity == tenant.Identity" class="glyphicon glyphicon-ok"></span>
    <span ng-show="selectedTenant.Identity != tenant.Identity" style="margin-left: 17px" class="ng-hide"></span>
    <span class="ng-binding">cust1</span>
    </a>
    </li><!-- end ngRepeat: tenant in tenantList --><li ng-repeat="tenant in tenantList" class="ng-scope">
    <a ng-click="selectTenant(1)" href="">
    <span ng-show="selectedTenant.Identity == tenant.Identity" class="glyphicon glyphicon-ok ng-hide"></span>
    <span ng-show="selectedTenant.Identity != tenant.Identity" style="margin-left: 17px" class=""></span>
    <span class="ng-binding">NewTenant1</span>
     </a>
    </li><!-- end ngRepeat: tenant in tenantList --><li ng-repeat="tenant in tenantList" class="ng-scope">
    <a ng-click="selectTenant(2)" href="">
    <span ng-show="selectedTenant.Identity == tenant.Identity" class="glyphicon glyphicon-ok ng-hide"></span>
    <span ng-show="selectedTenant.Identity != tenant.Identity" style="margin-left: 17px" class=""></span>
    <span class="ng-binding">cust2</span>
    </a>
    </li><!-- end ngRepeat: tenant in tenantList -->
    </ul>
    </div>

I tried to do through below ways to select but i cant make it work.

  1. wait for the element to become visible.
  2. LinkText
  3. Options to select. (via repeater name as the option) kindly help me out
Dina
  • 135
  • 1
  • 10
  • Even tried by finding sub elements. var el = element(by.binding('selectedTenant.ParentOwnerName')).element(by.css('a[ng-click="selectTenant(2)"]')); el.click(); – Dina Jan 21 '16 at 10:50
  • Did you try clicking on the `anchor` element instead of `list` element? Also you can pass alphabets if its not recognizing in any way using `sendKeys()` function. Thanks – giri-sh Jan 21 '16 at 10:50
  • i am just 2-3 months old to the protractor. correct me if iam wrong. Is this the Anchor element ur coming to tel by.css('[ng-click‌​="selectTenant(2)"]'). if yes then i tried this. yea i tried sendkeys too. i dono how to pass alphabets. pls explain more precisely – Dina Jan 21 '16 at 12:31
    • added 2 more lines. I guess we have to first switch it over to the div then we need to click on the drop down element to work. If my guess is correct can some 1 tell me how to do it.
     – Dina Jan 22 '16 at 12:23
  • Is your site on public domain and can we access it? I am not sure why you are not able to click on the dropdown, but there are so many answers in stackoverflow that show how to select a value from the dropdown. None of them worked? Here are few - http://stackoverflow.com/questions/19599450/how-to-select-option-in-drop-down-protractorjs-e2e-tests or http://stackoverflow.com/questions/22895281/angularjs-protractor-how-to-select-dropdown-option-based-on-its-text-not-value and lot more. Let me know if none of them worked. Thanks – giri-sh Jan 22 '16 at 15:28
  • No it is not in public domain. when i click using index. it displays click is not defined. but now it is working with partialLinkText. thnks – Dina Jan 27 '16 at 13:27

2 Answers2

1

element(by.partialLinkText('cust2')); i dono how come linktext is not working but partialLinkText is working. thanks for replies.

Dina
  • 135
  • 1
  • 10
-1

Would this suffice? I use this to identify dropdown elements which contain a specific label value...

this.clickDropChoice = function(dropdown, optionChoice) {
    dropdown.element(by.cssContainingText('option', optionChoice)).click()
};
Chris Stillwell
  • 10,266
  • 10
  • 67
  • 77
TesterPhi
  • 346
  • 1
  • 12
  • ReferenceError: attribute is not defined. wats use in adding attribute in front. do i need to do any more. Common.Tenant.click(); browser.sleep(4000); attribute.element(by.cssContainingText('div.dropdown', "cust2")).click(); browser.sleep(4000); – Dina Jan 21 '16 at 10:27
  • My appologies, it was from a helper file and I forgot to mention the parameters I use... Basically everywhere in my code I want to click on a dropdown I just call this helper file function :) Ive edited it to contain the appropriate parameters, and tried to label them a little more clearly :) – TesterPhi Jan 21 '16 at 11:14
  • hi @TesterPhi do i need to pass dropdown argument with elements??. r can u explain bit clear. sorry – Dina Jan 21 '16 at 12:39
  • dropdown is your dropdown menu identifier, optionChoice is what you would like to select. identifer for you would be the id of the dropdown: element(by.id('simple-dropdown')); optionchoice would be the text displayed within the option choice you would like to click – TesterPhi Jan 21 '16 at 14:54
  • im sorry again can u look at the below code. this is wat i have done but test getting passed but without selecting the drop down. 'var test = element(by.id('simple-dropdown')); this.clickDropChoice = function(test, cust2) { dropdown.element(by.cssContainingText('option', cust2)).click() };' @TesterPhi am i doing anything wrong. and FYI clickDropChoice is unused it seems. – Dina Jan 22 '16 at 06:21
  • What would be for option and optionchoice now i made this clickdropchoice to a new js file so that i wll cal this for drop down. dropdown.js ---- this.clickDropChoice = function(dropdown, value) { dropdown.element(by.cssContainingText('option', value)).click(); }; and i have called this function like drop.clickDropChoice(Common.Tenantdrop,"cust2"); ---- im getting error like NoSuchElementError: No element found using locator: by.cssContainingText("option", "cust2") – Dina Jan 22 '16 at 06:41
  • It looks like Common.Tenantdrop isnt on your page, what is Common.Tenantdrop? Technically if you pass in: `element(by.id('simple-dropdown'))` instead of common.tenantdrop it will target the drop down menu. and then the value (cust2) will target the field within that dropdown... the click will then select it – TesterPhi Jan 22 '16 at 08:36
  • Common.Tenantdrop is just the same. i have assigned it in Tenantdrop in common js page. it is displaying the following error. NoSuchElementError: No element found using locator: by.cssContainingText("option", "cust2") – Dina Jan 22 '16 at 08:42
    • added 2 more lines. I guess we have to first switch it over to the div then we need to click on the drop down element to work. If my guess is correct can some 1 tell me how to do it.
     – Dina Jan 22 '16 at 12:24