如何使用selenium webdriver找到mat-select

Posted 2021-04-29

我正在使用selenium web驱动程序来自动化一个有角度的网站。我无法使用select命令。因为显示为元素的错误应该是“选择”但是“mat-select”enter image description here

enter image description here

<div class="mat-input-infix mat-form-field-infix"> <mat-select _ngcontent-c2="" class="mat-select ng-tns-c6-1 ng-pristine ng-valid ng-touched" role="listbox" ng-reflect-is-disabled="false" ng-reflect-model="award" ng-reflect-disabled="false" id="mat-select-0" tabindex="0" aria-required="false" aria-disabled="false" aria-invalid="false" aria-owns="mat-option-1 mat-option-2" aria-multiselectable="false"><div class="mat-select-trigger" aria-hidden="true" cdk-overlay-origin=""><div class="mat-select-value"><!--bindings={
  "ng-reflect-ng-if": "false"
}--><!--bindings={
  "ng-reflect-ng-if": "true"
}--><span class="mat-select-value-text ng-tns-c6-1" ng-reflect-ng-switch="false"><!----><span class="ng-tns-c6-1">Award</span><!--bindings={
  "ng-reflect-ng-switch-case": "true"
}--></span></div><div class="mat-select-arrow-wrapper"><div class="mat-select-arrow"></div></div></div><!--bindings={
  "ng-reflect-_deprecated-origin": "[object Object]",
  "ng-reflect-_deprecated-positions": "[object Object],[object Object",
  "ng-reflect-_deprecated-offset-y": "-15",
  "ng-reflect-_deprecated-min-width": "206",
  "ng-reflect-_deprecated-backdrop-class": "cdk-overlay-transparent-backdr",
  "ng-reflect-_deprecated-scroll-strategy": "[object Object]",
  "ng-reflect-_deprecated-open": "false",
  "ng-reflect-_deprecated-has-backdrop": ""
}--></mat-select> <span class="mat-input-placeholder-wrapper mat-form-field-placeholder-wrapper"><!--bindings={
  "ng-reflect-ng-if": "false"
}--></span></div>
<span class="mat-option-text">Institute Proposal</span>

答案

由于它不包含<select>标签，您需要手动选择它。

您可以选择：

答：By.id("mat-select-0")

要么

Xpath：//mat-select[@ng-reflect-model="award"] OR //mat-select[@id="mat-select-0"]

对于你的情况：

。driver.findElement（By.id（ “垫选-0”））点击（）;

更新了最后3行：

//add click() method
driver.findElement(By.id("mat-select-0"));
//Remove below 2 lines
Select dropdown = new Select(link_to);
dropdown.selectByVisibleText("Awards") 

另一答案

我经历了同样的问题。请尝试以下代码段。

driver.findElement(By.id("mat-select-0")).click();
driver.findElement(By.xpath("//xpath to the awards text,'Awards')]")).click();

另一答案

我已经解决了这个问题：

在组件的html代码中，我已经动态地创建了每个元素的id：

<mat-select [(ngModel)]="idRoom" id="roomSelected" name="roomSelected">
  <mat-option [value]="null">-- Select a room --</mat-option>
  <mat-option *ngFor="let room of rooms; let i = index" [value]="room.id" [id]="'room' + i">
    {{room.identifier}} - {{room.type}}
  </mat-option>
</mat-select>

然后我在我的班级Selenium中创建了下一个方法：

private WebDriver driver;

public TestUtil(WebDriver driver) {
    this.driver = driver;
} 

public void matSelectInput(String id, String value) {
    driver.findElement(By.id(id)).click();
    driver.findElement(By.id(value)).click();
}

最后，为了进行测试，我添加了以下调用：

@Test
public void addOnSuccess() {
    ...
    testUtil.matSelectInput("roomSelected", "room0");
    ...
}