Merge release/7.7.0 into trunk

changelog.txt

@@ -1,5 +1,35 @@
 *** WooPayments Changelog ***
 
+= 7.7.0 - 2024-05-29 =
+* Add - Add share key query param when sending data to Stripe KYC.
+* Add - Add the WooPay Direct Checkout flow to the blocks mini cart widget.
+* Add - feat: add multi-currency support to Store API.
+* Add - feat: error message on 1M+ amount.
+* Add - feat: tokenized cart PRBs on PDPs via feature flag.
+* Add - Render ECE buttons behind a feature flag.
+* Fix - Charm pricing and rounding options corrected for all currencies that aren't presented with decimal points.
+* Fix - Fix "Pay for order" infinite loading when submitting form without payment details.
+* Fix - fix: remove WooPay checkout pages scripts from non-checkout pages.
+* Fix - fix: settings notices consistency.
+* Fix - fix: Store API tokenized cart nonce verification.
+* Fix - Fix a bug in Tracks where shopper events are not fired properly.
+* Fix - Fix ECE error in the blocks checkout when PRBs are disabled.
+* Fix - Fix Payment block render error while editing the block checkout page.
+* Fix - Fix shortcode orders when using WooPay Direct Checkout.
+* Fix - Improve visibility of WooPay button on light and outline button themes.
+* Fix - Updating saved payment method billing address before processing the payment.
+* Update - Do not auto-redirect to WooPay on page load.
+* Update - Pass previous exception with exception.
+* Update - Removed deprecated deposit_status key from account status.
+* Update - Remove public key encryption setting from WooPayments settings.
+* Update - Update XPF currency formatting.
+* Dev - Add command to run QIT PHPStan tests.
+* Dev - Add local release package support for PHPStan.
+* Dev - Bump tested up to version for WP to 6.5 and WC to 8.9.1.
+* Dev - Fix Klarna E2E tests.
+* Dev - Guarantee REST intialization on REST request context (avoiding rest_preload_api_request context).
+* Dev - Upgrade jetpack sync package version.
+
 = 7.6.0 - 2024-05-08 =
 * Add - Add additional data to Compatibility service
 * Add - Add User Satisfaction Survey for Payments Overview Widget

client/checkout/api/index.js

