Donation tests

[ojeytonwilliams]

We should have more tests for /donate and the donate form. Cypress tests, if possible, so that we can confirm that the donation flow works correctly. Since external services (PayPal and Stripe) are involved, we should find a way to stub those out.

For example:

freeCodeCamp/client/src/components/Donation/DonateForm.js

Lines 219 to 223 in 6de5144

	const { error } = await stripe.redirectToCheckout({
	items: [item],
	successUrl: donationUrls.successUrl,
	cancelUrl: donationUrls.cancelUrl
	});

would need to be replaced by a stub. That way we can test everything around that (selection of different durations and amounts, what happens on success and failure and so on) without relying on the UI of an external service.

Here are the types of donations we need tests for:

1. donation modal stripe
2. donation modal paypal
3. donate page stripe
4. donate page paypal

[ahmaxed]

@Twaha-Rahman, since you have been spearheading our test coverage expansion efforts, I was wondering if you have any thoughts on this matter before we start with the implementation?

[Twaha-Rahman]

I don't know much about the /donation page or it's features so can't say much about it.... but able to test it with Cypress would be a big plus without a doubt.

Also maybe add the search feature to the list too. The ability to test the search feature in the navbar would be a nice addition.
(But this maybe a separate issue altogether 🤔 )

[raisedadead]

It wont be trivial for a non-staff member to test these out without the Stripe setup (and PayPal etc). I recommend this to be taken up one of the Staff instead.

[ojeytonwilliams]

Sure, we can handle this - we just wanted to track it somewhere and see if anyone had any input.

[ojeytonwilliams]

More discussion in: #40702

[moT01]

Update: @ahmadabdolsaheb is working on this.

[ahmaxed]

#49381 Donation block popping for new responsive web design should be implemented as well.