Add autocomplete tags to address form fields on checkout

[mtomov]

After this change, Chrome autocompletes all fields per address*

• State must be available in the select box to autocomplete

Specification available at:

• https://html.spec.whatwg.org/multipage/forms.html#attr-fe-autocomplete-given-name

Well explained at:

• https://cloudfour.com/thinks/autofill-what-web-devs-should-know-but-dont/

[tvdeyen]

Although we plan to remove frontend html in a future version of solidus, I think this is good for now. It's a good start for new devs and can (and most likely will) be overridden by more experiences devs anyway.

So, from me 👍

[tvdeyen]

As a bonus, as we're already here we could also add required: true to trigger browser based validation. But this is up to you to decide. This is good as it is right now.

Thanks for your contribution 🍭

[mtomov]

There's actually that beast here - jQuery.validate that takes care of javascript validations. Not sure if it will play well with the html validations as it's a rather old version.

As the address form is the only one to use this plugin, as far as I know, (payment form uses a different plugin), if you consider it appropriate, I can remove jQuery validate altogether and replace the presence validations with html5 ones. Whoever wants then can add a validation plugin of their own (such as the Foundation's one Abide, or I'm sure bootstrap must also have one)

I think even for experienced developers - having a reference to what exactly the correct auto-complete attributes are, without having to search for, is great to have.

[tvdeyen]

👍 for removing jQuery.validate and replace it with HTML5 based validations. But this is just my 2 cents. Would like to here the others @jhawthorn @gmacdougall WDYT?

[cbrunsdon]

I'm pro swapping to html5 validations as well, though I know very little about them.

[jhawthorn]

This looks good to me 👍

I've created a separate issue #1548 to discuss removing jquery.validate in favour of plain HTML validations.

One thing that still doesn't autofill correctly is the state/province. Presumably because the dropdown is filled in via javascript. It would be great if that worked (but it may not be possible).

[tvdeyen]

Thanks @jhawthorn