Merge branch 'develop' into dev/update-nodejs-to-v20

Author: daledupreez

.github/workflows/e2e-tests.yml

@@ -14,7 +14,7 @@ jobs:
       fail-fast: false
       max-parallel: 10
       matrix:
-        checkout: [ 'Default', 'Legacy', 'SPE' ]
+        checkout: [ 'Default', 'Legacy', 'OptimizedCheckout' ]
 
     name: ${{ matrix.checkout }} WP=latest, WC=latest, PHP=7.4
     steps:
@@ -88,8 +88,8 @@ jobs:
         run: |
           if [ "${{ matrix.checkout }}" = "Legacy" ]; then
             npm run test:e2e-legacy
-          elif [ "${{ matrix.checkout }}" = "SPE" ]; then
-            npm run test:e2e-spe
+          elif [ "${{ matrix.checkout }}" = "OptimizedCheckout" ]; then
+            npm run test:e2e-oc
           else
             npm run test:e2e
           fi

.github/workflows/run-e2e-tests.yml

@@ -20,7 +20,7 @@ jobs:
       fail-fast: false
       max-parallel: 10
       matrix:
-        project: [ 'default', 'legacy', 'acss', 'spe' ]
+        project: [ 'default', 'legacy', 'acss', 'optimized-checkout' ]
 
     name: E2E - ${{ matrix.project }} (WP=${{ inputs.wp-version }}, WC=${{ inputs.wc-version }}, PHP=${{ inputs.php-version }})
     steps:

bin/docker-setup.sh

@@ -103,7 +103,7 @@ cli wp option set woocommerce_allow_tracking "no"
 cli wp option set woocommerce_coming_soon "no"
 
 echo "Importing WooCommerce shop pages..."
-cli wp wc --user=admin tool run install_pages
+cli wp --user=admin wc tool run install_pages
 
 echo "Installing and activating the WordPress Importer plugin..."
 cli wp plugin install wordpress-importer --activate

changelog.txt

@@ -1,6 +1,10 @@
 *** Changelog ***
 
 = 9.5.0 - xxxx-xx-xx =
+* Fix - Fixes the listing of payment methods on the classic checkout when the Optimized Checkout is enabled.
+* 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.
 * Dev - Implements the new Stripe order class into the new checkout experience files.
 * Dev - Splits the code coverage GitHub Actions Workflow into two separate actions.
@@ -20,6 +24,9 @@
 * Fix - Prevents fatal errors for cases where we fail to load product details
 * Fix - Address an edge case with webhook URL comparisons
 * Fix - Show correct gateway name in non payments settings pages.
+* Update - Add support for customer order notes and express checkout
+* Dev - Minor fix to e2e setup code
+* Dev - Make PHP error log from Docker container available in docker/logs/php/error.log
 
 = 9.4.1 - 2025-04-17 =
 * Dev - Forces rollback of version 9.4.0.

client/api/index.js

