diff options
Diffstat (limited to 'toolkit/components/formautofill/ProfileAutoCompleteResult.sys.mjs')
| -rw-r--r-- | toolkit/components/formautofill/ProfileAutoCompleteResult.sys.mjs | 205 |
1 files changed, 146 insertions, 59 deletions
diff --git a/toolkit/components/formautofill/ProfileAutoCompleteResult.sys.mjs b/toolkit/components/formautofill/ProfileAutoCompleteResult.sys.mjs index 52ed8bed03..68df30f8b5 100644 --- a/toolkit/components/formautofill/ProfileAutoCompleteResult.sys.mjs +++ b/toolkit/components/formautofill/ProfileAutoCompleteResult.sys.mjs @@ -131,6 +131,12 @@ class ProfileAutoCompleteResult { if (typeof label == "string") { return label; } + + let type = this.getTypeOfIndex(index); + if (type == "clear" || type == "manage") { + return label.primary; + } + return JSON.stringify(label); } @@ -141,6 +147,16 @@ class ProfileAutoCompleteResult { * @returns {string} The comment at the specified index */ getCommentAt(index) { + let type = this.getTypeOfIndex(index); + switch (type) { + case "clear": + return '{"fillMessageName": "FormAutofill:ClearForm"}'; + case "manage": + return '{"fillMessageName": "FormAutofill:OpenPreferences"}'; + case "insecure": + return '{"noLearnMore": true }'; + } + const item = this.getAt(index); return item.comment ?? JSON.stringify(this._matchingProfiles[index]); } @@ -157,14 +173,16 @@ class ProfileAutoCompleteResult { return itemStyle; } - if (index == this._popupLabels.length - 1) { - return "autofill-footer"; - } - if (this._isInputAutofilled) { - return "autofill-clear-button"; + switch (this.getTypeOfIndex(index)) { + case "manage": + return "action"; + case "clear": + return "action"; + case "insecure": + return "insecureWarning"; + default: + return "autofill"; } - - return "autofill-profile"; } /** @@ -205,6 +223,24 @@ class ProfileAutoCompleteResult { removeValueAt(_index) { // There is no plan to support removing profiles via autocomplete. } + + /** + * Returns a type string that identifies te type of row at the given index. + * + * @param {number} index The index of the result requested + * @returns {string} The type at the specified index + */ + getTypeOfIndex(index) { + if (this._isInputAutofilled && index == 0) { + return "clear"; + } + + if (index == this._popupLabels.length - 1) { + return "manage"; + } + + return "item"; + } } export class AddressResult extends ProfileAutoCompleteResult { @@ -281,18 +317,26 @@ export class AddressResult extends ProfileAutoCompleteResult { "autofill-manage-addresses-label" ); + let footerItem = { + primary: manageLabel, + secondary: "", + }; + if (this._isInputAutofilled) { - return [ - { primary: "", secondary: "" }, // Clear button - // Footer + const clearLabel = lazy.l10n.formatValueSync("autofill-clear-form-label"); + + let labels = [ { - primary: "", - secondary: "", - manageLabel, + primary: clearLabel, }, ]; + labels.push(footerItem); + return labels; } + let focusedCategory = + lazy.FormAutofillUtils.getCategoryFromFieldName(focusedFieldName); + // Skip results without a primary label. let labels = profiles .filter(profile => { @@ -306,35 +350,88 @@ export class AddressResult extends ProfileAutoCompleteResult { ) { primaryLabel = profile["-moz-street-address-one-line"]; } + + let profileFields = allFieldNames.filter( + fieldName => !!profile[fieldName] + ); + + let categories = + lazy.FormAutofillUtils.getCategoriesFromFieldNames(profileFields); + let status = this.getStatusNote(categories, focusedCategory); + let secondary = this._getSecondaryLabel( + focusedFieldName, + allFieldNames, + profile + ); + const ariaLabel = [primaryLabel, secondary, status] + .filter(chunk => !!chunk) // Exclude empty chunks. + .join(" "); return { primary: primaryLabel, - secondary: this._getSecondaryLabel( - focusedFieldName, - allFieldNames, - profile - ), + secondary, + status, + ariaLabel, }; }); - const focusedCategory = - lazy.FormAutofillUtils.getCategoryFromFieldName(focusedFieldName); + let allCategories = + lazy.FormAutofillUtils.getCategoriesFromFieldNames(allFieldNames); + + if (allCategories && allCategories.length) { + let statusItem = { + primary: "", + secondary: "", + status: this.getStatusNote(allCategories, focusedCategory), + style: "status", + }; + labels.push(statusItem); + } - // 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 - // the popup to generate autofill hint on the footer. - labels.push({ - primary: "", - secondary: "", - manageLabel, - categories: lazy.FormAutofillUtils.getCategoriesFromFieldNames( - this._allFieldNames - ), - focusedCategory, - }); + labels.push(footerItem); return labels; } + + getStatusNote(categories, focusedCategory) { + if (!categories || !categories.length) { + return ""; + } + + // If the length of categories is 1, that means all the fillable fields are in the same + // category. We will change the way to inform user according to this flag. When the value + // is true, we show "Also autofills ...", otherwise, show "Autofills ..." only. + let hasExtraCategories = categories.length > 1; + // Show the categories in certain order to conform with the spec. + let orderedCategoryList = [ + "address", + "name", + "organization", + "tel", + "email", + ]; + let showCategories = hasExtraCategories + ? orderedCategoryList.filter( + category => + categories.includes(category) && category != focusedCategory + ) + : [orderedCategoryList.find(category => category == focusedCategory)]; + + let formatter = new Intl.ListFormat(undefined, { + style: "narrow", + }); + + let categoriesText = showCategories.map(category => + lazy.l10n.formatValueSync("autofill-category-" + category) + ); + categoriesText = formatter.format(categoriesText); + + let statusTextTmplKey = hasExtraCategories + ? "autofill-phishing-warningmessage-extracategory" + : "autofill-phishing-warningmessage"; + return lazy.l10n.formatValueSync(statusTextTmplKey, { + categories: categoriesText, + }); + } } export class CreditCardResult extends ProfileAutoCompleteResult { @@ -401,16 +498,20 @@ export class CreditCardResult extends ProfileAutoCompleteResult { "autofill-manage-payment-methods-label" ); + let footerItem = { + primary: manageLabel, + }; + if (this._isInputAutofilled) { - return [ - { primary: "", secondary: "" }, // Clear button - // Footer + const clearLabel = lazy.l10n.formatValueSync("autofill-clear-form-label"); + + let labels = [ { - primary: "", - secondary: "", - manageLabel, + primary: clearLabel, }, ]; + labels.push(footerItem); + return labels; } // Skip results without a primary label. @@ -446,37 +547,23 @@ export class CreditCardResult extends ProfileAutoCompleteResult { .filter(chunk => !!chunk) // Exclude empty chunks. .join(" "); return { - primary, - secondary, + primary: primary.toString().replaceAll("*", "•"), + secondary: secondary.toString().replaceAll("*", "•"), ariaLabel, image, }; }); - const focusedCategory = - lazy.FormAutofillUtils.getCategoryFromFieldName(focusedFieldName); - - // Add an empty result entry for footer. - labels.push({ - primary: "", - secondary: "", - manageLabel, - focusedCategory, - }); + labels.push(footerItem); return labels; } - getStyleAt(index) { - const itemStyle = this.getAt(index).style; - if (itemStyle) { - return itemStyle; - } - + getTypeOfIndex(index) { if (!this._isSecure) { - return "autofill-insecureWarning"; + return "insecure"; } - return super.getStyleAt(index); + return super.getTypeOfIndex(index); } } |