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>

Answer 1

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.

Answer 2

这对我有用

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