Hi @otbafrica,
I was not able to reproduce the issue with the verification fields being duplicated.
We considered moving the hook woocommerce_after_checkout_billing_form
outside the updated sections but that is not currently possible.
Not all plugins that output HTML to that hook will have issues. Most like those which have underlying JavaScript functionality would have issues. The best we can do at this point is to add explicit compatibility to these plugins.
In any case, it looks to me that the best place for the verification field would be at the end of the checkout form below the payment section, as its own separate substep. This would be with the verification being both via Email or SMS.
My reasoning is:
a. The customer will have completed the checkout form and put some effort into it and won’t mind too much to do the verification at the end. This would work similarly to multi-step forms to get something from a website, that only at the end asks for the email address.
b. The verification only occurs when the user clicks the “Place order” button, and not when they move to the next step or save the changes from a substep. Having the verification fields inside any step that is not the last can possibly lead to confusion with the error message when the validation fails.
Proposed solutions:
1. It is possible to move the verification fields to their own substep at the payment step.
2. Otherwise, if displaying the fields below the contact and billing form fields is a must, we’ll probably add (in v1.2.6) a new hook to allow developers to output content on those positions without it being part of the updated sections. We have more tests to do to ensure this change works well before making it available to everyone.
Best,
Diego