1849110 - [US][www.lulus.com] Saved value is not autofilled in State field

Status: VERIFIED FIXED

(Toolkit :: Form Autofill, task)

Description

[Ina Popescu, Desktop QA]

Attachment: lulus.mp4

Found in

• Nightly 118.0a1

Affected versions

• Nightly 118.0a1

Tested platforms

• Affected platforms: Windows 10 x64, macOS 13, Ubuntu 22.04
• Unaffected platforms: none

Preconditions

• Set browser.search.region to US in about:config
• Save 1 or 2 addresses in about:preferences#privacy, Forms & Autofill section
• Use US VPN

Steps to reproduce

1. Go to https://www.lulus.com/
2. Add one item to cart and proceed to checkout
3. Use autofill feature in the Shipping form

Expected result

• The saved values are autofilled properly in the corresponding fields upon using the autofill feature in the Shipping form.

Actual result

• The field State is not autofilled upon using the autofill feature in the Shipping form.

Regression range

• N/A

Additional notes

• The issue can not be reproduced in Google Chrome.
• Fathom Fox page

Comment 1

[Neil Deakin]

The state dropdown is correctly identified, but filling in fails, as the value on each <option> is a five digit number, and the two-character state is stored in a data-code attribute.

We could, if we don't find the value, look for data-* attributes that match as well. This would be done at https://searchfox.org/mozilla-central/source/toolkit/components/formautofill/shared/FormAutofillUtils.sys.mjs#718

Comment 2

[Neil Deakin]

I looked at this in more detail, and the issue is actually that there is a hidden dropdown for the county which is also identified as a 'address-level1' as well as the state/province field. This means that we should skip over any invisible items when iterating though select elements.

A simple solution is to modify getFieldDetailByName() in FormAutoFillSection.sys.mjs to skip fields that are not visible. This seems to work for this site, but maybe we want to make that check conditional and only call it when checking select elements for now.

dimi, considering the changes you made in 1880450, what do you think?

Comment 3

[Dimi Lee [:dimi]]

Hi Neil, I just did a quick test (connect to US via VPN), and it seems that we correctly identify all the fields; I didn't notice any hidden country field. To me, this issue happens because we can't match the select option due to the option text having a State: prefix.

<select autocomplete="address-level1" name="regionId" id="state-ddl" >
  <option selected="selected" disabled="disabled" value="" data-v-55da7757="">State*
  </option><option value="1" data-v-55da7757="">State:  Alabama
  </option><option value="2" data-v-55da7757="">State:  Alaska
  </option><option value="4" data-v-55da7757="">State:  Arizona
...

If i change this line to strInclude, and then this issue is fixed.
Could you help check again to see if we are observing the same thing? thanks!

Comment 4

[Neil Deakin]

The UI being provided seems to differ based on which shipping region you are in (click the flag at the top of the page), as well as what you have previously filled in. I've seen:

1. The case dimi shows above, which took me a while to reproduce. This uses a hidden <select> element for the state with some other rendering for what the user sees for the dropdown.
2. A similar case as with 2, but without the 'State:' prefix before each option.
3. A variation of the form with the layout in a vertical list. No hidden <select> element is used for the state/province. This is what I saw for comment 2. However the fix for this case I suggested would break case 1 and 2.

Comment 5

[Neil Deakin]

Attachment: Bug 1849110, use a substring match when identifying option text for address autofill, r=#credential-management-reviewers

This makes it possible to handle when a dropdown has a prefix such as 'State:' before state names, for example.

Comment 6

[Neil Deakin]

Attachment: Bug 1849110, when looking for matching options in select dropdowns, and multiple fields exist with the same field type, prefer the field that is visible, r=#credential-management-reviewers

Depends on D211992

Comment 7

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/cbce3057f4ca
use a substring match when identifying option text for address autofill, r=credential-management-reviewers,dimi
https://hg.mozilla.org/integration/autoland/rev/68ffcf52c7ba
when looking for matching options in select dropdowns, and multiple fields exist with the same field type, prefer the field that is visible, r=credential-management-reviewers,dimi

Comment 8

[Atila Butkovits]

https://hg.mozilla.org/mozilla-central/rev/cbce3057f4ca
https://hg.mozilla.org/mozilla-central/rev/68ffcf52c7ba

Comment 9

[Ina Popescu, Desktop QA]

I've replicated this issue using Nightly 118.0a1 on Windows 10 x64.
Verified as fixed in the latest Nightly 128.0a1 version on Windows10 x64 and macOS11, as the issue no longer occurs.