diff --git a/changelog.txt b/changelog.txt index 7316c31aa..43c66499e 100644 --- a/changelog.txt +++ b/changelog.txt @@ -1,6 +1,7 @@ *** Changelog *** = 9.2.0 - xxxx-xx-xx = +* Dev - Replaces part of the StoreAPI call code for the cart endpoints to use the newly introduced filter. * Dev - Add new E2E tests for Link express checkout. * Add - Add Amazon Pay to block cart and block checkout. * Fix - Remove intentional delay when displaying tax-related notice for express checkout, causing click event to time out. diff --git a/client/blocks/express-checkout/hooks.js b/client/blocks/express-checkout/hooks.js index c3ed65c3d..d12726bb7 100644 --- a/client/blocks/express-checkout/hooks.js +++ b/client/blocks/express-checkout/hooks.js @@ -15,6 +15,7 @@ import { normalizeLineItems, } from 'wcstripe/express-checkout/utils'; import 'wcstripe/express-checkout/compatibility/wc-order-attribution'; +import 'wcstripe/express-checkout/compatibility/wc-product-page'; export const useExpressCheckout = ( { api, diff --git a/client/entrypoints/express-checkout/index.js b/client/entrypoints/express-checkout/index.js index 73f7b2af2..86ed5664e 100644 --- a/client/entrypoints/express-checkout/index.js +++ b/client/entrypoints/express-checkout/index.js @@ -11,8 +11,8 @@ import { getExpressCheckoutButtonAppearance, getExpressCheckoutButtonStyleSettings, getExpressCheckoutData, - isManualPaymentMethodCreation, getPaymentMethodTypesForExpressMethod, + isManualPaymentMethodCreation, normalizeLineItems, } from 'wcstripe/express-checkout/utils'; import { @@ -28,6 +28,7 @@ import { import { getStripeServerData } from 'wcstripe/stripe-utils'; import { getAddToCartVariationParams } from 'wcstripe/utils'; import 'wcstripe/express-checkout/compatibility/wc-order-attribution'; +import 'wcstripe/express-checkout/compatibility/wc-product-page'; import './styles.scss'; import { EXPRESS_PAYMENT_METHOD_SETTING_AMAZON_PAY, @@ -527,27 +528,12 @@ jQuery( function ( $ ) { addToCart: () => { let productId = $( '.single_add_to_cart_button' ).val(); - // Check if product is a variable product. - if ( $( '.single_variation_wrap' ).length ) { - productId = $( '.single_variation_wrap' ) - .find( 'input[name="product_id"]' ) - .val(); - } - - if ( $( '.wc-bookings-booking-form' ).length ) { - productId = $( '.wc-booking-product-id' ).val(); - } - const data = { qty: $( quantityInputSelector ).val(), }; - if ( useLegacyCartEndpoints ) { - data.product_id = productId; - data.attributes = wcStripeECE.getAttributes().data; - } else { - data.id = productId; - data.variation = []; + if ( $( '.wc-bookings-booking-form' ).length ) { + productId = $( '.wc-booking-product-id' ).val(); } // Add extension data to the POST body @@ -570,10 +556,18 @@ jQuery( function ( $ ) { } } ); + // Legacy support for variations. if ( useLegacyCartEndpoints ) { + data.product_id = productId; + data.attributes = wcStripeECE.getAttributes().data; + return api.expressCheckoutAddToCartLegacy( data ); } + // BlocksAPI partial support (lacking support for variations). + data.id = productId; + data.variation = []; + return api.expressCheckoutAddToCart( data ); }, diff --git a/client/express-checkout/compatibility/__tests__/wc-product-page.test.js b/client/express-checkout/compatibility/__tests__/wc-product-page.test.js new file mode 100644 index 000000000..94ea7a38b --- /dev/null +++ b/client/express-checkout/compatibility/__tests__/wc-product-page.test.js @@ -0,0 +1,25 @@ +import { applyFilters } from '@wordpress/hooks'; +import { render } from '@testing-library/react'; +import 'wcstripe/express-checkout/compatibility/wc-product-page'; + +describe( 'ECE product page compatibility', () => { + describe( 'filters out data when adding item to the cart', () => { + it( 'single variation form is present', () => { + function App() { + return ( +
+ +
+ ); + } + render( ); + + const cartAddItemData = applyFilters( + 'wcstripe.express-checkout.cart-add-item', + {} + ); + + expect( cartAddItemData ).toStrictEqual( { id: 123 } ); + } ); + } ); +} ); diff --git a/client/express-checkout/compatibility/wc-order-attribution.js b/client/express-checkout/compatibility/wc-order-attribution.js index 3aa795a6a..3558a85d2 100644 --- a/client/express-checkout/compatibility/wc-order-attribution.js +++ b/client/express-checkout/compatibility/wc-order-attribution.js @@ -1,6 +1,3 @@ -/** - * External dependencies - */ import { addFilter } from '@wordpress/hooks'; import { extractOrderAttributionData } from 'wcstripe/blocks/utils'; diff --git a/client/express-checkout/compatibility/wc-product-page.js b/client/express-checkout/compatibility/wc-product-page.js new file mode 100644 index 000000000..99e112509 --- /dev/null +++ b/client/express-checkout/compatibility/wc-product-page.js @@ -0,0 +1,24 @@ +import jQuery from 'jquery'; +import { addFilter } from '@wordpress/hooks'; + +/** + * Sets the product ID when using the BlocksAPI and single variation form is present. + */ +addFilter( + 'wcstripe.express-checkout.cart-add-item', + 'automattic/wcstripe/express-checkout', + ( productData ) => { + const $variationInformation = jQuery( '.single_variation_wrap' ); + if ( ! $variationInformation.length ) { + return productData; + } + + const productId = $variationInformation + .find( 'input[name="product_id"]' ) + .val(); + return { + ...productData, + id: parseInt( productId, 10 ), + }; + } +); diff --git a/readme.txt b/readme.txt index 6ce255e1b..a2621d435 100644 --- a/readme.txt +++ b/readme.txt @@ -111,6 +111,7 @@ If you get stuck, you can ask for help in the [Plugin Forum](https://wordpress.o == Changelog == = 9.2.0 - xxxx-xx-xx = +* Dev - Replaces part of the StoreAPI call code for the cart endpoints to use the newly introduced filter. * Dev - Add new E2E tests for Link express checkout. * Add - Add Amazon Pay to block cart and block checkout. * Fix - Remove intentional delay when displaying tax-related notice for express checkout, causing click event to time out.