This may not be the ideal place to post this, but I can’t figure out how to report an advanced bug like this to Wix, so I’ll do so here in case anyone has a solution (or Wix support see it).
There’s a weird bug with Safari Desktop when using wixPay.startPayment(). If there is a textbox anywhere else on the page and I give that textbox focus and then leave focus, the payment popup does not display correctly.
For example, here’s a super simple page like this:
The textbox does nothing. I have simply dragged it onto the page with no code attached to any of its events.
The button has some simple payment code and nothing else:
import wixPay from ‘wix-pay’ ;
import { createMyPayment } from ‘backend/test.jsw’ ;
export function button1_click_1 ( event ) {
createMyPayment ()
. then (( payment ) => {
return wixPay . startPayment ( payment.id );
});
}
The createMyPayment() function on the backend and looks like this:
import wixPayBackend from ‘wix-pay-backend’ ;
export function createMyPayment () {
return wixPayBackend . createPayment ({
items : [{
name : “Product Name” ,
price : 9.99 ,
quantity : 2
}],
amount : 19.98
});
}
This is all simple code taken directly from the docs.
If I immediately click the button the poup works as expected:
However, in Safari Desktop, if before clicking the button I give the textbox focus and then leave focus (e.g. hit the tab key to leave focus), then when I click the button I get this:
The form is covered by what appears to be another empty lightbox. I have to click anywhere on the screen to see the form, and everything works as expected.
There is no other code but what I posted above. No custom validation, just a text box and a button that I have dragged onto a page.
This only happens on Safairi Desktop. Chrome is fine. Nothing special in the JS console.
Any clues?