@@ -8,8 +8,7 @@ import {
 	getPaymentRequestData,
 	getPaymentRequestAjaxURL,
 	buildAjaxURL,
-} from '../../payment-request/utils';
-import { decryptClientSecret } from '../utils/encryption';
+} from 'utils/express-checkout';
 
 /**
  * Handles generic connections to the server and Stripe.
@@ -117,90 +116,6 @@ export default class WCPayAPI {
 		} );
 	}
 
-	/**
-	 * Generates a Stripe payment method.
-	 *
-	 * @param {Object} elements A hash of all Stripe elements, used to enter card data.
-	 * @param {Object} preparedCustomerData Default values for customer data, used on pages like Pay for Order.
-	 * @return {Object} A request object, which will be prepared and then `.send()`.
-	 */
-	generatePaymentMethodRequest( elements, preparedCustomerData = {} ) {
-		const stripe = this.getStripe();
-
-		return new ( class {
-			constructor() {
-				this.args = {
-					...elements,
-					billing_details: {
-						address: {},
-					},
-				};
-			}
-
-			/**
-			 * Prepares a value that's been loaded from inputs,
-			 * uses a default value if none is present.
-			 *
-			 * @param {string} name The key of the value.
-			 * @param {mixed} value The value to sanitize.
-			 * @return {mixed}     The sanitized value, `undefined` if not present.
-			 */
-			prepareValue( name, value ) {
-				// Fall back to the value in `preparedCustomerData`.
-				if ( typeof value === 'undefined' || value.length === 0 ) {
-					value = preparedCustomerData[ name ]; // `undefined` if not set.
-				}
-
-				if ( typeof value !== 'undefined' && value.length > 0 ) {
-					return value;
-				}
-			}
-
-			/**
-			 * Updates a billing detail within the request.
-			 *
-			 * @param {string} name The name of the billing value.
-			 * @param {string} value The actual value.
-			 */
-			setBillingDetail( name, value ) {
-				const preparedValue = this.prepareValue( name, value );
-				if ( typeof preparedValue !== 'undefined' ) {
-					this.args.billing_details[ name ] = preparedValue;
-				}
-			}
-
-			/**
-			 * Updates an address detail within the request.
-			 *
-			 * @param {string} name The name of the address value.
-			 * @param {string} value The actual value.
-			 */
-			setAddressDetail( name, value ) {
-				const preparedValue = this.prepareValue( name, value );
-				if ( typeof preparedValue !== 'undefined' ) {
-					this.args.billing_details.address[ name ] = preparedValue;
-				}
-			}
-
-			/**
-			 * Sends the request to Stripe once everything is ready.
-			 *
-			 * @return {Object} The payment method object if successfully loaded.
-			 */
-			send() {
-				return stripe
-					.createPaymentMethod( this.args )
-					.then( ( paymentMethod ) => {
-						if ( paymentMethod.error ) {
-							throw paymentMethod.error;
-						}
-
-						return paymentMethod;
-					} );
-			}
-		} )();
-	}
-
 	/**
 	 * Extracts the details about a payment intent from the redirect URL,
 	 * and displays the intent confirmation modal (if needed).
@@ -253,7 +168,7 @@ export default class WCPayAPI {
 			// use the regular getStripe function.
 			if ( isSetupIntent ) {
 				return this.getStripe().handleNextAction( {
-					clientSecret: decryptClientSecret( clientSecret ),
+					clientSecret: clientSecret,
 				} );
 			}
 
@@ -264,18 +179,13 @@ export default class WCPayAPI {
 					publishableKey,
 					locale,
 					accountIdForIntentConfirmation
-				).confirmCardPayment(
-					decryptClientSecret(
-						clientSecret,
-						accountIdForIntentConfirmation
-					)
-				);
+				).confirmCardPayment( clientSecret );
 			}
 
 			// When not dealing with a setup intent or woopay we need to force an account
 			// specific request in Stripe.
 			return this.getStripe( true ).handleNextAction( {
-				clientSecret: decryptClientSecret( clientSecret ),
+				clientSecret: clientSecret,
 			} );
 		};
 
@@ -353,9 +263,7 @@ export default class WCPayAPI {
 			}
 
 			return this.getStripe()
-				.confirmCardSetup(
-					decryptClientSecret( response.data.client_secret )
-				)
+				.confirmCardSetup( response.data.client_secret )
 				.then( ( confirmedSetupIntent ) => {
 					const { setupIntent, error } = confirmedSetupIntent;
 					if ( error ) {

client/checkout/api/test/index.test.js

@@ -3,13 +3,13 @@
  */
 import WCPayAPI from '..';
 import request from 'wcpay/checkout/utils/request';
-import { buildAjaxURL } from 'wcpay/payment-request/utils';
+import { buildAjaxURL } from 'wcpay/utils/express-checkout';
 import { getConfig } from 'wcpay/utils/checkout';
 
 jest.mock( 'wcpay/checkout/utils/request', () =>
 	jest.fn( () => Promise.resolve( {} ).finally( () => {} ) )
 );
