Блог

Я создал пользовательский элемент управления, который реализует ICellRendererAngularComp от AG-Grid с собой набор действий и вводят его в мой АГ-решетки основного компонента, но я не уверен, как я могу писать тесты для пользовательского элемента управления, как на поругание params у нас есть предопределенный класс или модуль, который должен быть импортирован

Ниже приведен мой блок кода

 import { Component } from '@angular/core';
import { ICellRendererAngularComp } from 'ag-grid-angular';

@Component({
  template: ` <button
    type="button"
    class="btn btn-primary btn-xs"
    title="Copy"
    (click)="triggerAction('copy')"
  >
    <i class="fa fa-copy"></i>
  </button>`
})

export class GridButtonsComponent
  implements ICellRendererAngularComp
{
  public params: any;

  agInit(params: any): void {
    this.params = params;
  }

  refresh(): boolean {
    return false;
  }

  public triggerAction(actionType: string) {
    this.params.data.actionType = actionType; // custom property added
    this.params.clicked(this.params.data);
  }
}
 

Ниже приведен тест, который я пробовал

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

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [GridButtonsComponent]
    }).compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(GridButtonsComponent);
    component = fixture.componentInstance;
    let params = {
      column: 'status',
      value: 'test-value',
      data: {
        actionType: ''
      }
    };
    component.agInit(params);
    fixture.detectChanges();
  });

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

  it('should return false for refresh', () => {
    expect(component.refresh()).toBe(false);
  });

  it('should actionType be as input passed', () => {
    component.triggerAction('edit');
    expect(component.params.data.actionType).toBe('edit');
  });
});
 

с последним тестом я не знаю, как издеваться this.params.clicked(this.params.data);

У вас может быть дополнительная функция макета для params .

 let params = {
  column: 'status',
  value: 'test-value',
  data: {
    actionType: ''
  },
  clicked: function () { }
};
 

А затем подтвердите, была ли clicked функция вызвана или нет таким образом. Само собой разумеется..

 it('should actionType be as input passed', () => {
  spyOn(params, 'clicked').and.callThrough();
  component.triggerAction('edit');
  expect(component.params.data.actionType).toBe('edit');
  expect(params.clicked).toHaveBeenCalledWith(params.data);
});