I have material-table with Add, Edit and Delete action icons. All are working. Now I want to write some unit test using jest and react test library.

    import AddBox from "@material-ui/icons/AddBox";
    
    const tableIcons = {
    Add: forwardRef((props, ref) => <AddBox {...props} ref={ref} />),
    
   

For example the icon Add has title 'Add' and so on. onRowAdd(newRow) calls a handleRowAdd method to add new row to the table.

I want to write a unit test that asserts that the handleRowAdd method is called once when the icon/button add is clicked. I tried something like the following but didn't work

const {getAllByTitle}= render(<ContentTable/>)
const addButton = getAllByTitle('Add')
fireEvent.click(addButton)
expect(handleRowAdd.calls).toHavelength(1)

It seems Add button is not in the document because when I check expect(getAllByTitle('Add')).toHavelength(1) test passes but for expect(getAllByTitle('Add')).toBeInTheDocument(); test fails.

How can I access the Add button/icon as DOM element and then test the click event calls the handleRowAdd method?