Fix WeChat display on the block checkout with the Optimized Checkout (#4261)

* Fix WeChat display on the block checkout with Smart Checkout

* Toggle setup future usage value depending on the saving checkbox

* Disable some methods on the classic checkout due lack of update method for SPE

* Checking for existing subscription in cart

* Changelog and readme entries

* Readme and changelog updates

---------

Co-authored-by: daledupreez <[email protected]>

Author: wjrosa

changelog.txt

@@ -1,6 +1,7 @@
 *** Changelog ***
 
 = 9.5.0 - xxxx-xx-xx =
+* Fix - Fixes the availability of WeChat Pay when the Optimized Checkout is enabled on the block checkout. Removes it from the classic/shortcode checkout to avoid issues.
 * Dev - Renames all references to "Smart Checkout" and "Single Payment Element" (and "SPE") to "Optimized Checkout" (and "OC"), following the feature rebranding.
 * Tweak - Updates the "Smart Checkout" setting name to "Optimized Checkout", and the description accordingly.
 * Fix - Checks for the existence of the WC_Stripe_Feature_Flags class before including it during extension initialization.

client/blocks/upe/upe-deferred-intent-creation/payment-elements.js

@@ -152,19 +152,19 @@ const PaymentElements = ( {
 					),
 				},
 			};
-		}
 
-		// If the cart contains a subscription or the payment method supports saving, we need to use off_session setup so Stripe can display appropriate terms and conditions.
-		if (
-			getBlocksConfiguration()?.cartContainsSubscription ||
-			props.showSaveOption
-		) {
-			options = {
-				...options,
-				...{
-					setupFutureUsage: 'off_session',
-				},
-			};
+			// If the cart contains a subscription or the payment method supports saving, we need to use off_session setup so Stripe can display appropriate terms and conditions.
+			if (
+				getBlocksConfiguration()?.cartContainsSubscription ||
+				props.showSaveOption
+			) {
+				options = {
+					...options,
+					...{
+						setupFutureUsage: 'off_session',
+					},
+				};
+			}
 		}
 	} else {
 		options = {

client/blocks/upe/upe-deferred-intent-creation/payment-processor.js

@@ -336,8 +336,26 @@ const PaymentProcessor = ( {
 		// Apply single payment element styles if the selected payment method is card and SPE is enabled.
 		if ( getBlocksConfiguration()?.isOCEnabled ) {
 			applyStyles();
+
+			// Maybe change the value of `setupFutureUsage` depending on the saving payment method checkbox state.
+			const savingPaymentMethodCheckbox = document.querySelector(
+				'.wc-block-components-payment-methods__save-card-info input[type=checkbox]'
+			);
+			savingPaymentMethodCheckbox.addEventListener(
+				'change',
+				function () {
+					elements.update( {
+						setupFutureUsage:
+							getBlocksConfiguration()
+								?.cartContainsSubscription ||
+							savingPaymentMethodCheckbox?.checked
+								? 'off_session'
+								: null,
+					} );
+				}
+			);
 		}
-	}, [ selectedPaymentMethodType ] );
+	}, [ selectedPaymentMethodType, elements ] );
 
 	usePaymentCompleteHandler(
 		api,

client/classic/upe/payment-processing.js

@@ -148,6 +148,10 @@ async function createStripePaymentElement( api, paymentMethodType ) {
 				...options,
 				paymentMethodConfiguration: getStripeServerData()
 					?.paymentMethodConfigurationParentId,
+				// There's no way to update this option in the classic checkout dynamically (for SPE).
+				// So, we cannot update this based on the value of the saving payment method checkbox.
+				// Setting this value to `off_session` to avoid issues with methods that do not work with this option (i.e. WeChat Pay, BNPLs)
+				setupFutureUsage: 'off_session',
 			};
 		} else {
 			options = {

readme.txt

@@ -111,6 +111,7 @@ If you get stuck, you can ask for help in the [Plugin Forum](https://wordpress.o
 == Changelog ==
 
 = 9.5.0 - xxxx-xx-xx =
+* Fix - Fixes the availability of WeChat Pay when the Optimized Checkout is enabled on the block checkout. Removes it from the classic/shortcode checkout to avoid issues.
 * Dev - Renames all references to "Smart Checkout" and "Single Payment Element" (and "SPE") to "Optimized Checkout" (and "OC"), following the feature rebranding.
 * Tweak - Updates the "Smart Checkout" setting name to "Optimized Checkout", and the description accordingly.
 * Fix - Checks for the existence of the WC_Stripe_Feature_Flags class before including it during extension initialization.