goldenboy

[fierce scaffold]

What does <CheckoutForm /> look like

[cosmic pumice]

u know what's really weird?

[fierce scaffold]

Can you just remove the <PaymentElement /> from your Framer Motion wrappers

[cosmic pumice]

the checkoutform shows no signs of being called or rendered at all

check this out

it's literally empty

nothing within the Elements container is being filled with anything

look

not even the test button is being rendered

it's literally just empty

the <Elements> wrapper acts basically like a black hole

[fierce scaffold]

Then I'd guess that your conditional statement is preventing the rendering. What is your stripe variable there?

And data, too I guess.

[cosmic pumice]

stripe is just the stripe promise, I should have named it stripepromise

[fierce scaffold]

Right, but has it resolved?

You'll need to share more of your code here really

I'd remove that conditional around your <Elements> provider

[cosmic pumice]

the code is pretty much copied from the stripe repo, but you're right in the regard that the conditional part seems to be the culprit tho I could swear that I tested it before with a <div>test</div> component and it was being rendered properly that's why I assumed the conditional to be working, but I just tested it again without the elements wrapper and it's not rendering, so I will now do some tests and report back

[fierce scaffold]

Right, but I don't have that code to hand and 'pretty much copied' doesn't sound like a direct clone (plus you've made changes, like adding Framer).

[cosmic pumice]

I meant the core logic not the stylings

replacing motion.div with div changes nothing, I just tested it, it's not fundamentally different from a normal div except that it allows for more easy animations and stuff

[fierce scaffold]

I know what Framer Motion is. My point is you've clearly adapted some things, and perhaps you made a change that has, unbeknownst to you, broken it.

Like, have you logged your stripe and data values. What's their output?

[cosmic pumice]

the core logic is unchanged and no error is shown in the console, where I track all values, but I just noticed there is something wrong with the react-query

[fierce scaffold]

That creates the Payment Intent?

[cosmic pumice]

yes, the network console shows that it correctly receives the secret, but then a caching issue causes weird behavior, I think I know what's up, give me a sec

[fierce scaffold]

perfect!

[cosmic pumice]

thank you by the way, I need to read the react-query docs, but consider the problem solved, ty!