-jest.mock( 'wcpay/payment-request/utils', () => ( {
+jest.mock( 'wcpay/utils/express-checkout', () => ( {
 	buildAjaxURL: jest.fn(),
 } ) );
 jest.mock( 'wcpay/utils/checkout', () => ( {

client/checkout/blocks/index.js

@@ -19,6 +19,7 @@ import PaymentMethodLabel from './payment-method-label';
 import request from '../utils/request';
 import enqueueFraudScripts from 'fraud-scripts';
 import paymentRequestPaymentMethod from '../../payment-request/blocks';
+import expressCheckoutElementPaymentMethod from '../../express-checkout/blocks';
 import {
 	PAYMENT_METHOD_NAME_CARD,
 	PAYMENT_METHOD_NAME_BANCONTACT,
@@ -154,6 +155,7 @@ if ( getUPEConfig( 'isWooPayEnabled' ) ) {
 }
 
 registerExpressPaymentMethod( paymentRequestPaymentMethod( api ) );
+registerExpressPaymentMethod( expressCheckoutElementPaymentMethod( api ) );
 window.addEventListener( 'load', () => {
 	enqueueFraudScripts( getUPEConfig( 'fraudServices' ) );
 	addCheckoutTracking();

client/checkout/blocks/payment-elements.js

@@ -1,3 +1,11 @@
+/**
+ * External dependencies
+ */
+import { useEffect, useState, RawHTML } from '@wordpress/element';
+import { Elements } from '@stripe/react-stripe-js';
+// eslint-disable-next-line import/no-unresolved
+import { StoreNotice } from '@woocommerce/blocks-checkout';
+
 /**
  * Internal dependencies
  */
@@ -6,14 +14,16 @@ import { getAppearance, getFontRulesFromPage } from 'wcpay/checkout/upe-styles';
 import { getUPEConfig } from 'wcpay/utils/checkout';
 import { useFingerprint } from './hooks';
 import { LoadableBlock } from 'wcpay/components/loadable';
-import { Elements } from '@stripe/react-stripe-js';
-import { useEffect, useState } from 'react';
 import PaymentProcessor from './payment-processor';
 import { getPaymentMethodTypes } from 'wcpay/checkout/utils/upe';
 
 const PaymentElements = ( { api, ...props } ) => {
 	const stripe = api.getStripeForUPE( props.paymentMethodId );
 	const [ errorMessage, setErrorMessage ] = useState( null );
+	const [
+		paymentProcessorLoadErrorMessage,
+		setPaymentProcessorLoadErrorMessage,
+	] = useState( undefined );
 	const [ appearance, setAppearance ] = useState(
 		getUPEConfig( 'wcBlocksUPEAppearance' )
 	);
@@ -63,10 +73,23 @@ const PaymentElements = ( { api, ...props } ) => {
 					fonts: fontRules,
 				} }
 			>
+				{ paymentProcessorLoadErrorMessage?.error?.message && (
+					<div className="wc-block-components-notices">
+						<StoreNotice status="error" isDismissible={ false }>
+							<RawHTML>
+								{
+									paymentProcessorLoadErrorMessage.error
+										.message
+								}
+							</RawHTML>
+						</StoreNotice>
+					</div>
+				) }
 				<PaymentProcessor
 					api={ api }
 					errorMessage={ errorMessage }
 					fingerprint={ fingerprint }
+					onLoadError={ setPaymentProcessorLoadErrorMessage }
 					{ ...props }
 				/>
 			</Elements>

client/checkout/blocks/payment-method-label.js

@@ -18,23 +18,29 @@ export default ( {
 	const bnplMethods = [ 'affirm', 'afterpay_clearpay', 'klarna' ];
 
 	// Stripe expects the amount to be sent as the minor unit of 2 digits.
-	const amount = normalizeCurrencyToMinorUnit(
-		cartData.totals.total_price,
-		cartData.totals.currency_minor_unit
+	const amount = parseInt(
+		normalizeCurrencyToMinorUnit(
+			cartData.totals.total_price,
+			cartData.totals.currency_minor_unit
+		),
+		10
 	);
 
 	// Customer's country or base country of the store.
 	const currentCountry =
 		cartData.billingAddress.country ||
-		window.wcBlocksCheckoutData.storeCountry;
+		window.wcBlocksCheckoutData?.storeCountry ||
+		'US';
 
 	return (
 		<>
 			<span>
 				{ upeConfig.title }
 				{ bnplMethods.includes( upeName ) &&
 					( upeConfig.countries.length === 0 ||
-						upeConfig.countries.includes( currentCountry ) ) && (
+						upeConfig.countries.includes( currentCountry ) ) &&
+					amount > 0 &&
+					currentCountry && (
 						<>
 							<Elements
 								stripe={ api.getStripeForUPE( upeName ) }
@@ -44,7 +50,7 @@ export default ( {
 							>
 								<PaymentMethodMessagingElement
 									options={ {
-										amount: parseInt( amount, 10 ) || 0,
+										amount: amount || 0,
 										currency:
 											cartData.totals.currency_code ||
 											'USD',