startEditingCell for AgGridReact not working with custom cell editor component

Question

I have a scenario in which I have to mount render AgGridReact which is having a custom cell editor component. I am unable to use startEditingCell for editing the cell. The value is not populating in the grid.

const columnDefs = [
{
cellClassRules : { <some classes>},
cellEditor : 'customInput',
cellEditorParams : {
<some params>
},
cellStyle :{<some styles>},
editable : <method>,
singleClickEdit: true,
tooltipValueGetter: <method>,
valueGetter:<method>,
valueSetter:<method>,
width:100
}
];

return (
 <AgGridReact 
        columnDefs={columnDefinitions}
        frameworkComponents :{
           customInput : <React forwardref component>
           }
)

Here, react component(hooks component) have some validations on the data entered. So, in my tests I want to use startEditingCell to set the value so that the hooks will be triggered and the validations will happen. I am unable to do that.

Can anybody suggest a solution on how to cover this case?

Joyal Joy Madeckal Joyal Joy Madeckal · Accepted Answer · 2021-02-09T13:20:02

I guess I have found out the solution for my question. AgGrid will render the custom cellEditor component only if we put the corresponding cell to editing mode. I have put the cell to editing mode by using startEditingCell with the params colKey and rowIndex and hence my component got rendered and was able to test further

startEditingCell for AgGridReact not working with custom cell editor component

1 Answers