#adriana_docs
celest cloudBOT
👋 Welcome to your new thread!
⏲️ We'll be here soon! Typically we respond in a few minutes, but sometimes we might take a bit longer if the server is busy or if you have a particularly tricky question.
⏱️ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can always start a new thread if you have another question.
🔗 This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1436062096893935778
📝 Have more to share? Add more details, code, screenshots, videos, etc. below.
wispy ether
hello! fyi the server is a little busy atm but i will get back to you asap
wispy ether
ok, typically if you want to add a fee and have a customer confirm it you would want to follow this flow
https://docs.stripe.com/payments/build-a-two-step-confirmation
can you read through that guide and let me know if you have any additional questions afterwards?
lofty nymph
I don't have a customer confirm, I only have the form page and a thank you lightbox
wispy ether
regardless you're going to need to follow a flow that creates a ConfirmationToken, inspects the card brand, and then creates a PaymentIntent afterwards (possibly like this flow)
when you say you don't have them confirm, can you explain more?
it might be helpful if you can outline exactly what you want the customer to see and what steps you want to perform at each stage
celest cloudBOT
lofty nymph
I have a donation form page, so this are the steps
- The donor choose an amount
- The donor could choose cover the fee ( this is a checkbox field )
- The donor fill the card information up
- I would like to detect the card's brand to display the fee covered, before processing the transaction
- The donor click the give now button ( the label of the button displays the final amount to charge )
- In this step I create the confirmation Token but then the amount will change. I would like get the brand before the donor click the give now button to inform the final amount to charge.
It does make sense?
zealous saffron
Hi 👋
I'm stepping in as my colleague had to go. Give me a sec to review this.
I would like to detect the card's brand to display the fee covered, before processing the transaction
The only way to achieve this part is by using a Confirmation Token as my colleague mentioned to access the card brand.
Given the description of your flow, I think the two step confirmation process we describe here will allow you the control you want and allow you to share that information with your customers.
lofty nymph
Ok, I'm gonna talk with the lead of the project about this, thank you for your help.
Question:
If I have another doubt related to custom payment methods, can I ask here?
zealous saffron
Sure. Just to be clear, you're referring to this, right? https://docs.stripe.com/payments/payment-methods/custom-payment-methods
lofty nymph
yes, it is.
zealous saffron
Okay. Ask away
lofty nymph
How can I dynamically show/hide the custom payment methods?
I’ve tried customPaymentMethods and excludedPaymentMethodTypes parameters from the elements.update method but when I used customPaymentMethods and I clear the array because no custom payment method is available for a subscription the payment elements disappears and I got a console error, something related to the element can’t get the name of the Custom Payment method and when I used the excludedPaymentMethodTypes I got a console error because I’m using a not allowed key payment method ( It looks like the custom payment methods are no supported )
zealous saffron
Are you referring to the Payment Element integration?
lofty nymph
yes
zealous saffron
Can you share the JS code you are using to create the elements instance, like we show here?
I think you would dynamically need to configure the options parameter for the elements instance so that the customPaymentMethods property is only added to it when Custom Payment methods are valid
lofty nymph
here is the JS code
celest cloudBOT
lofty nymph
the customPaymentMethods parameter is a computed data in the code (I'm using VUE), and sometimes return an empty array or an array with the custom payment methods
zealous saffron
Yeah so since using an empty array will cause the issue you mentioned, you should dynamically build the options object before calling stripe.elements() and exclude the customPaymentMethods param if the list is empty.
I use Vue (with Nuxt) and I often need to dynamically build options objects
lofty nymph
and can I use stripe.update() to update the customPaymentMethods? because that custom methods depends if the donor choose a one time charge or a subscription charge
zealous saffron
Yes, that is one of the parameters accepted by the elements.update() function
lofty nymph
is in the update function when I got the console error
in the creation everything works fine
karmic shell
Can you send the exact error message that that call throws for you?
lofty nymph
Cannot read properties of undefined (reading 'displayName')
but is just when I update the element and the customPaymentMethods is an empty array in the options for elements.update(options) method
karmic shell
Gotcha, so empty array is accepted when instantiating elements, but not when calling the update. Going to test this out on my side, have you tried passing null or an empty string? Not immediately sure how Stripe.js treats unsetting things, but other places in our SDKs work with that syntax
karmic shell
Interestingly this just works for me if I pass an empty array.
If you print out the options object before using it, is it showing the values here that you expect? Trying to think of what the difference here may be
elements.update({
mode: 'payment',
amount: 1099,
currency: 'usd',
customPaymentMethods: []
});```
karmic shell
Do you have a public test page where I can reproduce this myself?
lofty nymph
yeap, let me push the code ...
celest cloudBOT
lofty nymph
here is the url https://ffz-test-plugin.mysitebuild.com/donation/fauna-full/ the elements.update() method triggers when the currency is changed from USD to EUR (I would like the DAF custom payment method was hidden )
karmic shell
Thank you, I created a JSFiddle to show my working but incredibly the exact same code from my working test site gets your error here
https://jsfiddle.net/fs9Lkzaj/10/
I think at this point we will need to escalate this to a support case.
celest cloudBOT
Hello @lofty nymph, we have sent you a direct message, please check it at https://discord.com/channels/@me/1436119793181655061
- 🔗The message has instructions on how to open a direct support case with our Developer Support team, in order to help you more effectively.
karmic shell
Can you let us know when you've completed the above?
lofty nymph
yep, I'm on it
Done :), and I got an email with the confirmation of the support and this is de ID: em_hxq29ne7n3gruomhoirecfyuiaf2s1
zenith zinc
Perfect, we've escalated the Case. We'll make sure to keep you updated on our findings. Appreciate your patience on this one 🙂
lofty nymph
Thank you so much for your help. Have a great rest of day :).