zpapier_api

[shy needle]

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

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

[hexed hound]

You can test it yourself in our PR app here: https://preview-pwrazjss.porter-preview.papier-staging.com/

You will need to first register with a new account, then add 1 item (like a notebook) to your basket. You should then be able to see the button show up in the basket are (in Chrome).

[nocturne sandal]

Hi, let me help you with this.

[hexed hound]

Hi Vanya, I'm having a play in my local with a secure tunnel and I am getting some new log errors I'm looking into now

[nocturne sandal]

Can you please make a screen recording of this behavior?

[hexed hound]

Will do

Okay I'm getting a new console error I haven't seen before now, I think it's because I was testing it with a fake address, but when I use a real address (like in this recording) it throws an error (weird that I wasn't getting an error with a fake address either). Let me dig into this now because it's our code causing the issue, if I run into any other problems I'll let you know?

Could this be giving us problems? The fact that we're on a legacy wallet integration?

[nocturne sandal]

Are you only adding the Payment Request Button now?

I.e. is this an existing integration?

[hexed hound]

This is existing

We have it for Apple Pay, but I'm just enabling Google Pay now

[nocturne sandal]

We generally recommend using Express Checkout Element instead now: https://docs.stripe.com/elements/express-checkout-element/accept-a-payment

[hexed hound]

can you see in the video how there's a lag waiting for the shipping options to show when the modal first launches, have you seen that before / could that be fixed in the express checkout?

Because it's not the best UX for our customers

[hexed hound]

Or at least it's a bit annoying that the customer can click "PAY" when there is no shipping options, in Apple Pay, for example, the user can't actually pay until they are presented with shipping options

[exotic flax]

What's the error in your screen recording in your handleOptionChange method?

[hexed hound]

That's coming from here (handleOptionChange is being triggered when the user changes their address but the shippingOption is undefined hence shippingOption.id is throwing the error):

  this.paymentRequest.on("shippingoptionchange", this.handleOptionChange);

async handleOptionChange(ev) {
  const { shippingOption } = ev;

  if (shippingOption) {
    const shippingData = await this.setShippingOption(`shippingOption.id`);

    if (shippingData) {
      ev.updateWith({
        status: "success",
        displayItems: this.displayItems,
        total: {
          amount: Math.round(this.total.raw * 100),
          label: "Total:"
        }
      });
    }
  }
},

It's odd because we don't get this error / behavior with Apple Pay, I am trying catch this error and see if we get any luck

[exotic flax]

What's the shape of the ev parameter when handleOptionChange fires in that scenario?

[hexed hound]

I guess ev is the event passed in from the shippingoptionchange event?

[exotic flax]

I suspect the UI is hanging because of that error where you're trying to read the undefined id key. You need to handle that in your code

[hexed hound]

From here: this.paymentRequest.on("shippingoptionchange", this.handleOptionChange);

Yeah i think you're right

Let me have a go at handling that a bit more gracefully

[exotic flax]

Yes, that's what Google Pay makes available to us. So I guess there's no id key so you need to protect around that

[hexed hound]

See if that helps

Okay I'll take a look, thanks.Do you generally recommend we move over to Express Checkout?

(Not that that would necessarily fix this)

[exotic flax]

Yes we generally recommend migration to ECE now. PRB is deprecated

[hexed hound]

Ah okay interesting, thanks I'll take a look!