#7884977 composite-checkout: Make sure that the return type of submit button onClick is always a Promise

Every payment method object passed into a CheckoutProvider must supply a submit button component. That component is then rendered by the CheckoutSubmitButton which is rendered as part of every form that uses the provider. CheckoutSubmitButton injects a onClick callback prop into each submit button component which hooks that button into the transaction flow that the @automattic/composite-checkout package provides (specifically, it calls the payment processor function that the provider has assigned to that payment method). The return value of that callback is the same as the return value of the hook that creates it, useProcessPayment(), which is Promise<PaymentProcessorResponse>.

However, the onClick prop is wrapped in another function before it is injected which allows CheckoutSubmitButton to run a validation callback before it calls the payment processor. That wrapper has two cases where it can return undefined instead of a Promise. This was overlooked because most payment methods do not use the return value of onClick, but WeChatPayButton does, and this results in a fatal error (see p1679556359011019-slack-C04U5A26MJB).

This issue was created by #65414

Proposed Changes

In this PR we modify CheckoutSubmitButton so that its return value is the same as the return value of the onClick method it wraps.

Testing Instructions

First, modify calypso so that the checkout submit button’s validation callback will always return false:

diff --git a/client/my-sites/checkout/composite-checkout/components/wp-checkout.tsx b/client/my-sites/checkout/composite-checkout/components/wp-checkout.tsx
index a9c6a07dc0..9b15f82882 100644
--- a/client/my-sites/checkout/composite-checkout/components/wp-checkout.tsx
+++ b/client/my-sites/checkout/composite-checkout/components/wp-checkout.tsx
@@ -244,10 +244,7 @@ export default function WPCheckout( {
 
 	const validateForm = async () => {
 		setIsSubmitted( true );
-		if ( hasMarketplaceProduct && ! is3PDAccountConsentAccepted ) {
-			return false;
-		}
-		return true;
+		return false;
 	};
 
 	if ( ! checkoutActions ) {

Next, add a product to your cart and visit checkout.

Complete the checkout form and press the submit button.

Verify that nothing happens when the button is clicked. (If this were a real failure a different mechanism would display the error; see #65414.)