#kuvana

1 messages Β· Page 1 of 1 (latest)

tired muskBOT
olive finch
#

This seems like a fairly complex question. Specifically:

  1. Can you give a lot more detail?
  2. Specific steps that are happening and what the behavior is that you're seeing?
  3. What behavior are you expecting?
timid comet
#

Here are the options for the <Element /> Wrapper

  const [options, setOptions] = useState<ElementOptions>({
    amount: requestForPayment?.amount || 50,
    setupFutureUsage: undefined,
    mode: 'payment',
    currency: 'usd',
    appearance: appearance,
    onBehalfOf: requestForPayment?.onBehalfOf,
  });
#

here is my state update depending on if a Save Card checkbox was checked

      setOptions({ ...options, setupFutureUsage: shouldSaveCardOnFileFieldProps.value ? 'off_session' : undefined });
#

I see the wrapper updating in the console when going from off_session -> on_session or undefined -> off_session but it does not update when going from off_session -> undefined

#

I'm watching this API call

https://api.stripe.com/v1/elements/sessions?key=key&type=deferred_intent&locale=en-US&deferred_intent[mode]=payment&deferred_intent[amount]=7800&deferred_intent[currency]=usd&deferred_intent[setup_future_usage]=off_session

olive finch
#

I think you need to update the state of the Element. Is this the Payment Element? Or a different one?

timid comet
#

Payment Element, but I am updating the state of the Element.

olive finch
timid comet
# 
    <Elements
      stripe={stripePromise || null}
      options={options}
    >

options is a state that gets updated in time. I see it updating for everything except for setupFutureUsage: undefined

tired muskBOT
timid comet
#

Specifically the dynamic updates is what I'm having an issue with only in regards to setting setupFutureUsage: undefined after setting it to off_session

olive finch
#

Right, but if you're updating the options object based on a radio-button, the Payment Element doesn't know to get those options again. The docs you link to about dynamic updates even mention that you have to use elements.update(). They give an example of updating the amount:

elements.update({amount: newAmount});

timid comet
#

I'm not using HTML + js. I'm using React so it doesn't use .update

olive finch
smoky citrus
#

πŸ‘‹

#

Are you saying when you provide new options to the (React) <Elements /> provider that the changing setupFutureUsage has no effect?

timid comet
#

Just to be clear, the PaymentElement does not accept these options. It's the <Element /> wrapper around PaymentElement that I am modifying.

#

And it does update when I modify setupFutureUsage from undefined to off_session to save card on file. But it does not update when I modify setupFutureUsage from off_session to undefined

smoky citrus
#

right - thanks. Editted above.

#

Out of curiosity, does setting it to null lead to any different behaviour?

#

If you happen to live a public reproduction of this, that would be helpful. Something like a glitch or codesandbox that can be tested /inspected.

timid comet
#

This particular flow is only on dev, and would be difficult to push into a codesandbox. I can try null, but the field says it requires off_session on_session or undefined

#

Yeah, null gives a typescript error from Stripe

# 
Type '"off_session" | null' is not assignable to type '"off_session" | "on_session" | undefined'.
  Type 'null' is not assignable to type '"off_session" | "on_session" | undefined'.ts(2322)
#

I am just trying to have Affirm reappear. But if this is an issue, I'll see if I can move the update method to later in the flow so it doesn't make Affirm disappear

smoky citrus
#

Hmm this feels like it ought to be possible to update as you're doing.

timid comet
#

That's what I would expect. but the API just doesn't update when setting it to undefined. Every other value triggers an api call to that session api, just not when setupFutureUsage is set to undefined after already being set to off_session once

#

I can move this for now. But if this could be mentioned to a dev team that would be helpful to see if this is designed behavior or if it's a bug

smoky citrus
#

Can you explicit remove the setupFutureUsage prop from your options object?

timid comet
#

I can try. Is there an option to do that with the elements.update method

smoky citrus
#

Not explicitly, but you can try omitting it either via hardcoded function or via omitting it dynamically

timid comet
#

Got it. I'll give that a try. Thanks for the info. I have a few options moving forward now.

smoky citrus
#

I think there's still a potential bug/improvement for us to address here, I would expect setting setupFutureUsage: undefined to work

timid comet
#

Yeah, if you can pass that along I'd appreciate it

tired muskBOT
smoky citrus
#

Going to try to build a repro of this to file

smoky citrus
#

Even if I explicitly remove the setupFutureUsage key from the options

#

but the key bits are:

const {setupFutureUsage, ...rest} = elementsOptions;
      setElementsOptions({...rest}); // to omit setupFutureUsage
...
<Elements stripe={stripePromise} options={elementsOptions}>
tired muskBOT
smoky citrus
#

I'll report this internally so that we can look into fixing it πŸ‘

smoky citrus