tanner_unexpected

[supple imp]

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

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

[azure violet]

For reference, this is what happens in the UI.

[sharp jackal]

hi there, do you happen to have a public test environment where I can see the problem?

[azure violet]

I can share the credentials to an auth test development page, but only through private DM. We do have public environment, but it is on production and there is no way to test this unless you make a payment.

[sharp jackal]

yes if you feel comfortable doing so you can DM me the credentials. otherwise I can try to reproduce this in my own test environment

looking at your screenshots, does the address form just disappear when you select to pay with a new card?

[azure violet]

Yes

[sharp jackal]

ok, and for the billing address, is the old one being saved onto the new payment method? if so can you provide payment method ids (pm_1234) for the saved one and then the one with the wrong address?

[azure violet]

No, I am not able to saved a new payment because the billing form is not displayed. pm_1TWH8OFKvb6W5GcFXmkhj4Ep

[sharp jackal]

ok, so the problem isn't duplicated addresses, it's just that the address form is missing? can you share the relevant front end code you're using to display the address form?

and you're unable to submit payment when supplying a new card? do you see any error messages?

[azure violet]

pm_1TWI8lFKvb6W5GcFQpbIEE4s Oh wait i tried a second time and it worked 😕 but it seems like the billing info is null.

evt_1TWI8mFKvb6W5GcFMU1SSKlU, yea looks like only US is populated, but that comes from our region data.

[sharp jackal]

can you share the code you're using on your front end to display the address form / payment element?

[azure violet]

const handleOnChange = (e: StripeAddressElementChangeEvent) => {
    const { complete, value } = e
    const { address, firstName, lastName, name } = value

    if (complete) {
      if (firstName && lastName) {
        setBillingName(firstName + " " + lastName)
      } else if (name) {
        setBillingName(name)
      }

      if (billingAddress && isSameTaxAddress(billingAddress, address)) return

      if (address.country) {
        setBillingAddress(address)
        setCountry(address.country)
      }
    } else {
      setBillingAddress(null)
      setCountry("")
    }
  }

const handleOnBlur = async () => {
    const addressElement = elements?.getElement("address", { mode: "billing" })
    if (!addressElement) return

    const { complete } = await addressElement.getValue()
    if (complete) {
      trackEvent(GoogleAnalyticsEvents.addBillingInfo, {})
    }
  }

const billingElementOptions: StripeAddressElementOptions = {
    allowedCountries: isIntlPurchaseAllowed ? [] : countryCodes,
    mode: "billing",
    display: {
      name: "split",
    },
  }

<AddressElement
        onChange={debounce(handleOnChange, 300)}
        onBlur={handleOnBlur}
        options={billingElementOptions}
      />

---

const handleOnChange = (e: StripePaymentElementChangeEvent) => {
    if (e.complete) {
      setPaymentType(e.value.type)
      setIsValidPayment(true)
    } else {
      setIsValidPayment(false)
    }
  }

const paymentElementOptions: StripePaymentElementOptions = {
    layout: {
      type: "accordion",
      radios: true,
    },
    terms: {
      card: "never",
    },
  }

<PaymentElement
        onChange={handleOnChange}
        options={paymentElementOptions}
      />

[sharp jackal]

can you also share the code for the handleOnChange and handleOnBlur functions?

[azure violet]

Edited the previous message.

Overall, its just state setting so we know that the forms are complete and checkout is ready.

[sharp jackal]

thanks, yeah I'm not seeing anything incorrect in your code here, I'm going to reach out to our internal product team to see if something recent might have caused this

[azure violet]

We also have not pushed any changes within the last 23 hours, so it is odd that this test would fail when the billing form has displayed before.

Thanks!

[void zodiac]

Hi there - I'm taking over for denton here, who needs to run

As they mentioned, they reached out to our product team and if you want to wait a little while I can see if they are able to respond quickly, and if they are not, we'll need to convert this into an email thread

[void zodiac]

They're looking now and we have a potential culprit PR, but still investigating

Yeah, okay, we're reverting the change that caused this

[azure violet]

Thank you!

I'm glad you guys found it. 😄

[void zodiac]

Yeah it looks like the idea behind the change is when you're using this setup, the customer can still select the saved billing address even if they are adding a new card, which will be nice, but there's a bug it seems

But this should be resolved when the revert is deployed

[azure violet]

I'll let you know if our QA team finds anything else!

[void zodiac]

Thanks! We find lots of bugs this way 😄