I have a component using ag-grid.
@Component({
selector: 'app-summary',
templateUrl: './summary.component.html',
styleUrls: ['./summary.component.scss']
})
export class SummaryComponent implements OnInit {
IsChecked: boolean = false;
rowData: Array<any>;
errorMessage: any = null;
summaryData: Array<Summary>;
defaultColWidth: number = 200;
numberColWidth: number = 120;
defaultColDef: any;
innerHeight: any;
private gridApi;
gridOptions: GridOptions;
pivotMode: boolean;
ngOnInit(): void {
this.pivotMode = false;
this.gridOptions = this.agGridServ.getDefaultGridOptions();
}
onGridReady(params) {
this.gridApi = params.api;
this.gridColumnApi = params.columnApi;
}
handleUserSelection(selection) {
..
..
this.getSummaryData(requestObject);
..
..
}
getSummaryData(selections: any): void {
this.summaryData = [];
this.errorMessage = null;
this.gridApi.setDomLayout('normal');
this.summaryService.getSummaryViewData(
selections
)
.subscribe (
.
.
)
}
}
When I run the test for this method, it fails.
describe('SummaryComponent', () => {
let spectator: Spectator<SummaryComponent>;
let selection: any = {
selectedDateFrom: {year: 2020, month: 5, day: 29},
selectedDateTo: {year: 2020, month: 6, day: 30},
}
const createComponent = createComponentFactory({
component: SummaryComponent,
declarations: [],
imports: [HttpClientTestingModule,
MatSnackBarModule,
RouterTestingModule,
AgGridModule.withComponents([])
],
providers: [
{ provide: MatDialog, useClass: MatDialogMock },
],
schemas: [NO_ERRORS_SCHEMA],
mocks: [BasicAuthService,
RefdataService,
SummaryDataService,
],
detectChanges: false
});
beforeEach(()=> {
spectator= createComponent();
});
it('should handle user selection', () => {
jest.spyOn(spectator.component.refData, 'getReferenceData').mockReturnValue(of(refDataSample));
spectator.detectChanges();
spectator.component.handleUserSelection(selection);
expect(spectator.component.handleUserSelection).toBeTruthy();
});
}
Below is the error when I run the test. I tried to use detect changes (assuming gridapi should initailize), but it doesn't help? Can we even skip this line in test? i.e. mock (only the gridapi line)?
TypeError: Cannot read property 'setDomLayout' of undefined
560 | this.expandedState = [];
> 561 | this.gridApi.setDomLayout('normal');
|
The gridAPi of the component (which is tested) is undefined. How can I fix this?
UPDATE:
Please note that I do not want to test ag grid api, my component (which I am testing) has a method (which I am testing) calling
this.gridApi.setDomLayout('normal');
Which is failing saying gridApi is undefined. I am looking for a way to resolve this error, as my test is no where related to see gridApi work. So I am fine to mock gridApi in test ? How should I do it?