#abhupray
solemn dawnBOT
Hello! We'll be with you shortly. Below are links to other discussions we've had with you in the past week in case you want to review that information. If your question is related to one of these previous discussions, please provide a comprehensive summary of the current state and what you need help with now. We help many users simultaneously, so a summary allows us to resolve your issue as soon as possible.
- abhupray, 17 minutes ago, 28 messages
boreal bough
I am using srtipeJS to subscribe card using confirmSetup function and I am getting following error code:"setup_state_unexpected_state" and message:"a processing error occured"
this is my code in vue
vagrant helm
Can you share the request ID (req_xxx)? You can find it here https://dashboard.stripe.com/test/logs
boreal bough
req_g1DThX62dbZTkL
vagrant helm
I don't see an error in this request.
Where/when exactly do you see the error you mentionned above?
hidden shore
Hi! I'm taking over from my colleague. Please, give me a moment to catch up.
boreal bough
ok I have shared the code block above can you tell me how should I call the confirmSetup() function along with parameters that needs to be passed
hidden shore
What Stripe guide are you following?
boreal bough
as there is no officical guide for vue I am following this react guide
can you tell me how should I call the confirmSetup() function
hidden shore
I see you're passing a payments attribute to the object literal, however, it's not a valid attribute. It needs to be elements.
await this.stripe.confirmSetup({
payments,
clientSecret:token,
confirmParams:{
return_url:"https://eat-express.pages.dev/thankyou-outlet"
}
})
I understand, but using a variable like this also gives the name to the attribute:
{ payments } is { payments: payments }
But it should be:
{ elements: payments }
getting new error now
Uncaught (in promise) IntegrationError: Invalid value for stripe.confirmSetup(): elements should be an Elements group. You specified: object.
hidden shore
I believe you should provide all elements, not just card element.
boreal bough
I have only card element
hidden shore
I mean, the elements variable: https://stripe.com/docs/payments/accept-a-payment-deferred?platform=web&type=setup&client=html#add-the-payment-element-to-your-checkout-page
I don't see it in your code. But basically the object you use to create the cardElement
boreal bough
It's a react library and I am using stripeJS
hidden shore
How are you creating the cardElement?
boreal bough
using elements function
this.stripe = await loadStripe(process.env.VUE_APP_STRIPE_PUBLISHABLE_KEY);
const elements = this.stripe.elements();
this.cardElement = elements.create('card');
this.cardElement.mount(this.$refs.cardElement);
hidden shore
const elements = this.stripe.elements();
You need to put thiselementsvariable into the call toconfirmSetup().
boreal bough
ntegrationError: Invalid value for stripe.confirmSetup(): elements should have a mounted Payment Element or Express Checkout Element. It looks like you have other Elements on the page. Refer to https://stripe.com/docs/js/setup_intents/payment_method to confirm a Setup Intent by payment method.
new error
hidden shore
It might be that you need to use the Payment Element for this flow. You could try using confirmCardSetup() - here you should actually pass the cardElement: https://stripe.com/docs/js/setup_intents/confirm_card_setup
But I strongly recommend you to look into using Payment Element.
boreal bough
ok I switchd to payment element and it's still showing the same error
hidden shore
What did you change exactly?
boreal bough
this.stripe = await loadStripe(process.env.VUE_APP_STRIPE_PUBLISHABLE_KEY);
const options = {
mode: 'setup',
currency: 'usd',
// Fully customizable with appearance API.
appearance: {/.../},
};
const elements = this.stripe.elements(options);
this.cardElement = elements.create('payment');
this.cardElement.mount(this.$refs.cardElement);
switched the element from card to payment
hidden shore
And how you confirm now?
hidden shore
Happy to help.