woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-09-05 08:59:14 +08:00
Code Issues Projects Packages Wiki Activity Actions 7

🐛 Sync WC shipping details with Google Pay

Browse source 
This change keeps the checkout & cart forms in-sync with the Google Pay form, to ensure the form submits the same details that the user can see inside Google Pay
This commit is contained in:
Philipp Stracker 2024-08-26 17:10:51 +02:00
parent fa5cbde67e
commit a467533ba6
No known key found for this signature in database
1 changed files with 54 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

54
modules/ppcp-googlepay/resources/js/GooglepayButton.js
View file

@ -525,6 +525,11 @@ class GooglepayButton extends PaymentButton {
updatedData.total,
updatedData.shipping_fee
);
// This page contains a real cart and potentially a form for shipping options.
this.syncShippingOptionWithForm(
paymentData?.shippingOptionData?.id
);
} else {
transactionInfo.shippingFee = this.getShippingCosts(
paymentData?.shippingOptionData?.id,
@ -728,6 +733,55 @@ class GooglepayButton extends PaymentButton {
return response;
}
/**
* Updates the shipping option in the checkout form, if a form with shipping options is
* detected.
*
* @param {string} shippingOption - The shipping option ID, e.g. "flat_rate:4".
* @return {boolean} - True if a shipping option was found and selected, false otherwise.
*/
syncShippingOptionWithForm( shippingOption ) {
const wrappers = [
// Classic checkout, Classic cart.
'.woocommerce-shipping-methods',
// Block checkout.
'.wc-block-components-shipping-rates-control',
// Block cart.
'.wc-block-components-totals-shipping',
];
const sanitizedShippingOption = shippingOption.replace( /"/g, '' );
// Check for radio buttons with shipping options.
for ( const wrapper of wrappers ) {
const selector = `${ wrapper } input[type="radio"][value="${ sanitizedShippingOption }"]`;
const radioInput = document.querySelector( selector );
if ( radioInput ) {
radioInput.click();
return true;
}
}
// Check for select list with shipping options.
for ( const wrapper of wrappers ) {
const selector = `${ wrapper } select option[value="${ sanitizedShippingOption }"]`;
const selectOption = document.querySelector( selector );
if ( selectOption ) {
const selectElement = selectOption.closest( 'select' );
if ( selectElement ) {
selectElement.value = sanitizedShippingOption;
selectElement.dispatchEvent( new Event( 'change' ) );
return true;
}
}
}
return false;
}
}
export default GooglepayButton;