🐛 Fetch transaction details on button click

Fixes an issue with multiple payment buttons on one page, like Mini-Cart and Single Product
This commit is contained in:
Philipp Stracker 2024-08-09 16:20:29 +02:00
parent 7106413f87
commit 6aad61f610
No known key found for this signature in database

View file

@ -277,15 +277,7 @@ class GooglepayButton extends PaymentButton {
reinit() { reinit() {
super.reinit(); super.reinit();
if ( this.contextHandler?.transactionInfo ) { this.init();
// If possible, fetch the current transaction details from the checkout form.
this.contextHandler.transactionInfo().then( ( transactionInfo ) => {
this.transactionInfo = transactionInfo;
this.init();
} );
} else {
this.init();
}
} }
/** /**
@ -375,29 +367,45 @@ class GooglepayButton extends PaymentButton {
const initiatePaymentRequest = () => { const initiatePaymentRequest = () => {
window.ppcpFundingSource = 'googlepay'; window.ppcpFundingSource = 'googlepay';
const paymentDataRequest = this.paymentDataRequest(); const paymentDataRequest = this.paymentDataRequest();
this.log( this.log(
'onButtonClick: paymentDataRequest', 'onButtonClick: paymentDataRequest',
paymentDataRequest, paymentDataRequest,
this.context this.context
); );
this.paymentsClient.loadPaymentData( paymentDataRequest ); this.paymentsClient.loadPaymentData( paymentDataRequest );
}; };
if ( 'function' === typeof this.contextHandler.validateForm ) { const validateForm = () => {
// During regular checkout, validate the checkout form before initiating the payment. if ( 'function' !== typeof this.contextHandler.validateForm ) {
this.contextHandler return Promise.resolve();
.validateForm() }
.then( initiatePaymentRequest, ( reason ) => {
this.error( 'Form validation failed.', reason ); return this.contextHandler.validateForm().catch( ( error ) => {
this.error( 'Form validation failed:', error );
throw error;
} );
};
const getTransactionInfo = () => {
if ( 'function' !== typeof this.contextHandler.transactionInfo ) {
return Promise.resolve();
}
return this.contextHandler
.transactionInfo()
.then( ( transactionInfo ) => {
this.transactionInfo = transactionInfo;
} )
.catch( ( error ) => {
this.error( 'Failed to get transaction info:', error );
throw error;
} ); } );
} else { };
// This is the flow on product page, cart, and other non-checkout pages.
initiatePaymentRequest(); validateForm()
} .then( getTransactionInfo )
.then( initiatePaymentRequest );
} }
paymentDataRequest() { paymentDataRequest() {