'How to test callback methods in react functional component when the child component elements are not completely accessible

I am using jest to test my react component. However I need to test the callback methods passed as props to children components. My component looks something like this

    function myReactComp = (props) =>  {
      onRowEditHandler = (rowData) => {
        // if this then that logic
        // process and trasform data
        // set some local state
        // dispatch action
      }
      
      return (
         <ComplexDataTableComponent data={someDataProps} onRowEdit = {onRowEditHandler} />
     )
    }

I need to test the onRowEditHandler as a function. I want to send arguments to this function explicitly so that specific code logic are triggered.

Now many suggestions in stackOverflow says, the best way to test closure functions in react functional components is to simulate the user behavior. For example, if there is a callback for a button, find the button on the wrapper/instance and trigger the click event.

In my case, the ComplexDataTableComponent is kind of like a container, which has many children and nested components. It is next to impossible to find a specific row element, trigger its edit button and then update the form data so that the call back is triggered.

Is there any way i can get access to onRowEditHandler apart from triggering the wrapper/instance elements?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source