How to write React JS Jest test case for Ag Grid/AgGrid with good coverage

How to write React JS Jest test case for Ag Grid/AgGrid with good coverage

When i started writing jest test cases for React Js Ag Grid/AgGrid, i found less help on Google.
Below are tested jest test cases where i got 100% coverage.

Lets have look on my common component for React JS AgGrid

//import required modules for AgGrid React, i am using ag grid modules instead of packages to have less bundle size
import React from 'react'
import { AllModules } from '@ag-grid-enterprise/all-modules'
import { AgGridReact } from '@ag-grid-community/react'

const onFirstDataRendered = params => {
	params.api.sizeColumnsToFit();
}

//onRowClicked: To catch user click event on row
//onRowDoubleClicked: when user double click on row then it will call this event
//onFirstDataRendered: This will get call when first render of grid happend. This i am using to adjust column width as per parent wrapper div width
const AgGridView = (props) => {
	return (
		<AgGridReact
			gridOptions={props.gridOptions}
			rowData={props.rowData}
			modules={AllModules}
			onGridReady={props.onGridReady}
			onRowClicked={props.onRowClicked}
			onFirstDataRendered={props.onFirstDataRendered}
			onRowDoubleClicked={props.handleRowDoubleClicked}
	)
}
export default AgGridView

So lets write jest test cases with help of Enzyme, Enzyme Adapter for React JS AgGrid/ag grid common component

//import all required dependencies
//import AgGridReact component and package
import React from 'react'
import Enzyme, { shallow } from 'enzyme'
import Adapter from 'enzyme-adapter-react-16'
import { cleanup } from '@testing-library/react'
import { AgGridReact } from '@ag-grid-community/react'

import AgGridView from 'path to component for which we are writing test case above comp'

Enzyme.configure({ adapter: new Adapter() })
afterEach(cleanup)

//Define props if passing any from parent component
const props = {
	rowData: agGridConfig.rowData
}

//Mock dummy data for row click. we need to pass it on row selection
const mockDataJson = {
	data: [
		{
			title: 'T1',
			batchId: 1
		},
		{
			title: 'T1',
			batchId: 1
		}
	]
}

//Start writing test case with proper description
it('AgGrid: Triggers single and double click', () => {
	//Write mock event for row click
	const mockRowClickEvent = {
		api: {
			getSelectedRows: jest.fn().mockReturnValue(mockDataJson)
		}
	}
	//Write mock event for row double click
	const mockDoubleClickEvent = {
		api: {
			sizeColumnsToFit: jest.fn()
		}
	}
	
	//By using shallow, it will render a component “one level deep” 
	const gridWrapper = shallow(<AgGridView {...props} />);
	//with help of shallow object find for AgGridReact
	const agGridReactObj = gridWrapper.find(AgGridReact);
	//Use simulate to call OnGridReady event to init AgGrid
	agGridReactObj.simulate('gridReady');
	//Use simulate to onRowClicked event with mock event
	agGridReactObj.simulate('rowClicked', mockRowClickEvent);
	//Use simulate to onRowDoubleClicked event with mock event
	agGridReactObj.simulate('firstDataRendered', mockDoubleClickEvent);
	expect(agGridReactObj).toBeTruthy();
});