React Number Format unit test with isAllowed - reactjs

Question

I am using the react number format for inputting the number input fields.
<TargetRow>
<NumberFormat
type="text"
isNumericString={true}
decimalScale={2}
name="otbTarget"
value={otbTarget === null ? '' : otbTarget}
className="TargetRow__input TargetRow__otbTarget"
onBlur={this.updateTarget}
onChange={this.handleChangeOTBTarget}
isAllowed={this.limitInputValue}
/>
/>
function for the isAllowed, is to limit the length of values entered in the field.
limitInputValue = ({ value }: NumberFormatValues ) => value.length <= ALLOWED_INPUT_LENGTH;
I need to write a unit test for this functionality, to check if the values entered in the field with NumberFormat gets restricted by using the isAllowed method.
I tried using the enzyme simulate for change, but as it turns out it calls the handleChangeOTBTarget method, which is as expected.
I am not able to understand how the isAllowed will be triggered.
Unit test which I am writing is :
it('should restrict values with ALLOWED_INPUT_LENGTH', async () => {
// ALLOWED_INPUT_LENGTH = 3
const mockTarget = 1234512345;
component = shallow(<TargetRow {...defaultProps} otbTarget={mockTarget} />);
const targetInput = component.find('.TargetRow__otbTarget');
targetInput.simulate('change', { target: { value: mockTarget } });
targetInput.simulate('blur');
expect(targetInput.props().value).toBe( 123 );
});
As you can see there is way to simulate onchange, which is working as stated above. But I am not able to trigger the method which is on isAllowed

Answer 1

I would do something as the following:
it('should restrict values with ALLOWED_INPUT_LENGTH', async () => {
const isValid
// ALLOWED_INPUT_LENGTH = 3
const mockTarget = 1234512345;
component = shallow(<TargetRow {...defaultProps} otbTarget={mockTarget} />);
component.instance().limitInputValue = jest.fn(); // MOCK THE METHOD WE ADD TO isAllowed prop
const targetInput = component.find('.TargetRow__otbTarget');
targetInput.simulate('change', { target: { value: mockTarget } });
targetInput.simulate('blur');
expect(targetInput.props().value).toBe( 123 );
expect(component.instance().limitInputValue).toHaveBeenCalled() // Check if the method has been called at all
});