Magento 2 : How to modify city field html for shipping address on checkout page

Question

I need to edit the city field HTML of New shipping address form on checkout in Magento 2.

I am not getting the file from where we can change this or add some classes in these fields. Please share some idea to achieve this.

Answer 1

VendorNameSpace\Module\etc\di.xml

<type name="Magento\Checkout\Block\Checkout\AttributeMerger">
    <plugin name="customAttributeMerger" type="VendorNameSpace\Module\Plugin\AttributeMergerPlugin"/>
</type>

AttributeMergerPlugin.php VendorNameSpace\Module\Plugin

<?php
namespace VendorNameSpace\Module\Plugin;

class AttributeMergerPlugin
{
    public function afterMerge(\Magento\Checkout\Block\Checkout\AttributeMerger $subject, $result)
    {
        /* that add new class inside the city div
         
        after edit look like :
        
        <div class="field **cusotom_city** _required" data-bind="visible:     visible, attr: {'name': element.dataScope}, css: additionalClasses" name="shippingAddress.city"> */

        if (array_key_exists('city', $result)) {
            $result['city']['additionalClasses'] = 'cusotom_city';
        }

        return $result;
    }
}

Hope this will help you. thanks

Answer 2

Here is the path where you can edit city text field for New Shipping Address Form which was rendered form XML file:

app/code/Magento/Checkout/view/frontend/layout/checkout_index_index.xml