Question

我正在为角度应用程序运行单元测试。我想手动触发matSortChange事件，并确保在触发此事件时调用方法

<table matSort (matSortChange)="sortData(i, $event)" matSortActive="enddate" matSortDirection="asc" matSortDisableClear style="margin:0px;" class="table table-striped table-bordered">

<tr>
  <ng-container *ngFor="let subheader of subheaders; let j = index">
  <ng-container *ngIf="subheader[1] == 'activationid'; else second">
    <th class="headers" style="width:300px;" mat-sort-header=" 
     {{subheader[1]}}">{{subheader[0]}} </th>
</tr>

Answer 1

没有在单元测试中尝试过，但是单击排序箭头时会触发matSortChange。您可以像

一样从DOM访问箭头

document.getElementsByClassName('mat-sort-header-arrow')[indexOfTheColumn].click()

这应该触发matSortChange事件，并且不要忘记监视sortData方法来检查结果。

Answer 2

希望这有助于回答我的问题，这是生成的角度代码，我在inspect元素中看到了

<div class="container col-lg-12">
	<input type="number" #data> &nbsp; 
  <button (click)="start(data.value)">Start</button>
  <br><br>
  <ng-container >
  <table>
    <tr>
      <th>Input</th>
      <th>Second</th>
      <th>Multiplication</th>
    </tr>
    
<tr *ngFor="let item of printVal; let i = index"> 
 <td>{{printVal.length}}</td>
  <td>{{i}}</td>
   <td>{{item*i}}</td>
</tr>
  </table>
    </ng-container>
</div>

如何在Angle App中触发（matSortChange）=“ sortData（i，$ event）”进行单元测试

2 个答案: