Another section is needed for autofill information #63170
Description
Browser can use a section information on the autofill forms.
Although this is not mandatory, Safari Desktop, uses labels such as shipping in front of the address related fields, otherwise even though the address is visible in the saved forms information, it is not getting re-filled.
An example html form should looks like this:
<form method="post" action="#" id="usrForm">
<input type="text" name="given-name" id="given-name" autocomplete="given-name">
<input type="text" name="family-name" id="family-name" autocomplete="family-name">
<input type="text" name="organization-title" id="organization-title" autocomplete="organization-title">
<input type="text" name="organization" id="organization" autocomplete="organization">
<input type="text" name="address-line1" id="address-line1" autocomplete="shipping address-line1">
<input type="text" name="address-line2" id="address-line2" autocomplete="shipping address-line2">
<input type="text" name="country" id="country" autocomplete="shipping country">
<input type="text" name="country-name" id="country-name" autocomplete="shipping country-name">
<input type="text" name="postal-code" id="postal-code" autocomplete="shipping postal-code">
<input type="submit" value="Submit" name="submit" id="submit">
</form>
As temporary solution we can add shipping in front of all address related fields for Safari Desktop (code location)
void applyToDomElement(html.HtmlElement domElement,
{bool focusedElement = false}) {
domElement.id = hint;
if (domElement is html.InputElement) {
html.InputElement element = domElement;
element.name = hint;
element.id = hint;
if(hint.contains('address') || hint.contains('country') || hint.contains('postal')) {
element.autocomplete = 'shipping $hint';
} else {
element.autocomplete = hint;
}
if (hint.contains('password')) {
element.type = 'password';
} else {
element.type = 'text';
}
} else if (domElement is html.TextAreaElement) {
html.TextAreaElement element = domElement;
element.name = hint;
element.id = hint;
element.setAttribute('autocomplete', hint);
}
}
A long term solution would be to being able to add these section names to autofill hint. For example 'shipping' 'billing' for address, or 'home', 'work' to phone number.