diff --git a/browser/extensions/formautofill/content/customElements.js b/browser/extensions/formautofill/content/customElements.js index 0f1260634dbe..2f22a8173aab 100644 --- a/browser/extensions/formautofill/content/customElements.js +++ b/browser/extensions/formautofill/content/customElements.js @@ -287,16 +287,7 @@ this._itemBox.setAttribute("no-warning", "true"); } - // After focusing a field that was previously filled with cc information, - // the "ac-image" is falsely set for the listitem-footer. For now it helps us - // to distinguish between address and cc footer. In the future this false attribute - // setting should be fixed and the "ac-image" check replaced by a different method. - const buttonTextBundleKey = !this.getAttribute("ac-image") - ? "autocompleteManageAddresses" - : "autocompleteManageCreditCards"; - const buttonText = - this._stringBundle.GetStringFromName(buttonTextBundleKey); - this._optionButton.textContent = buttonText; + this._optionButton.textContent = value.manageLabel; } } diff --git a/browser/extensions/formautofill/locales/en-US/formautofill.properties b/browser/extensions/formautofill/locales/en-US/formautofill.properties index 2447b652c8db..d3add192d722 100644 --- a/browser/extensions/formautofill/locales/en-US/formautofill.properties +++ b/browser/extensions/formautofill/locales/en-US/formautofill.properties @@ -2,12 +2,6 @@ # License, v. 2.0. If a copy of the MPL was not distributed with this # file, You can obtain one at http://mozilla.org/MPL/2.0/. -# LOCALIZATION NOTE (autocompleteManageCreditCards): -# Used as a label for the button, displayed at the bottom of the dropdown suggestion, to open Form Autofill browser preferences. -autocompleteManageCreditCards = Manage credit cards -# LOCALIZATION NOTE (autocompleteManageAddresses): -# Used as a label for the button, displayed at the bottom of the dropdown suggestion, to open Form Autofill browser preferences. -autocompleteManageAddresses = Manage addresses # LOCALIZATION NOTE (category.address, category.name, category.organization2, category.tel, category.email): # Used in autofill drop down suggestion to indicate what other categories Form Autofill will attempt to fill. category.address = address diff --git a/browser/extensions/formautofill/test/browser/browser_autocomplete_footer.js b/browser/extensions/formautofill/test/browser/browser_autocomplete_footer.js index fde34a0a3264..1e7ba523e8cd 100644 --- a/browser/extensions/formautofill/test/browser/browser_autocomplete_footer.js +++ b/browser/extensions/formautofill/test/browser/browser_autocomplete_footer.js @@ -2,12 +2,57 @@ const URL = BASE_URL + "autocomplete_basic.html"; +const l10n = new Localization(["toolkit/formautofill/formAutofill.ftl"], true); + add_setup(async function setup_storage() { await setStorage( TEST_ADDRESS_2, TEST_ADDRESS_3, TEST_ADDRESS_4, - TEST_ADDRESS_5 + TEST_ADDRESS_5, + TEST_CREDIT_CARD_1 + ); +}); + +add_task(async function test_footer_has_correct_button_text_on_address() { + await BrowserTestUtils.withNewTab( + { gBrowser, url: URL }, + async function (browser) { + const { + autoCompletePopup: { richlistbox: itemsBox }, + } = browser; + + await openPopupOn(browser, "#organization"); + const footer = itemsBox.querySelector( + ".autofill-footer-row.autofill-button" + ); + Assert.equal( + footer.innerText, + l10n.formatValueSync("autofill-manage-addresses-label") + ); + await closePopup(browser); + } + ); +}); + +add_task(async function test_footer_has_correct_button_text_on_credit_card() { + await BrowserTestUtils.withNewTab( + { gBrowser, url: CREDITCARD_FORM_URL }, + async function (browser) { + const { + autoCompletePopup: { richlistbox: itemsBox }, + } = browser; + + await openPopupOn(browser, "#cc-number"); + const footer = itemsBox.querySelector( + ".autofill-footer-row.autofill-button" + ); + Assert.equal( + footer.innerText, + l10n.formatValueSync("autofill-manage-payment-methods-label") + ); + await closePopup(browser); + } ); }); diff --git a/browser/extensions/formautofill/test/mochitest/test_autofill_and_ordinal_forms.html b/browser/extensions/formautofill/test/mochitest/test_autofill_and_ordinal_forms.html index 54efc8335925..ab3c08e89a86 100644 --- a/browser/extensions/formautofill/test/mochitest/test_autofill_and_ordinal_forms.html +++ b/browser/extensions/formautofill/test/mochitest/test_autofill_and_ordinal_forms.html @@ -47,9 +47,8 @@ add_task(async function check_switch_autofill_form_popup() { checkMenuEntries( [ `{"primary":"+13453453456","secondary":"123 Sesame Street."}`, - `{"primary":"","secondary":"","categories":["organization","address","tel","name"],"focusedCategory":"tel"}`, ], - false + true ); await testMenuEntry(0, "!(el instanceof MozElements.MozAutocompleteRichlistitem)"); @@ -75,9 +74,8 @@ add_task(async function check_switch_autofill_form_popup_back() { checkMenuEntries( [ `{"primary":"+13453453456","secondary":"123 Sesame Street."}`, - `{"primary":"","secondary":"","categories":["organization","address","tel","name"],"focusedCategory":"tel"}`, ], - false + true ); await testMenuEntry(0, "!(el instanceof MozElements.MozAutocompleteRichlistitem)"); diff --git a/browser/extensions/formautofill/test/mochitest/test_form_changes.html b/browser/extensions/formautofill/test/mochitest/test_form_changes.html index 2eace91a5316..1bfc65532819 100644 --- a/browser/extensions/formautofill/test/mochitest/test_form_changes.html +++ b/browser/extensions/formautofill/test/mochitest/test_form_changes.html @@ -77,8 +77,7 @@ async function checkFormChangeHappened(formId) { // Click on an autofilled field would show an autocomplete popup with "clear form" entry checkMenuEntries([ JSON.stringify({primary: "", secondary: ""}), // Clear Autofill Form - JSON.stringify({primary: "", secondary: ""}) // FormAutofill Preferemce - ], false); + ], true); // This is for checking the changes of element removed and added then. document.querySelector(`#${formId} input[name=address-level2]`).remove(); diff --git a/browser/locales/en-US/browser/preferences/formAutofill.ftl b/browser/locales/en-US/browser/preferences/formAutofill.ftl index 2324a3f19762..123fa9bbbec1 100644 --- a/browser/locales/en-US/browser/preferences/formAutofill.ftl +++ b/browser/locales/en-US/browser/preferences/formAutofill.ftl @@ -132,15 +132,3 @@ autofill-card-expires-month = Exp. Month autofill-card-expires-year = Exp. Year autofill-card-billing-address = Billing Address autofill-card-network = Card Type - -## These are brand names and should only be translated when a locale-specific name for that brand is in common use - -autofill-card-network-amex = American Express -autofill-card-network-cartebancaire = Carte Bancaire -autofill-card-network-diners = Diners Club -autofill-card-network-discover = Discover -autofill-card-network-jcb = JCB -autofill-card-network-mastercard = MasterCard -autofill-card-network-mir = MIR -autofill-card-network-unionpay = Union Pay -autofill-card-network-visa = Visa diff --git a/python/l10n/fluent_migrations/bug_1864340_autocomplete_footer.py b/python/l10n/fluent_migrations/bug_1864340_autocomplete_footer.py new file mode 100644 index 000000000000..e389f54861c7 --- /dev/null +++ b/python/l10n/fluent_migrations/bug_1864340_autocomplete_footer.py @@ -0,0 +1,59 @@ +# Any copyright is dedicated to the Public Domain. +# http://creativecommons.org/publicdomain/zero/1.0/ + +import fluent.syntax.ast as FTL +from fluent.migrate.transforms import COPY, COPY_PATTERN + + +def migrate(ctx): + """Bug 1864340 - Convert autocomplete footer strings to FTL, part {index}.""" + + propertiesSource = "browser/extensions/formautofill/formautofill.properties" + fluentSource = "browser/browser/preferences/formAutofill.ftl" + target = "toolkit/toolkit/formautofill/formAutofill.ftl" + ctx.add_transforms( + target, + target, + [ + FTL.Message( + id=FTL.Identifier("autofill-manage-addresses-label"), + value=COPY(propertiesSource, "autocompleteManageAddresses"), + ), + FTL.Message( + id=FTL.Identifier("autofill-card-network-amex"), + value=COPY_PATTERN(fluentSource, "autofill-card-network-amex"), + ), + FTL.Message( + id=FTL.Identifier("autofill-card-network-cartebancaire"), + value=COPY_PATTERN(fluentSource, "autofill-card-network-cartebancaire"), + ), + FTL.Message( + id=FTL.Identifier("autofill-card-network-diners"), + value=COPY_PATTERN(fluentSource, "autofill-card-network-diners"), + ), + FTL.Message( + id=FTL.Identifier("autofill-card-network-discover"), + value=COPY_PATTERN(fluentSource, "autofill-card-network-discover"), + ), + FTL.Message( + id=FTL.Identifier("autofill-card-network-jcb"), + value=COPY_PATTERN(fluentSource, "autofill-card-network-jcb"), + ), + FTL.Message( + id=FTL.Identifier("autofill-card-network-mastercard"), + value=COPY_PATTERN(fluentSource, "autofill-card-network-mastercard"), + ), + FTL.Message( + id=FTL.Identifier("autofill-card-network-mir"), + value=COPY_PATTERN(fluentSource, "autofill-card-network-mir"), + ), + FTL.Message( + id=FTL.Identifier("autofill-card-network-unionpay"), + value=COPY_PATTERN(fluentSource, "autofill-card-network-unionpay"), + ), + FTL.Message( + id=FTL.Identifier("autofill-card-network-visa"), + value=COPY_PATTERN(fluentSource, "autofill-card-network-visa"), + ), + ], + ) diff --git a/toolkit/components/formautofill/ProfileAutoCompleteResult.sys.mjs b/toolkit/components/formautofill/ProfileAutoCompleteResult.sys.mjs index 15fc1a520c50..361082dc55d5 100644 --- a/toolkit/components/formautofill/ProfileAutoCompleteResult.sys.mjs +++ b/toolkit/components/formautofill/ProfileAutoCompleteResult.sys.mjs @@ -12,7 +12,7 @@ ChromeUtils.defineESModuleGetters(lazy, { ChromeUtils.defineLazyGetter( lazy, "l10n", - () => new Localization(["browser/preferences/formAutofill.ftl"], true) + () => new Localization(["toolkit/formautofill/formAutofill.ftl"], true) ); class ProfileAutoCompleteResult { @@ -277,10 +277,19 @@ export class AddressResult extends ProfileAutoCompleteResult { } _generateLabels(focusedFieldName, allFieldNames, profiles) { + const manageLabel = lazy.l10n.formatValueSync( + "autofill-manage-addresses-label" + ); + if (this._isInputAutofilled) { return [ { primary: "", secondary: "" }, // Clear button - { primary: "", secondary: "" }, // Footer + // Footer + { + primary: "", + secondary: "", + manageLabel, + }, ]; } @@ -306,6 +315,10 @@ export class AddressResult extends ProfileAutoCompleteResult { ), }; }); + + const focusedCategory = + lazy.FormAutofillUtils.getCategoryFromFieldName(focusedFieldName); + // Add an empty result entry for footer. Its content will come from // the footer binding, so don't assign any value to it. // The additional properties: categories and focusedCategory are required of @@ -313,12 +326,11 @@ export class AddressResult extends ProfileAutoCompleteResult { labels.push({ primary: "", secondary: "", + manageLabel, categories: lazy.FormAutofillUtils.getCategoriesFromFieldNames( this._allFieldNames ), - focusedCategory: lazy.FormAutofillUtils.getCategoryFromFieldName( - this._focusedFieldName - ), + focusedCategory, }); return labels; @@ -385,10 +397,19 @@ export class CreditCardResult extends ProfileAutoCompleteResult { ]; } + const manageLabel = lazy.l10n.formatValueSync( + "autofill-manage-payment-methods-label" + ); + if (this._isInputAutofilled) { return [ { primary: "", secondary: "" }, // Clear button - { primary: "", secondary: "" }, // Footer + // Footer + { + primary: "", + secondary: "", + manageLabel, + }, ]; } @@ -431,8 +452,17 @@ export class CreditCardResult extends ProfileAutoCompleteResult { image, }; }); + + const focusedCategory = + lazy.FormAutofillUtils.getCategoryFromFieldName(focusedFieldName); + // Add an empty result entry for footer. - labels.push({ primary: "", secondary: "" }); + labels.push({ + primary: "", + secondary: "", + manageLabel, + focusedCategory, + }); return labels; } diff --git a/toolkit/locales/en-US/toolkit/formautofill/formAutofill.ftl b/toolkit/locales/en-US/toolkit/formautofill/formAutofill.ftl index 2dbf721213a4..34489e5b66c2 100644 --- a/toolkit/locales/en-US/toolkit/formautofill/formAutofill.ftl +++ b/toolkit/locales/en-US/toolkit/formautofill/formAutofill.ftl @@ -52,3 +52,21 @@ credit-card-capture-save-new-button = credit-card-capture-update-button = .label = Update existing card .accessKey = U + +# Used as a label for the button, displayed at the bottom of the dropdown suggestion, to open Form Autofill browser preferences. +autofill-manage-addresses-label = Manage addresses + +# Used as a label for the button, displayed at the bottom of the dropdown suggestion, to open Form Autofill browser preferences. +autofill-manage-payment-methods-label = Manage payment methods + +## These are brand names and should only be translated when a locale-specific name for that brand is in common use + +autofill-card-network-amex = American Express +autofill-card-network-cartebancaire = Carte Bancaire +autofill-card-network-diners = Diners Club +autofill-card-network-discover = Discover +autofill-card-network-jcb = JCB +autofill-card-network-mastercard = MasterCard +autofill-card-network-mir = MIR +autofill-card-network-unionpay = Union Pay +autofill-card-network-visa = Visa