Покрытие кода для стрелочных функций внутри объекта в Karma

Я пишу модульный тест для одного из моих приложений, в котором передаются спецификации. Но после просмотра покрытия кода некоторые части кажутся не покрытыми, как показано ниже:

this.columnDefs = [
      {
        translateKey: 'DEVICES.LIST.SNO',
        width: 100,
        resizable: false,
        sortable: false,
        suppressSizeToFit: true,
        floatingFilter: false,
        valueGetter: (args) => this.getId(args),
        checkboxSelection: (params) => {
          return params.columnApi.getRowGroupColumns().length === 0;
        },
        headerCheckboxSelection: (params) => {
          return params.columnApi.getRowGroupColumns().length === 0;
        },
      },
      ...gridColumns,
    ];

В котором не рассматриваются valueGetter, CheckboxSelection

Файл компонента:

export class ListComponent implements OnInit, OnDestroy {
  columnDefs: DeviceColumns[];
  defaultColumnDefs: any;
  gridApi: any;
  columnApi: any;

  constructor() {}

  ngOnInit() {
    this.initializeColumns();
  }

  initializeColumns() {
    this.columnDefs = [
      {
        translateKey: 'DEVICES.LIST.SNO',
        width: 100,
        resizable: false,
        sortable: false,
        suppressSizeToFit: true,
        floatingFilter: false,
        valueGetter: (args) => this.getId(args),
        checkboxSelection: (params) => {
          return params.columnApi.getRowGroupColumns().length === 0;
        },
        headerCheckboxSelection: (params) => {
          return params.columnApi.getRowGroupColumns().length === 0;
        },
      },
    ];
    this.columnDefs.forEach((columnDef) => {
      columnDef.floatingFilter = this.hasFloatingFilter;
    });
    this.columnDefs = map(this.columnDefs, (columnDef) => {
      return extend({}, columnDef, { headerValueGetter: this.localizeHeader.bind(this) });
    });
  }

  getId(args: any): any {
    return (
      this.pagination.per_page * this.pagination.prev_page + parseInt(args.node.rowIndex, 10) + 1
    );
  }

  OnGridReady(params) {
    this.gridApi = params.api;
    this.columnApi = params.columnApi;
  }

  ngOnDestroy() {
    this.subscriptions.unsubscribe();
  }
}

Мне нужна помощь в выполнении покрытия кода для этих стрелочных функций.

Покажите код класса, columnDefs это свойство сервиса или компонента?

Lin Du 24.12.2020 13:59

@slideshowp2 я добавил компонент, пожалуйста, проверьте его

Nidhin Kumar 24.12.2020 14:03

Слишком много кода, можете ли вы создать минимальный воспроизводимый код? Сосредоточьтесь на тестировании функций стрелок внутри columnDefs.

Lin Du 24.12.2020 14:05

@slideshowp2, пожалуйста, проверьте, обновлен ли файл компонента.

Nidhin Kumar 24.12.2020 14:09
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
1
4
738
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы можете получить valueGetter, checkboxSelection и headerCheckboxSelection из свойства columnDefs компонента. Затем протестируйте их, как обычно.

Например. используя angular v11+

list.component.ts:

import { OnInit, Component } from '@angular/core';

type DeviceColumns = any;

@Component({
  selector: 'app-list',
  template: 'list component',
})
export class ListComponent implements OnInit {
  columnDefs: DeviceColumns[];
  pagination = {
    per_page: 10,
    prev_page: 1,
  };
  defaultColumnDefs: any;
  gridApi: any;
  columnApi: any;

  constructor() {}

  ngOnInit() {
    this.initializeColumns();
  }

  initializeColumns() {
    this.columnDefs = [
      {
        translateKey: 'DEVICES.LIST.SNO',
        width: 100,
        resizable: false,
        sortable: false,
        suppressSizeToFit: true,
        floatingFilter: false,
        valueGetter: (args) => this.getId(args),
        checkboxSelection: (params) => {
          return params.columnApi.getRowGroupColumns().length === 0;
        },
        headerCheckboxSelection: (params) => {
          return params.columnApi.getRowGroupColumns().length === 0;
        },
      },
    ];
  }
  getId(args: any): any {
    console.info(this, args);
    return (
      this.pagination.per_page * this.pagination.prev_page +
      parseInt(args.node.rowIndex, 10) +
      1
    );
  }
}

list.component.spec.ts:

import { ListComponent } from './list.component';
import { TestBed, waitForAsync, ComponentFixture } from '@angular/core/testing';

fdescribe('65438592', () => {
  let fixture: ComponentFixture<ListComponent>;
  let component: ListComponent;
  beforeEach(
    waitForAsync(() => {
      TestBed.configureTestingModule({
        declarations: [ListComponent],
      })
        .compileComponents()
        .then(() => {
          fixture = TestBed.createComponent(ListComponent);
          component = fixture.componentInstance;
        });
    })
  );

  it('should checkbox selection', () => {
    fixture.detectChanges();
    const { checkboxSelection } = component.columnDefs[0];
    const columnApiSpy = jasmine.createSpyObj('columnApi', [
      'getRowGroupColumns',
    ]);
    columnApiSpy.getRowGroupColumns.and.returnValue([]);
    const actual = checkboxSelection({ columnApi: columnApiSpy });
    expect(actual).toBeTruthy();
  });

  it('should handle checkbox selection', () => {
    fixture.detectChanges();
    const { headerCheckboxSelection } = component.columnDefs[0];
    const columnApiSpy = jasmine.createSpyObj('columnApi', [
      'getRowGroupColumns',
    ]);
    columnApiSpy.getRowGroupColumns.and.returnValue([]);
    const actual = headerCheckboxSelection({ columnApi: columnApiSpy });
    expect(actual).toBeTruthy();
  });

  it('should get value', () => {
    fixture.detectChanges();
    const { valueGetter } = component.columnDefs[0];
    const getIdSpy = spyOn(component, 'getId').and.returnValue(10);
    const actual = valueGetter({ node: { rowIndex: '0' } });
    expect(actual).toEqual(10);
    expect(getIdSpy).toHaveBeenCalled();
  });
});

результат модульного теста:

Другие вопросы по теме