#usmseong_29857

1 messages · Page 1 of 1 (latest)

twin crestBOT
#

Hello! We'll be with you shortly. Below are links to other discussions we've had with you in the past week in case you want to review that information. If your question is related to one of these previous discussions, please provide a comprehensive summary of the current state and what you need help with now. We help many users simultaneously, so a summary allows us to resolve your issue as soon as possible.

fleet turtle
#

Hi

solid wagon
#

Hi there 👋 are you seeing any sort of error when you try to do that? I recall hearing of issues in the past when Apple Pay isn't being handled directly from a user input or very quickly after one.

worthy sparrow
#

nope no error and this is a different issue

#

when I pass onClick handler to PaymentRequestButtonElement, I can do some client side validation before opening the apple pay window right

#

but I want to delegate this to react-hook-form's handleSubmit

solid wagon
#

Hm, I'm too familiar with React, so I'm not sure I'm grasping what you're describing. I don't see the sample code from you initial post in the file you shared, so I'm not sure I understand what you're describing.

worthy sparrow
#

could you please pass this inquiry to somebody in your team who's familiar with React by any chance

#

how do I make handlePrePlatformPaymentRequest, the function I pass as onclick to PaymentFormButtonElement, progmatically open apple pay window?

sudden plinth
#
  • do you have a link to the page where this happens so we can replicate/test in our browsers?
  • are there any console errors/warnings when this happens?

Note that you can not open the PaymentRequest UI from custom code, the browser will error if it's not directly from a UI action. I strongly expect if you check your console you'll that(an error telling you about a 'gesture handler').

worthy sparrow
#
  • nope this site is private that requires vpn.
  • no errors/warnings in console
#

ok so with that in mind, how do I run a custom validation function before opening the window/

#

?

sudden plinth
#

can you put it somewhere public like a codesandbox/glitch.com etc so we can replicate?

worthy sparrow
#

sorry this requirse quite of settings for react hook form. but it's really when you want to run some client side validation before opening the payment request UI

#

I can do so by passing onClick prop to PaymentRequestButtonElement. and this works

#

but I also want to use handleSubmit from 'react-hook-form'

#

const handlePrePlatformPaymentRequest = () => {
// even if the validation by react hook form's "handleSubmit" is success, it got stuck here. and not opening the apple pay/google pay window
};

<PaymentRequestButtonElement options={{ paymentRequest } onClick={handleSubmit(handlePrePlatformPaymentRequest)} />

sudden plinth
#

yeah that might be not possible, because if you do something else like make a network call in the event handler of the click, then the browser will lose the context of it being a user action and will block showing the PaymentRequest UI

worthy sparrow
#

no network call in the event handler

sudden plinth
worthy sparrow
#

it's just client side validation without making any call

sudden plinth
#

any progress on putting this code up somewhere in minimal form that replicates it?

worthy sparrow
#

i'm afraid that's something I cant do quickly as it requires react hook form set up. ok thanks for the help! i'll try creating my own button

sudden plinth
#

ah also

#

You must call this function within 1 second if you handle the click event.
and presumably you don't do that at all

#

argh actually never mind

#

different element, the docs have a bad link.

worthy sparrow
#

gotcha thank you