Form fields not displaying with new checkout experience

I did some debugging on the button html code getting inserted in email placeholder text and found that it’s coming from stripe related to stripelink feature. The button is getting added with “display:none” set. See this screenshot: https://ibb.co/HgX8QQL.

Stripelink is not enabled in my stripe dashboard. Can you please help me understand why this button code from stripe is getting added to label field and how can I remove it?

Please also see the stripe form field not displaying issue mentioned in the previous reply.

Thanks,

Vinita

Hi @vinitabansal

Button html issue is resolved.?

That’s great to hear! Thanks for letting us know.

Form fields are still not displaying in stripe checkout form.
[…]
I have disabled all the plugins to test new checkout experience only with woocommerce. Now only woocommerce and stripe plugin are activated.

Just to clarify, did you already test with a default theme active, like TT3, and see if the issue persists (always, with only WooCommerce and Stripe plugins active), or otherwise?

I did some debugging on the button html code getting inserted in email placeholder text and found that it’s coming from stripe related to stripelink feature. The button is getting added with “display:none” set. See this screenshot: https://ibb.co/HgX8QQL.

Stripelink is not enabled in my stripe dashboard. Can you please help me understand why this button code from stripe is getting added to label field and how can I remove it?

As a first step, kindly check if you can reproduce this with a default theme active, like TT3 – as mentioned above.

Furthermore, feel free to peruse the related documentation (link here), on express checkouts, in order to customize Stripe Link at your site.

I hope this is helpful! Please let us know if you have any further questions or concerns.
We will be happy to help you further.

Hi,

Please find my response below:

>> Just to clarify, did you already test with a default theme active, like TT3, and see if the issue persists (always, with only WooCommerce and Stripe plugins active), or otherwise?

Yes, issue persists with even twenty twenty-four theme and only woocommerce and stripe enabled. See this screenshot: https://ibb.co/ZL7dW7V

>> Furthermore, feel free to peruse the related documentation (link here), on express checkouts, in order to customize Stripe Link at your site.

As mentioned earlier, stripelink is not even enabled in my account. There’s nothing else in the documentation that talks about why the html button code for stripelink is getting added to email label. https://ibb.co/HgX8QQL

See this file: https://github.com/woocommerce/woocommerce-gateway-stripe/blob/develop/woocommerce-gateway-stripe.php

It has this code that’s causing button html to be appended to label:

// Append StripeLink modal trigger button for logged in users.
$fields[‘billing_email’][‘label’] = $fields[‘billing_email’][‘label’]
. ‘ <button class=”stripe-gateway-stripelink-modal-trigger”</button>’;

Could this be causing the issue?

Thanks,

Vinita

Hey @vinitabansal

Yes, issue persists with even twenty twenty-four theme and only woocommerce and stripe enabled. See this screenshot:?https://ibb.co/ZL7dW7V

I tried reproducing this, with a test site of mine, to no avail. Everything worked as expected.

Below, I am attaching screenshots, for reference. See how the email field is correctly moved to the top when Stripe Link is enabled, on either the classic (shortcode-based), or block-based Checkout — and then it’s found at its regular spot, when Stripe Link is not enabled.

Could this be causing the issue?

Based on the System Status Report (SSR) shared here, it is my understanding that this is due to a plugin/theme conflict, instead.

I hope this is helpful! Please let us know if you have any further questions about this matter, or if we misinterpret your concern in any way. We will be happy to help you further.

Hi,

SSR report shared earlier was without deactivating plugins. As mentioned earlier, the issue persists after deactivating all plugins except woocommerce and stripe.

Also, to clarify we are talking about 2 issues here:

1. Stripe credit card form fields not dipslaying. Frame with card number, cvv etc renders empty.
2. Button html text getting appended to label. (this issue is also reported by another user in another thread)

The image https://snipboard.io/Zwsr15.jpg shared does not have email address. Please confirm what test does it represent.

Can you please help with what can be done to fix issues #1 and #2.

Thanks,

Vinita

Hello vinitabansal

Thank you for your reply.

We have tried to recreate this issue on our end but to no avail.
At this point, the best way forward would be to create a staging site, disable all the non-essential plugins, and switch the theme to TT4.

This default environment will allow me to diagnose the problem firsthand and find out what is causing this issue. Once I have found the root cause, then I can suggest a solution.

You may ask your host if they provide a staging site feature.
Otherwise, you can use the WP Staging plugin to create a staging site.

I look forward to your reply. ??
Best regards.

