How to select a value from an angular dropdown in C# with selenium

Question

I'm trying to click a value from an angular dropdown. When I click on the dropdown arrow, an option becomes available to 'Make Primary Contact' which I want to click using Selenium WebDriver and C#

I have tried the following

.SendKeys(Keys.ArrowDown)

Also I tried locating the element by XPath but as it is dynamic, this isn't working either.

Here is the HTML

<section>
<div class="entry-box">
    <input class="inv-input" [ngModel]="value?.ItemValue" (ngModelChange)="updatePhoneNumber($event)"/>

     <div class="caret-container" (click)="toggleDropDown()">
        <span *ngIf="value?.IsPrimary">{{'contactDetailsTab.selectedPrimaryLabel' | translate}}</span>
        <img class="select-icon" src="/assets/app/caret-dark.svg">
    </div> 
</div>
<ng-container *ngIf="showDropDown">
    <div  class="dropdown-container">
        <ul #dropDown tabIndex="-1" class="dropdown" (blur)="onBlur()">
            <li *ngIf="!value?.IsPrimary" (mousedown)="setPrimary(true)">{{'contactDetailsTab.makePrimaryContact' | translate}}</li>
            <li *ngIf="value?.IsPrimary" (mousedown)="setPrimary(false)">{{'contactDetailsTab.removePrimaryContact' | translate}}</li>
        </ul>
    </div>
</ng-container>
</section>

Since it's custom dropdown can you provide code that handles usage of arrow keys? — Buczkowski
– Buczkowski, Commented Jun 3, 2019 at 10:03
Possibly by using a css selector? . dropdown option:first-child — dmoo
– dmoo, Commented Jun 3, 2019 at 10:09

Gsanez · Accepted Answer · 2019-06-14 11:40:43Z

2

I use the SelectElement function of Selenium:

new SelectElement(driver.FindElement(By.Xpath("your Xpath here"))).SelectByText("Make Primary Contact");

Here you have more info about SelectElement

Is the best way to deal with dropdowns and check the values inside. You also can SelectByIndex or whatever is more suitable for you.

answered Jun 14, 2019 at 11:40

Gsanez

616 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

RShome · Accepted Answer · 2019-06-03 11:12:37Z

0

This worked for me

driver.FindElement(By.XPath("//li[contains(., 'Make Primary Contact')]"));

answered Jun 3, 2019 at 11:12

RShome

5474 gold badges16 silver badges41 bronze badges

Collectives™ on Stack Overflow

How to select a value from an angular dropdown in C# with selenium

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related