Form controls do not use Magento CSS classes

[JacobDrummond]

Environment

• Ubuntu 14.04 LTS (GNU/Linux 3.13.0-117-generic x86_64)
• nginx/1.4.6 (Ubuntu)
• MySQL 5.6.34-log
• PHP PHP 7.0.18
• Magento CE 2.1.9
• Craftyclicks_Clicktoaddress 1.0.5

Replication steps

1. Style checkout forms using Magento's built-in classes
2. Load guest checkout

Expected result

• Craftyclicks_Clicktoaddress form fields should be styled same as Magento's

Actual result

• Craftyclicks_Clicktoaddress' fields do not match styling of other form elements:

Cause

• view/frontend/web/form_integrations/cc_customer_address.js and view/frontend/web/form_integrations/cc_customer_address.js output <div class="value"> instead of <div class="control">

Solution

Here's my temporary composer patch:

--- view/frontend/web/form_integrations/cc_customer_address.js  Tue Nov 28 10:45:02 2017
+++ view/frontend/web/form_integrations/cc_customer_address.js  Tue Nov 28 13:41:25 2017
@@ -12,7 +12,7 @@
            }
            var tmp_html = '<div class="field"'+custom_id+'><label class="label">' +
                            c2a_config.texts.search_label+'</label>' +
-                           '<div class="value"><input id="cc_'+cc_index+'_search_input" type="text"/></div></div>';
+                           '<div class="control"><input id="cc_'+cc_index+'_search_input" type="text"/></div></div>';

            form.find('#street_1').closest('.field').before( tmp_html );

--- view/frontend/web/form_integrations/cc_default_checkout.js  Tue Nov 28 10:45:02 2017
+++ view/frontend/web/form_integrations/cc_default_checkout.js  Tue Nov 28 13:41:25 2017
@@ -12,7 +12,7 @@

            var tmp_html = '<div class="field"'+custom_id+'><label class="label">' +
                            c2a_config.texts.search_label+'</label>' +
-                           '<div class="value"><input id="cc_'+cc_index+'_search_input" type="text"/></div></div>';
+                           '<div class="control"><input id="cc_'+cc_index+'_search_input" type="text"/></div></div>';
            form.find('[name="street[0]"]').closest('fieldset').before( tmp_html );

            var dom = {

[GaborSuranyi]

Thanks for reporting this. With the default Luma template this issue isn't visible, as .control has the same value for the .value field (which was the standard at the release of M2) But I looked into the layout, and I can see that it does use .control now. I'll patch it to ensure compatibility with themes.