@@ -3,6 +3,7 @@ import { __ } from '@wordpress/i18n';
 import apiFetch from '@wordpress/api-fetch';
 import { applyFilters } from '@wordpress/hooks';
 import {
+	getCustomerNote,
 	getExpressCheckoutData,
 	getExpressCheckoutAjaxURL,
 	getRequiredFieldDataFromCheckoutForm,
@@ -610,6 +611,7 @@ export default class WCStripeAPI {
 	expressCheckoutECECreateOrder( paymentData ) {
 		return this.postToBlocksAPI( '/wc/store/v1/checkout', {
 			...getRequiredFieldDataFromCheckoutForm( paymentData ),
+			customer_note: getCustomerNote(),
 		} );
 	}
 

client/blocks/upe/index.js

@@ -45,7 +45,7 @@ const methodsToFilter = [
 ];
 
 // Register UPE Elements.
-if ( getBlocksConfiguration()?.isSPEEnabled ) {
+if ( getBlocksConfiguration()?.isOCEnabled ) {
 	registerPaymentMethod(
 		upeElement( PAYMENT_METHOD_CARD, api, paymentMethodsConfig.card )
 	);

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

@@ -135,7 +135,7 @@ const PaymentElements = ( {
 			},
 		};
 
-		if ( getBlocksConfiguration()?.isSPEEnabled ) {
+		if ( getBlocksConfiguration()?.isOCEnabled ) {
 			options = {
 				...options,
 				...{
@@ -152,19 +152,19 @@ const PaymentElements = ( {
 						getPaymentMethodTypes( paymentMethodId ),
 				},
 			};
-		}
 
-		// 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

@@ -26,9 +26,9 @@ import {
 	PAYMENT_METHOD_BLIK,
 	PAYMENT_METHOD_CASHAPP,
 } from 'wcstripe/stripe-utils/constants';
-import { handleDisplayOfPaymentInstructions } from 'wcstripe/smart-checkout/handle-display-of-payment-instructions';
-import { applyStyles } from 'wcstripe/smart-checkout/apply-styles';
-import { handleDisplayOfSavingCheckbox } from 'wcstripe/smart-checkout/handle-display-of-saving-checkbox';
+import { handleDisplayOfPaymentInstructions } from 'wcstripe/optimized-checkout/handle-display-of-payment-instructions';
+import { applyStyles } from 'wcstripe/optimized-checkout/apply-styles';
+import { handleDisplayOfSavingCheckbox } from 'wcstripe/optimized-checkout/handle-display-of-saving-checkbox';
 
 const noop = () => null;
 
@@ -82,7 +82,7 @@ const getStripeElementOptions = () => {
 		}
 	}
 
-	if ( getBlocksConfiguration()?.isSPEEnabled ) {
+	if ( getBlocksConfiguration()?.isOCEnabled ) {
 		options = {
 			...options,
 			layout: {
@@ -331,10 +331,28 @@ const PaymentProcessor = ( {
 			removeCashAppLimitNotice();
 		}
 		// Apply single payment element styles if the selected payment method is card and SPE is enabled.
-		if ( getBlocksConfiguration()?.isSPEEnabled ) {
+		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,
@@ -356,7 +374,7 @@ const PaymentProcessor = ( {
 	const onSelectedPaymentMethodChange = ( { value, complete } ) => {
 		setSelectedPaymentMethodType( value.type );
 		setIsPaymentElementComplete( complete );
-		if ( getBlocksConfiguration()?.isSPEEnabled ) {
+		if ( getBlocksConfiguration()?.isOCEnabled ) {
 			handleDisplayOfPaymentInstructions( value.type );
 			handleDisplayOfSavingCheckbox( value.type );
 		}

client/blocks/upe/upe-element.js

@@ -25,7 +25,7 @@ const upeMethods = getPaymentMethodsConstants();
  * @return {JSX.Element|null} The icon element.
  */
 const getUpeElementIcon = ( paymentMethod ) => {
-	if ( getBlocksConfiguration()?.isSPEEnabled ) {
+	if ( getBlocksConfiguration()?.isOCEnabled ) {
 		return null;
 	}
 

client/classic/upe/payment-processing.js

@@ -26,8 +26,8 @@ import {
 	PAYMENT_METHOD_MULTIBANCO,
 	PAYMENT_METHOD_WECHAT_PAY,
 } from 'wcstripe/stripe-utils/constants';
-import { handleDisplayOfPaymentInstructions } from 'wcstripe/smart-checkout/handle-display-of-payment-instructions';
-import { handleDisplayOfSavingCheckbox } from 'wcstripe/smart-checkout/handle-display-of-saving-checkbox';
+import { handleDisplayOfPaymentInstructions } from 'wcstripe/optimized-checkout/handle-display-of-payment-instructions';
+import { handleDisplayOfSavingCheckbox } from 'wcstripe/optimized-checkout/handle-display-of-saving-checkbox';
 
 const gatewayUPEComponents = {};
 const paymentMethodsConfig = getStripeServerData()?.paymentMethodsConfig;
@@ -155,11 +155,15 @@ async function createStripePaymentElement( api, paymentMethodType ) {
 			amount,
 		};
 
-		if ( getStripeServerData()?.isSPEEnabled ) {
+		if ( getStripeServerData()?.isOCEnabled ) {
 			options = {
 				...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 = {
@@ -188,8 +192,8 @@ async function createStripePaymentElement( api, paymentMethodType ) {
 		},
 	};
 
-	// Set the layout to accordion if SPE is enabled.
-	if ( getStripeServerData()?.isSPEEnabled ) {
+	// Set the layout to accordion if OC is enabled.
+	if ( getStripeServerData()?.isOCEnabled ) {
 		paymentElementOptions = {
 			...paymentElementOptions,
 			layout: {
@@ -342,9 +346,9 @@ export async function mountStripePaymentElement( api, domElement ) {
 		// Setting the flag to true to prevent the form from being submitted.
 		gatewayUPEComponents[ paymentMethodType ].hasLoadError = true;
 	} );
-	if ( getStripeServerData()?.isSPEEnabled ) {
+	if ( getStripeServerData()?.isOCEnabled ) {
 		upeElement.on( 'change', ( { value } ) => {
-			// If the SPE is enabled, we need to handle the display of the saving checkbox.
+			// If the OC is enabled, we need to handle the display of the saving checkbox.
 			handleDisplayOfPaymentInstructions( value.type );
 
 			// Bind the create account checkbox to the save card info container display function.