为 jasmine 中的可重用垫表列制作测试用例

如何解决为 jasmine 中的可重用垫表列制作测试用例

这是我的父母 TS

import { Component,Input,OnInit } from '@angular/core';
import { Column } from '../../../../shared/molecules/table/column';
import {
  DataRecord,TransitReport,} from '../../../organisms/transit-report-wrapper/transit-report.model';

@Component({
  selector: 'app-transit-report',templateUrl: './transit-report.component.html',styleUrls: ['./transit-report.component.scss'],})
export class TransitReportComponent implements OnInit {
  @input() dataSource!: TransitReport;
  @input()
  columns: Column[] = [
    {
      columnDef: 'overdueReviews',header: 'Overdue Reviews',cell: (element: DataRecord): string =>
        `${element.overdueReviews} clients`,},{
      columnDef: 'outstandingCovenantBreaches',header: 'Outstanding Covenant Breaches',cell: (element: DataRecord): string =>
        `${element.outstandingCovenantBreaches} clients`,{
      columnDef: 'outstandingMarginingBreaches',header: 'Outstanding Margining Breaches',cell: (element: DataRecord): string =>
        `${element.outstandingMarginingBreaches} clients`,{
      columnDef: 'periodStartDate',header: 'Period Start Date',cell: (element: DataRecord): string => `${element.periodStartDate}`,{
      columnDef: 'periodEndDate',header: 'Period End Date',cell: (element: DataRecord): string => `${element.periodEndDate}`,];
  convertedArray: Array<DataRecord> = [];

  ngOnInit(): void {
    // this.convertedArray.push(this.dataSource.data);
  }
}

这是 HTML 模板

 <section class="transitReport">
<app-table [dataSource]="convertedArray" [tableColumns]="columns" class="transitReportTable"></app-table>
</section>

在伊斯坦布尔，测试用例覆盖率应该覆盖红色块。

这是规范

import { HttpClientTestingModule } from '@angular/common/http/testing';
import { ComponentFixture,Testbed } from '@angular/core/testing';
import { MockComponent } from 'ng2-mock-component';

import { TransitReportComponent } from './transit-report.component';

describe('TransitReportComponent',() => {
  let component: TransitReportComponent;
  let fixture: ComponentFixture<TransitReportComponent>;

  beforeEach(async () => {
    await Testbed.configureTestingModule({
      imports: [HttpClientTestingModule],declarations: [
        TransitReportComponent,MockComponent({
          selector: 'app-table',inputs: ['dataSource','tableColumns'],}),],}).compileComponents();
  });

  beforeEach(() => {
    fixture = Testbed.createComponent(TransitReportComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create',() => {
    expect(component).toBeTruthy();
  });
});

我不知道如何覆盖父测试用例中的“单元格”函数和“元素”模板语句。在显示这些统计数据之前： 44.44% 声明 4/9 100% 分支 0/0 16.67% 功能 1/6 37.5% 行 3/8 我想通过编写测试用例使它们全部达到 100 个。

解决方法

您可以执行以下操作，我使用了虚拟数据。我已经遍历了数组的所有项目，如果需要，您可以使用循环。所以基本上我们正在使用模拟数据传递测试 cell() 以返回所需的字符串。

    it('should test all cells of column',() => {
    const element = {
      overdueReviews: 'overdueReviews',outstandingCovenantBreaches: 'outstandingCovenantBreaches',outstandingMarginingBreaches: 'outstandingMarginingBreaches',periodStartDate: 'periodStartDate',periodEndDate:'periodEndDate'
    };
    expect(component.columns[0].cell(element)).toBe('overdueReviews clients');
    expect(component.columns[1].cell(element)).toBe('outstandingCovenantBreaches clients');
    expect(component.columns[2].cell(element)).toBe('outstandingMarginingBreaches clients');
    expect(component.columns[3].cell(element)).toBe('periodStartDate');
    expect(component.columns[4].cell(element)).toBe('periodEndDate');

  });