I am mocking a component that is available from an npm package:
jest.mock('@paypal/react-paypal-js', () => {
const reactPaypalJs = jest.requireActual('@paypal/react-paypal-js');
return {
...reactPaypalJs,
PayPalButtons: (props) => {
return (
<button
type="button"
onClick={() => {
props.onApprove({ subscriptionID: '123' });
}}
>
Confirm PayPal Payment
</button>
);
},
};
});
describe('Subscribe Page', () => {
it('should expect a subscription ID of 123', async () => {
render(<PaymentPage />);
// Simulate filling out the paypal form using the mock and then submit it
userEvent.click(screen.getByRole('button', { name: 'Confirm PayPal Payment' }));
await waitFor(() => {
expect(trackEventStub).toHaveBeenLastCalledWith({
name: Events.PaymentSuccess,
properties: {
paymentPlatform: 'PayPal',
},
});
});
});
});
I want to change the value of what is being sent to prop.onApprove when the button gets clicked on a single test. How can I do that?
I would prefer not to have to redefine PayPalButtons for each test where I want to change the subscriptionID, but if that's necessary I'll do that. I just can't figure out how to change it for tests individually.