Question

我的申请中有一个材料选项卡。我正在尝试自动化测试用例使用nightwatch.js。但是我无法点击我的下一个标签使用nightwatch.js的应用程序。我需要切换到下一个标签。任何帮助是晋升我的材料标签如下：

<mat-tab-group
  id="detailsTab"
  [selectedIndex]="tabIndex"
  (selectedTabChange)="tabSelectionChange($event.index)"
>
  <mat-tab id="sample" [label]="card">
    <app-details *ngIf="tabIndex === 0"></app-details>
  </mat-tab>
  <mat-tab [label]="Report">
    <app-report *ngIf="tabIndex === 1"></app-report>
  </mat-tab>
  <mat-tab [label]="perf">
    <app-perf *ngIf="tabIndex === 2"></app-perf>
  </mat-tab>
</mat-tab-group>

Nightwatch代码如下：

.waitForElementVisible('#detailsTab > .mat-tab-group:nth-child(1)',6000) 
.click('#detailsTab >.mat-tab-group:nth-child(1)')

Answer 1

您的选择器似乎错误。您是否已在浏览器控制台中对其进行了检查，以确认是否使用$（'＃detailsTab> .mat-tab-group：nth-child（1）'）找到了该元素？

在这里只是一个猜测，但这似乎可行：

.waitForElementVisible('mat-tab#sample',6000) 
.click('mat-tab#sample')

Answer 2

这对我有用：

browser.waitForElementVisible('#detailsTab .mat-tab-label:nth-child(2)',6000) 
       .click('#detailsTab .mat-tab-label:nth-child(2)')

...，其中mat-tab-group的ID为#detailsTab。 HTML结构看起来像一个<div>，类名为mat-tab-labels，具有三个子类<div>，其类名为mat-tab-labels，看起来像标签的标题。

所以我最终要做的是选择方面nth-child的{{1}}元素。

使用Nightwatchjs无法单击materail选项卡的下一个选项卡

2 个答案: