Sqpayment inputs stopped working in Chrome

Hello, I have an urgent issue which needs to be addressed.

I am using the sqpaymentform on my site at https://www.taskhandle.io/index.php?p=subscribe (you must be logged in to see the form, you can create an account by clicking register at the top).

The sqpayment form works in Microsoft Edge, and until an hour ago it was working just fine in Chrome. But now the form is not working in Chrome, I am not able to focus on the inputs for Card Number, MM/YY, CVV or Postal. There are no errors being shown in the dev tools console (There is a violation: [Violation] ‘setTimeout’ handler took 245ms).
When I access the sqpaymentform from Chrome, the input fields do not even have placeholders, and I am not able to enter any information.

The form is still in sandbox btw, I am going to move it to production once this issue is resolved.

Please help urgently,
Justin

Hi @jhaubrich welcome to the forums!

Would you be able to provide a test account for us to login to your site? I have not heard of other issues around the Square Payment Form not working in Chrome so I don’t believe there’s an outage currently.

1 Like

Hi @sjosy,

It looks like it started working again. I guess that won’t be necessary. You can mark this issue as closed. I will let you know if I encounter any more issues.

Thank you,
Justin

1 Like

Hello @sjosey, I noticed that the issue has been recurring.

The payment form works most of the time, but sometimes it is not working. I have a test account available for you to log in and take a look at the issue.
Login Email: [email protected]
Password: test3

The payment form is located on the “Subscribe” page (link located at the top.
How to replicate the issue: Log in to the account, it will take you to the subscribe page. Then access the app by clicking the link at the top that says “Jhaubrichdesign LLC.”. It will redirect back to the payment form since the trial has expired for that account. Then you should see the issue with the payment form, if not try submitting a fake credit card number into the payment form, then go back and forth between pages. Eventually you will see the payment form fails to initialize correctly every now and then, as I mentioned previously the input fields do not even have placeholders, and I am not able to enter any information…

Hope to hear back from you soon about the issue.

Thanks,
Justin

Thanks for setting up that account. I did see the issue a few times, so I’m escalating this to the payment form team. I will follow up once I have more information!

1 Like

Thank you for the prompt reply! Sounds good, I look forward to resolving this issue.

Already heard back. It looks like you’re setting autoBuild to false, but not waiting on the page to fully load before calling .build() so it’s a bit of a race condition between if the page has loaded or not. The suggestion would either be setting autoBuild to true, or either waiting until an appropriate time to call .build(). Let me know if you have any questions about that.

Note: if you set autoBuild to true (or if you omit it completely, which it would default to true), then you do not need to call .build() at all.

@sjosey I have set autoBuild to true as you suggested, but now the form is not working at all. It seems that made it worse.

Hmmm, thanks for confirming. It loaded the first time for me, but not on the refresh. Regrouping with the team, will follow up shortly :slight_smile:.

Edit: Actually, I see you still have the call to build(). Try removing that; as I mentioned above you do not need it any longer.

1 Like

@sjosey Thank you so much, I removed the call to build() and now it is working perfectly. You guys are great, I really appreciate the speedy and prompt assistance. 10/10!

1 Like

Hi there,

My client’s customers are having a similar issue.

Below is a screenshot of the CC section with no fields displaying. The screenshot is from a support person helping a customer and this was a screenshot from her MAC with a chrome browser.

ScreenShotOnMac

I don’t set an autoBuild setting on the SqlPaymentForm form. This happens occasionally to my client’s customers when they are going to pay for a class. I cannot ever reproduce the issue but should I add autoBuild in the SQPaymentForm settings section?

Rick

I figured out why no fields were showing up for my clients. There was an apostrophe in the zip code field being assigned to the credit card zip code. Does the paymentForm.setPostalCode(xxx) function return an error code if there is an error on setting the postal code?

Thanks
Rick