-
Notifications
You must be signed in to change notification settings - Fork 69
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: tokenized ECE product page compatibility #9877
feat: tokenized ECE product page compatibility #9877
Conversation
Test the buildOption 1. Jetpack Beta
Option 2. Jurassic Ninja - available for logged-in A12s🚀 Launch a JN site with this branch 🚀 ℹ️ Install this Tampermonkey script to get more options. Build info:
Note: the build is updated when a new commit is pushed to this PR. |
Size Change: -502 B (0%) Total Size: 1.34 MB
ℹ️ View Unchanged
|
} | ||
); | ||
} ); | ||
addFilter( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This won't really work until https://github.com/woocommerce/woocommerce-deposits/issues/665 is merged. But adding it nonetheless.
@@ -42,8 +52,8 @@ addFilter( | |||
} | |||
); | |||
addFilter( | |||
'wcpay.payment-request.cart-add-item', | |||
'automattic/wcpay/payment-request', | |||
'wcpay.express-checkout.cart-add-item', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You'll notice that I had to rename a bunch of these, for consistency
import { getUPEConfig } from 'wcpay/utils/checkout'; | ||
import expressCheckoutButtonUi from './button-ui'; | ||
import { | ||
transformCartDataForDisplayItems, | ||
transformCartDataForShippingRates, | ||
transformPrice, | ||
} from 'wcpay/tokenized-express-checkout/transformers/wc-to-stripe'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Had to fix the path, to ensure the correct files were enqueued
|
||
/** | ||
* Object to handle Stripe payment forms. | ||
*/ | ||
const wcpayECE = { | ||
getAttributes: function () { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
No longer needed
* | ||
* @return {Promise} Promise for the request to the server. | ||
*/ | ||
addToCart: () => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
No longer needed - the Store API takes care of this
@@ -219,7 +192,7 @@ jQuery( ( $ ) => { | |||
startExpressCheckoutElement: async ( options ) => { | |||
const stripe = await api.getStripe(); | |||
const elements = stripe.elements( { | |||
mode: options.mode ?? 'payment', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
options.mode
was never passed along
@@ -286,11 +259,15 @@ jQuery( ( $ ) => { | |||
} | |||
|
|||
// Add products to the cart if everything is right. | |||
// TODO ~FR: use cartApi |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
✅
} | ||
|
||
const clickOptions = { | ||
// `options.displayItems`, `options.requestShipping`, `options.requestPhone`, `options.shippingRates`, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just a note, for clarification, since it took me a bit to detangle
@@ -84,42 +139,11 @@ jQuery( ( $ ) => { | |||
} ); | |||
|
|||
let wcPayECEError = ''; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I have a question about this message here: p1733843761767399-slack-C01BZUL57SQ
Fixes part of #9722
Changes proposed in this Pull Request
Implementing the Tokenized ECE implementation on the product page.
The compatibility w/ WooCommerce Deposits is currently blocked due to https://github.com/woocommerce/woocommerce-deposits/issues/665
The changes have been ported from the Tokenized PRB implementation (in
client/tokenized-product-request
).The tests are already present in the
ExpressCheckoutCartApi
andExpressCheckoutOrderApi
.Testing instructions
npm run start
)wp-admin
should reflect the cart contents, the currency being used, and the totalsnpm run changelog
to add a changelog file, choosepatch
to leave it empty if the change is not significant. You can add multiple changelog files in one PR by running this command a few times.Post merge