Prevent multiple save appearance AJAX calls on Block Checkout (#4506)

* Fix multiple save appearance AJAX calls

- Update global appearance data immediately after generation to prevent subsequent calls from seeing empty data
- Add concurrency flag to prevent multiple simultaneous save appearance requests

* Add changelog entries

Author: malithsen

changelog.txt

@@ -11,6 +11,7 @@
 * Tweak - Use wp_ajax prefix for its built-in security for Add Payment Method action
 * Dev - Fix WooCommerce version fetching in GitHub workflows
 * Dev - Fix failing test cases associated with WooCommerce 10.0.x
+* Fix - Prevent multiple save appearance AJAX calls on Block Checkout
 * Fix - Fix required field error message and PHP warning for custom checkout fields that don't have a label
 
 = 9.7.0 - 2025-07-21 =

client/stripe-utils/utils.js

@@ -613,6 +613,10 @@ export const showErrorPaymentMethod = ( errorMessage, containerSelector ) => {
  *
  * @return {Object} The appearance object for the UPE.
  */
+
+// Track if save appearance is already in progress to prevent multiple calls
+let isSavingAppearance = false;
+
 export const initializeUPEAppearance = ( api, isBlockCheckout = 'false' ) => {
 	let appearance =
 		isBlockCheckout === 'true'
@@ -631,8 +635,21 @@ export const initializeUPEAppearance = ( api, isBlockCheckout = 'false' ) => {
 				! data.isChangingPayment );
 
 		// If we have re-built the appearance, only update the settings in the checkout context
-		if ( isValidUpdateContext ) {
-			api.saveAppearance( appearance, isBlockCheckout );
+		if ( isValidUpdateContext && ! isSavingAppearance ) {
+			// Set flag to prevent concurrent saves
+			isSavingAppearance = true;
+
+			// Update the global variable immediately to prevent multiple AJAX calls
+			if ( isBlockCheckout === 'true' ) {
+				data.blocksAppearance = appearance;
+			} else {
+				data.appearance = appearance;
+			}
+
+			api.saveAppearance( appearance, isBlockCheckout ).finally( () => {
+				// Reset flag when save completes (success or failure)
+				isSavingAppearance = false;
+			} );
 		}
 	}
 

readme.txt

@@ -121,6 +121,7 @@ If you get stuck, you can ask for help in the [Plugin Forum](https://wordpress.o
 * Tweak - Use wp_ajax prefix for its built-in security for Add Payment Method action
 * Dev - Fix WooCommerce version fetching in GitHub workflows
 * Dev - Fix failing test cases associated with WooCommerce 10.0.x
+* Fix - Prevent multiple save appearance AJAX calls on Block Checkout
 * Fix - Fix required field error message and PHP warning for custom checkout fields that don't have a label
 
 [See changelog for full details across versions](https://raw.githubusercontent.com/woocommerce/woocommerce-gateway-stripe/trunk/changelog.txt).