i realize some of my error
first, i was experiencing e.preventDefault() is undefined error but after i moved the javascript to head section as against just before tag, removing the document.ready() from the script as explained here did the trick for me.
i use sameSite=None and requireSSL=true, but the cookie
rollbar.umd.min.js:2 Cookies are not authorized, we will not send any data
error persist, it doesn't stop it from working. initially i taught the cookie was preventing the payment api but which is not if you really need to send cross-site cookie then you'll need to solve cookies are not authorized error. but for me it works, thanks @Bruce Zhang
this step by step guide also helps