I am making an assertion in the Jest test case where clicking on a checkbox should update a setState callback (onSelect in my case, coming in as a prop to my component). But since the onSelect uses a callback, my test case is failing. How can I test this? I am using Jest and React Testing Library.
it('should render a selection list', () => {
const onSelect = jest.fn();
const { getByTestId } = render(
<Selection onSelect={ onSelect }>{ listItems }</Selection>
);
const itemToBeSelected = getByTestId('list-item-checkbox-3');
fireEvent.click(itemToBeSelected);
expect(onSelect).toBeCalledWith([ 3 ]);
});
Expected: [3]
Received
1: [Function anonymous]
2: [Function anonymous]
3: [Function anonymous]
In the implementation file the onSelect looks like this
onSelect((state) => [ ...state, itemId ] ]);