Hi Zubair,

I have switched to twenty twenty-four theme, disabled all plugins except woocommerce and stripe.

To reproduce the issue, please follow these steps:

1. Go to https://www.courses.techtello.com
2. Click the buy now link with price $12.99. See this: https://ibb.co/Ln4yhnw
3. You will be taken to cart page. Click proceed to checkout.
4. Scroll down to the bottom of the checkout page. You will find that stripe form fields not being displayed. See this: https://ibb.co/w0N6XsP

Thanks,

Vinita

Hi @vinitabansal

I checked your site and spotted a JavaScript error. This seems to be the reason why your form isn’t loading. It’s pointing towards a conflict with another plugin.

The best way to determine this is to:

• Temporarily switch your theme to Storefront or Twenty Twenty-Four
• Disable all plugins except for WooCommerce and WooCommerce Stripe Payment Gateway
• Repeat the action that is causing the problem

If you do not see the same problem after completing the conflict test, then you know the problem was with the plugins and/or theme you deactivated. To figure out which plugin is causing the problem, reactivate your other plugins one by one, testing after each, until you find the one causing conflict. You can find a more detailed explanation on how to do a conflict test here.

Additionally, head over to WooCommerce → Status → Tools, and do the following:

• WooCommerce transients – Clear
• Expired transients – Clear
• Clear template cache – Clear
• Capabilities – Reset Capabilities
• Clear customer sessions -Clear

Next, please clear your browser and site cache and then check again.

I hope that helps! Let me know once you have done a conflict test!

Hi Shaheem,

Thank you for sharing the screenshot. As mentioned in my previous reply, the theme is already twenty twenty-four and all plugins except woocommerce and stripe are already disabled. The error persists even after clearing browser, site cache and following others steps in the status tools. Conflict plugin can’t happen because there are only 2 plugins on the site.

I noticed an additional error in console. See https://ibb.co/SRWGjJH:

Unhandled payment Element loaderror Objecterror: message: "Link is not supported in your country."param: "deferred_intent.payment_method_types"request_log_url: "https://dashboard.stripe.com/test/logs/req_DTr2dahIWi0Kqc?t=1719490390"status: 400type: "invalid_request_error"[[Prototype]]: Object[[Prototype]]: Object

Could this be the reason for form fields not displaying? As mentioned, link is not even enabled for me. See https://ibb.co/0JyXKft. So, I am not sure why it’s displaying this error. Can you please check this?

Thanks,

Vinita

Found the root cause which appears to be a clear plugin issue, but need your confirmation.

Form fields display as expected once I disable the express checkout option in the stripe plugin. See https://ibb.co/K2sbT9Z.

This tells me that it’s link getting enabled by default under express checkout which not being supported for my country is throwing an unhandled error (see my previous reply for error details) and causing form fields to not display. Please check and confirm your understanding.

Thanks,

Vinita

Were you able to check this? Kindly update.

Hello vinitabansal

Thank you for your reply.

To determine whether this is a plugin issue, I need to reproduce it on my test site.
Could you tell me what is your country?

Also, share your site’s latest System Status Report with me.
You can find it via WooCommerce > Status.
Select Get system report and then Copy for support.

Once you’ve done that, you can paste the text in https://gist.github.com
After that, you can paste the Gist link here in your reply.

Looking forward to your response. ??

Best regards.

Hi,

Do you want system status report with all plugins disabled except woo and stripe with twenty twenty four theme with the issue reproduced?

Thanks,

Vinita

Hey, @vinitabansal!

Do you want system status report with all plugins disabled except woo and stripe with twenty twenty four theme with the issue reproduced?

Yes, please ??

And if you can confirm the country you store is based, that would be great too.

Looking forward to your reply.

Have a wonderful day!

Hi,

The issue resolved itself just like it happened 2 months back when I first reported it. Please see that I had faced this issue 2 months back as well and then one fine day it started working. This is the second time it has happened. 6 days ago when I checked and replied to this thread, it wasn’t working and today when I checked again, form fields are getting displayed and even button html in input field is not a problem anymore.

This is very weird behavior. Do you have A/B testing going on that could be causing it?

I need some clear understanding of what’s happening here and what could be the reason for it not working earlier. What do you think we can check to debug this further? My understanding is that it has to do with stripe link error that I was getting earlier. Were there any changes done on stripe link that resolved it?

To answer your earlier query, my store is in India, but I have tested it from NL, Japan and other countries and got the same behavior.

Thanks,

Vinita