How to write unit test case of ag agrid cellRenderer with return value in angular

Question

TS:

columnDefs = [
 { headerName: 'columnone', field: 'one', width: 120, sortable: true, 
   cellRenderer: (data) => {
        return this.limitCommonUtil.numberFormatter(data?.data?.upperAmount);
 }
    },
    { headerName: 'columntwo', field: 'two', width: 120, sortable: true,
      cellRenderer: (data) => {
        return this.limitCommonUtil.dateFormatterDDMMMYYYY(data?.data?.startDate);
      }]

HTML:

<ag-grid-angular
            [rowData]="(dataStream)"
            [columnDefs]="columnDefs"
            class="side-panels-container-grid"
            [gridOptions]="gridOptionsDefault"
            (selectionChanged)="onSelectionChanged()">
        </ag-grid-angular>

how to write unit test case for columndefs in jasmine and karma? am not able to cover cellRendered return function. Getting error as below.

Error: Cannot read properties of undefined (reading 'data') thrown

Answer 1

Have you mocked the data for the grid properly in your test? If you're only interested in unit testing the cellRenderer itself you can:

const cellRenderer = component.columnDefs.find(c => c.headerName === 'columnone').cellRenderer as any;
expect(cellRenderer({data: { upperAmount: 10 }})).toEqual('Whatever is expected');