Fix undefined check of global variable (#3387)

* get data from wcSettings on block checkout if 'wc_stripe_upe_params' is not loaded yet

Author: Mayisha

changelog.txt

@@ -1,5 +1,8 @@
 *** Changelog ***
 
+= 8.8.0 - xxxx-xx-xx =
+* Fix - Resolve an error for checkout block where 'wc_stripe_upe_params' is undefined due to the script registering the variable not being loaded yet.
+
 = 8.7.0 - xxxx-xx-xx =
 * Fix - Prevent duplicate failed-order emails from being sent.
 * Fix - Support custom name and description for Afterpay.

client/stripe-utils/utils.js

@@ -1,4 +1,4 @@
-/* global wc_stripe_upe_params */
+/* global wc_stripe_upe_params, wc */
 import { dispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 import { getAppearance } from '../styles/upe';
@@ -21,13 +21,24 @@ import {
  * @return  {StripeServerData} Stripe server data.
  */
 const getStripeServerData = () => {
-	// Classic checkout.
+	let data = null;
+
 	// eslint-disable-next-line camelcase
-	if ( ! wc_stripe_upe_params ) {
+	if ( typeof wc_stripe_upe_params !== 'undefined' ) {
+		data = wc_stripe_upe_params; // eslint-disable-line camelcase
+	} else if (
+		typeof wc === 'object' &&
+		typeof wc.wcSettings !== 'undefined'
+	) {
+		// 'getSetting' has this data value on block checkout only.
+		data = wc.wcSettings?.getSetting( 'getSetting' ) || null;
+	}
+
+	if ( ! data ) {
 		throw new Error( 'Stripe initialization data is not available' );
 	}
-	// eslint-disable-next-line camelcase
-	return wc_stripe_upe_params;
+
+	return data;
 };
 
 const isNonFriendlyError = ( type ) =>
@@ -210,8 +221,8 @@ export { getStripeServerData, getErrorMessageForTypeAndCode };
  */
 export const isLinkEnabled = ( paymentMethodsConfig ) => {
 	return (
-		paymentMethodsConfig.link !== undefined &&
-		paymentMethodsConfig.card !== undefined
+		paymentMethodsConfig?.link !== undefined &&
+		paymentMethodsConfig?.card !== undefined
 	);
 };
 
@@ -505,16 +516,18 @@ export const getPaymentMethodName = ( paymentMethodType ) => {
  * @return {boolean} Whether the payment method is restricted to selected billing country.
  **/
 export const isPaymentMethodRestrictedToLocation = ( upeElement ) => {
-	const paymentMethodsConfig = getStripeServerData()?.paymentMethodsConfig;
+	const paymentMethodsConfig =
+		getStripeServerData()?.paymentMethodsConfig || {};
 	const paymentMethodType = upeElement.dataset.paymentMethodType;
-	return !! paymentMethodsConfig[ paymentMethodType ].countries.length;
+	return !! paymentMethodsConfig[ paymentMethodType ]?.countries.length;
 };
 
 /**
  * @param {Object} upeElement The selector of the DOM element of particular payment method to mount the UPE element to.
  **/
 export const togglePaymentMethodForCountry = ( upeElement ) => {
-	const paymentMethodsConfig = getStripeServerData()?.paymentMethodsConfig;
+	const paymentMethodsConfig =
+		getStripeServerData()?.paymentMethodsConfig || {};
 	const paymentMethodType = upeElement.dataset.paymentMethodType;
 	const supportedCountries =
 		paymentMethodsConfig[ paymentMethodType ].countries;

readme.txt

@@ -128,6 +128,9 @@ If you get stuck, you can ask for help in the Plugin Forum.
 
 == Changelog ==
 
+= 8.8.0 - xxxx-xx-xx =
+* Fix - Resolve an error for checkout block where 'wc_stripe_upe_params' is undefined due to the script registering the variable not being loaded yet.
+
 = 8.7.0 - xxxx-xx-xx =
 * Fix - Prevent duplicate failed-order emails from being sent.
 * Fix - Support custom name and description for Afterpay.