Issue with the Gutenberg fields

  • Resolved euzebiobatista

    (@euzebiobatista)


    1 week, 3 days ago

    Hello Support Team, hope you’re doing well.

    We received a ticket from a customer stating that the First Name and Last Name fields on the checkout form (blocks/Gutenberg) are not working.

    I investigated further and noticed that:
    When I copy the filled name and delete it, the input event (or something similar) does not trigger the ‘update-customer‘ event. I know these fields are required and must be filled in, but this causes some confusion and UX issues. Specifically, they revert to their previous state whenever an event like a shipping method change or a coupon insertion occurs—suddenly, fields that should be empty reappear with the old data.

    Which leads me to think: if these fields are already required, there shouldn’t be an issue with the ‘update-customer’ event being triggered with empty fields. Upon form submission, both the frontend and backend will validate the information and alert the user accordingly, preventing unexpected behavior.

    Perhaps this issue is also happening with other fields.

Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Support shahzeen(woo-hc)

    (@shahzeenfarooq)

    1 week, 2 days ago

    Hi @euzebiobatista!

    I understand the issue you’re describing with the First Name and Last Name fields in the Checkout Block. In particular, when the fields are cleared, the expected update-customer event does not appear to be triggered, and the previous values can reappear after actions such as changing the shipping method or applying a coupon. I understand how this could lead to confusing behavior for customers.

    To help us investigate this further, could you please confirm:

    • Were these fields working correctly before, and if so, when did you first notice the issue?
    • Were any changes made to the site before the issue started, such as a WooCommerce/plugin update, theme change, customization, or checkout configuration change?
    • Could you create a short video demonstrating the issue? This would help us see exactly what happens when the fields are cleared and when another checkout action causes the previous values to reappear.
    • Please also share your site URL so we can better understand the checkout setup.
    • Please provide the WooCommerce System Status Report from WooCommerce → Status → Get system report → Copy for support.
    • If there are any relevant Fatal Error Logs, please share those as well from WooCommerce → Status → Logs.

    With these details, we’ll be able to better understand whether the behavior is related to a recent change, a plugin/theme conflict, or the Checkout Block itself.

    For easier sharing, you can paste both reports into Pastebin and send us the links. When creating the Pastebin entries, please make sure the “Burn after read” option is turned off, so the reports remain available for us to review.

    Once we have these details, we can investigate the cause of the error and advise you on the appropriate next steps.

    Thread Starter euzebiobatista

    (@euzebiobatista)

    1 week, 2 days ago

    Hello @shahzeenfarooq ,
    I am from Brazil, so please excuse my English.

    • Were these fields working correctly before, and if so, when did you first notice the issue?
      I discovered this bug a few days ago, but I believe it has already been there for a while.

    • Were any changes made to the site before the issue started, such as a WooCommerce/plugin update, theme change, customization, or checkout configuration change?
      Initially, I thought it could be a theme issue or a conflict with a plugin from the company I work for. However, I created a completely fresh environment from scratch using only WordPress + WooCommerce, and the bug occurs there as well.

    • Could you create a short video demonstrating the issue? This would help us see exactly what happens when the fields are cleared and when another checkout action causes the previous values to reappear.
      Sure! Here is the video link: https://www.linknacional.com.br/assets/suporte/player/suporte_6a6b690f27c91_4cddc7d7
      In the video, I use the browser’s Inspect tool (Network tab) to show that the batch request with the update-customer action is not being called. It is only called when both fields are filled out.

    • Please also share your site URL so we can better understand the checkout setup.
      I can share a URL if needed. Keep in mind that our clients’ sites use some of our custom checkout plugins, but as I mentioned above (with the fresh install), the bug occurs regardless of the plugins installed.

    • Please provide the WooCommerce System Status Report from WooCommerce → Status → Get system report → Copy for support.
      I can send you the report if you want, but I don’t believe it’s necessary. As shown in the video, I didn’t even need to submit the form to reproduce the bug, so it shouldn’t generate any system logs or warnings.

    • If there are any relevant Fatal Error Logs, please share those as well from WooCommerce → Status → Logs.
      No, it doesn’t generate any fatal errors. As I said above, I don’t think it generates any logs at all. The problem seems to be a condition directly in the form’s JS/TSX file, which is preventing the batch request from being sent when a field is left empty.
    Plugin Support shahzeen(woo-hc)

    (@shahzeenfarooq)

    1 week, 1 day ago

    Hi @euzebiobatista

    Thanks for taking the time to investigate this and for providing the additional technical details.

    Regarding the behavior you described, the Checkout Block is designed to automatically push changes to the customer data to the server. This was specifically introduced to prevent entered checkout fields from being reset when the checkout state is refreshed, for example when the customer changes the shipping option. This change was included in WooCommerce Blocks 9.6.0, as documented in this PR.

    However, you mentioned that the original customer report was that the First Name and Last Name fields are not working. Could you clarify what the customer means by this?

    For example, are they:

    • Unable to enter a First Name or Last Name at all?
    • Able to enter the values, but the values disappear afterward?
    • Able to enter the values, but they change back to the previous values after changing the shipping method?
    • Seeing any validation or error message when entering these fields?

    If you can provide the exact behavior the customer is experiencing, that would help us determine whether this is the expected checkout data synchronization behavior or a separate issue with the Checkout Block.

    Thanks again for bringing this to our attention.

    Thread Starter euzebiobatista

    (@euzebiobatista)

    1 week ago

    Hi @shahzeenfarooq,

    I apologize if it was confusing, but I was trying to explain a behavior that occurs when we clear the content of a TEXT field in the Gutenberg Checkout form. This doesn’t affect the form submission or anything; it’s more of an unexpected behavior that happens when deleting the text from a field, leaving it empty.

    Unable to enter a first or last name?
    As I showed in the video, it is possible to fill in the first and last name fields, everything is fine there. The problem is when you clear it; the React script doesn’t detect that change, which can lead to unexpected events.

    Is it possible to enter values, but they disappear afterwards?
    The exact opposite happens. Imagine the following scenario: “I am an elderly person who struggles a bit with technology. I fill in my first name, but make a mistake on my last name, so I clear the field and continue filling out the other data.” When I do this, since React didn’t detect that the field is empty (because the event wasn’t triggered upon clearing the field), as I fill out the other fields, the last name—which should be empty and alert the user upon form submission—reverts to the wrong last name. The user doesn’t notice and submits the form with the incorrect last name.
    As I mentioned above, it’s not a bug that severely impacts the user experience, but it can cause some unexpected confusion.

    Is it possible to enter values, but they revert to the previous values after changing the shipping method?
    Yes, the old values return. But this happens on any event that triggers the React lifecycle, where it fetches the latest filled data. Since it wasn’t notified about the empty field, it brings back the old one that was already filled.

    Do you see any validation message or error when filling out these fields?
    No, regarding filling them out and the submission flow, everything is perfect, no problems.

    One observation I made is that this is also happening in other fields like Zip Code, City, and Address.

    To reproduce the error is quite simple: just fill in the address data, whether it’s fake or not. Have more than one shipping method or coupon configured in your WooCommerce. Then, clear the Zip Code, Address, City, First Name, and Last Name fields. After that, select a different shipping method and the old data will return to the fields. This can even lead to submitting orders with a wrongly typed shipping address from before.

    https://www.linknacional.com.br/assets/suporte/player/suporte_6a6ceb984f1d0_1ba065f8

    Plugin Support shahzeen(woo-hc)

    (@shahzeenfarooq)

    1 week ago

    Hi @euzebiobatista!

    Thank you for providing more information about the issue. I have reviewed the video you shared, and I can see the fields being filled automatically. However, I tried to replicate the issue on my test site, but I wasn’t able to reproduce the same behavior.

    Here is a video showing that everything is working as expected on my end:
    Video demonstration

    To help us investigate this further, could you please confirm whether the shipping methods you are selecting are configured using the default shipping settings available in WooCommerce, or whether you are using a custom shipping plugin?

    Also, could you please go to WooCommerce → Settings → Shipping → Shipping settings and share a screenshot of the configuration you have set up? This will allow us to replicate your setup as closely as possible and investigate the issue further.

    Additionally, could you please share the site URL where you are experiencing the issue? If possible, you can provide the link to the test site where you have a fresh installation of WooCommerce and where the issue can be reproduced. This would allow us to test the behavior directly on the affected setup.

    Once we have these additional details, we’ll be happy to investigate this further and assist you accordingly.

    Thread Starter euzebiobatista

    (@euzebiobatista)

    1 week ago

    Hello @shahzeenfarooq ,

    To reproduce this behavior, you first need to fill in the fields, wait for the React lifecycle, and refresh the page. After that, just clear the fields and try to change the shipping or delivery method.

    default shipping settings available in WooCommerce, or whether you are using a custom shipping plugin?
    Yes, it’s from a very well-known plugin here in my country; it provides several options.

    Note: If you notice in the video, when you clear the zip code, the shipping options should become unavailable, since there is no zip code entered at that moment.

    Plugin Support shahzeen(woo-hc)

    (@shahzeenfarooq)

    5 days, 12 hours ago

    Hi @euzebiobatista!

    Thank you for providing the additional details and for explaining the steps to reproduce the behavior.

    I followed the exact steps you suggested, including filling in the fields, waiting for the React lifecycle to complete, refreshing the page, clearing the fields, and then trying to change the shipping/delivery method. However, I’m not able to reproduce the issue on my end.

    Regarding the shipping options remaining available after removing the ZIP code, in my test this is because I have configured the shipping method to apply to all countries. Therefore, the shipping options are not removed when the ZIP code is cleared.

    Since you mentioned that you are using a third-party shipping plugin, could you please confirm whether you experience the same behavior when using WooCommerce’s default shipping methods, with the shipping plugin temporarily deactivated?

    Additionally, if possible, could you please provide a staging site URL where you have already reproduced the issue, preferably with the third-party shipping plugin deactivated and all other plugins disabled? I’d like to test the same behavior directly on your staging site and see if I can reproduce it there.

    Once we have this information, I’ll be happy to escalate the issue internally so our developers can investigate it further.

    Thank you for your cooperation and understanding.

    Thread Starter euzebiobatista

    (@euzebiobatista)

    2 days, 22 hours ago

    Hello @shahzeenfarooq,

    I apologize for the delay.


    I had prepared a website to share with you, but with the new WooCommerce 11.0.0 update, the issue has been resolved!


    Now I can clear the fields, change shipping options, apply coupons, and even switch the payment gateway, and the fields no longer get repopulated.


    Thank you for all the support!

    Plugin Support shahzeen(woo-hc)

    (@shahzeenfarooq)

    2 days, 9 hours ago

    Hi @euzebiobatista!

    Great to hear everything’s working perfectly now! If you’re happy with the support you received today, would you consider leaving us a quick review? It really helps us out: https://wordpress.org/support/plugin/woocommerce/reviews/#new-post

    Thank you

Viewing 9 replies - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.