gerard_code

[modern fossil]

👋 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/1272576993400979486

📝 Have more to share? Add more details, code, screenshots, videos, etc. below.

[steep oar]

Hello

First, have you done this in test mode?

You shouldn't be implementing this in live mode so you shouldn't be getting emails from Amazon.

So first step is to do this in test mode.

Second, what error are you seeing?

[wicked crypt]

yes i have tried it in test mode but i think there is something wrong in my code
Payment failed:
function paymentFailed(n)
client.js:1:909
error client.js:1
error next-dev.js:27
setupStripe BillingDetailsForm.tsx:109

can i post my entire useEffect function here ?

[steep oar]

Yep

[modern fossil]

🧑‍💻 How to format code on Discord

Inline code: wrap in single backticks (`)

This:

The variable `foo` contains the value `bar`.

Will turn into this:

The variable foo contains the value bar.

Code blocks: wrap in three backticks (```)

Also, you can specify the language after the first three backticks to get syntax highlighting.

This:

```javascript
function foo() {
return 'bar';
}
```

Will turn into this:

function foo() {
  return 'bar';
}```

Notes about **code blocks**:
- Specifying the language is optional (e.g., you can omit `javascript` in the example above)
  - If you don't specify the language you won't get syntax highlighting
- When you're inside a code block (after you type \`\`\`) the `Return`/`Enter` key will add a new line instead of sending your message
  - Once you end the code block `Return`/`Enter` works normally again

You can [read more about message formatting on Discord's website.](https://support.discord.com/hc/en-us/articles/210298617)

[steep oar]

Is this your client.js file?

Err ignore that

I meant your BillingDetailsForm

[wicked crypt]

yes this is the BillingDetailsForm

[steep oar]

Okay and what is on line 109?

[wicked crypt]

you mean the alert ?

[steep oar]

Don't know... I can't see line numbers for your code

But that is where the error is being thrown

So you need to look at that part of your code

[wicked crypt]

    try {
                    if (event.paymentFailed) {
                        console.error("Payment failed:", event.paymentFailed || 'Unknown error');
                        alert("Payment failed. Please try again.");
                        return;
                    }

                    const paymentMethod = event.paymentMethod;
                    if (!paymentMethod) {
                        console.error("Payment method is undefined.");
                        alert("Failed to process the payment. Please try again.");
                        return;
                    }

this part ?

[crisp wren]

Hi 👋

I'm stepping in as my colleague needs to go.

[wicked crypt]

hi @crisp wren 🙂

@steep oar thank you sir and have a good day

[crisp wren]

So my colleague is stating the error propagates from line 109 on your BillingDetailsForm. So i think you would want to start adding more logging statements before that error is reached so you can see exactly what values are being passed and make sure it's what you expect.

[wicked crypt]

i just realised something the amount and currency are null in stripe logs

could that be the issue ?

"object": "express_checkout_element.session",
"amount": null,
"approved_at": null,
"currency": null,
"encoded_session":

[crisp wren]

Yup, that could definitely cause a problem

[wicked crypt]

const elements = stripe.elements({
                mode: 'payment',
                amount: cart.totalAmount * 100,
                currency: 'usd',
                paymentMethodTypes: ['amazon_pay', 'card'],
            });

i am sending the price and currency...

[crisp wren]

Hmmm.... 🤔

And the log you shared is generated from what line?

[wicked crypt]

89

[crisp wren]

That doesn't help me since there are no line numbers, can you just share the line?

[wicked crypt]

yes

damn too small

[crisp wren]

Yeah, I meant share the actual line of code. Like copy/paste the text

[wicked crypt]

lets see if neovim lets me

[crisp wren]

Sorry but I'm not going to look through all of that

[wicked crypt]

Payment failed:
function paymentFailed(n)client.js:1:909
error client.js:1
error next-dev.js:27
setupStripe BillingDetailsForm.tsx:101
_emit v3:1
_emit v3:1
_emitEvent v3:1
M v3:1
_emit v3:1
_emit v3:1
_handleMessage v3:1
l v3:1
_setupPostMessage v3:1

[wicked crypt]

No worries 🙂

[crisp wren]

Okay so now it's line 101? I'm guessing you removed some lines in your code?

[wicked crypt]

yeah i was running some tests

[crisp wren]

Okay but you are still throwing an error for the same function on line 101. Can you share just line 101?

[wicked crypt]

alert("Payment failed. Please try again.");
its just an alert

                    if (event.paymentFailed) {
                        console.error("Payment failed:", event.paymentFailed || 'Unknown error');
                        //Line 101
alert("Payment failed. Please try again.");
                        return;
                    }

[crisp wren]

Got it. So you need to look upstream for more details about why the payment failed.

[wicked crypt]

aha, how can i do that? is there a documentation ?

[crisp wren]

Not really, what I'm suggesting is you debug your code. So you need to start investigating what steps lead to this error, what the values being passed to functions are and what kind of behavior you observe. You may need to set breakpoints and manually step through it.

[wicked crypt]

i see, i'll try to do that.
thank you so much for your time.