Bug 1612496 - Use data-l10n-id to localize Tips and Interventions. r=harry

Differential Revision: https://phabricator.services.mozilla.com/D61486 --HG-- extra : moz-landing-system : lando
2020-02-04 11:10:59 +00:00 · 2020-02-04 11:10:59 +00:00 · 29429b36f7
--- a/browser/base/content/browser.xhtml
+++ b/browser/base/content/browser.xhtml
@ -66,6 +66,7 @@
  <link rel="localization" href="browser/menubar.ftl"/>
  <link rel="localization" href="browser/protectionsPanel.ftl"/>
  <link rel="localization" href="browser/appmenu.ftl"/>
+  <link rel="localization" href="preview/interventions.ftl"/>

  <title
    data-l10n-id="browser-main-window-title"
--- a/browser/components/urlbar/UrlbarProviderInterventions.jsm
+++ b/browser/components/urlbar/UrlbarProviderInterventions.jsm
@ -26,7 +26,7 @@ XPCOMUtils.defineLazyModuleGetters(this, {
 });

 XPCOMUtils.defineLazyGetter(this, "logger", () =>
-  Log.repository.getLogger("Urlbar.Provider.TopSites")
+  Log.repository.getLogger("Urlbar.Provider.Interventions")
 );

 XPCOMUtils.defineLazyGetter(this, "appUpdater", () => new AppUpdater());
@ -373,6 +373,55 @@ class QueryScorer {
  }
 }

+/**
+ * Gets appropriate l10n values for each tip's payload.
+ * @param {string} tip a value from the TIPS enum
+ * @returns {object} an Object shaped as { textData, buttonTextData, helpUrl }
+ */
+function getL10nPropertiesForTip(tip) {
+  const baseURL = "https://support.mozilla.org/kb/";
+  switch (tip) {
+    case TIPS.CLEAR:
+      return {
+        textData: { id: "intervention-clear-data" },
+        buttonTextData: { id: "intervention-clear-data-confirm" },
+        helpUrl: baseURL + "delete-browsing-search-download-history-firefox",
+      };
+    case TIPS.REFRESH:
+      return {
+        textData: { id: "intervention-refresh-profile" },
+        buttonTextData: { id: "intervention-refresh-profile-confirm" },
+        helpUrl: baseURL + "refresh-firefox-reset-add-ons-and-settings",
+      };
+    case TIPS.UPDATE_ASK:
+      return {
+        textData: { id: "intervention-update-ask" },
+        buttonTextData: { id: "intervention-update-ask-confirm" },
+        helpUrl: baseURL + "update-firefox-latest-release",
+      };
+    case TIPS.UPDATE_REFRESH:
+      return {
+        textData: { id: "intervention-update-refresh" },
+        buttonTextData: { id: "intervention-update-refresh-confirm" },
+        helpUrl: baseURL + "refresh-firefox-reset-add-ons-and-settings",
+      };
+    case TIPS.UPDATE_RESTART:
+      return {
+        textData: { id: "intervention-update-restart" },
+        buttonTextData: { id: "intervention-update-restart-confirm" },
+        helpUrl: baseURL + "update-firefox-latest-release",
+      };
+    case TIPS.UPDATE_WEB:
+      return {
+        textData: { id: "intervention-update-web" },
+        buttonTextData: { id: "intervention-update-web-confirm" },
+        helpUrl: baseURL + "update-firefox-latest-release",
+      };
+    default:
+      throw new Error("Unknown TIP type.");
+  }
+}
+
 /**
 * A provider that returns actionable tip results when the user is performing
 * a search related to those actions.
@ -401,11 +450,6 @@ class ProviderInterventions extends UrlbarProvider {
    for (let [id, phrases] of Object.entries(DOCUMENTS)) {
      this.queryScorer.addDocument({ id, phrases });
    }
-
-    this._l10n = new Localization([
-      "branding/brand.ftl",
-      "preview/interventions.ftl",
-    ]);
  }

  /**
@ -527,61 +571,7 @@ class ProviderInterventions extends UrlbarProvider {

    result.suggestedIndex = 1;

-    let l10nkeys = [];
-    switch (this.currentTip) {
-      case TIPS.CLEAR:
-        l10nkeys = [
-          { id: "intervention-clear-data" },
-          { id: "intervention-clear-data-confirm" },
-        ];
-        result.payload.helpUrl =
-          "https://support.mozilla.org/kb/delete-browsing-search-download-history-firefox";
-        break;
-      case TIPS.REFRESH:
-        l10nkeys = [
-          { id: "intervention-refresh-profile" },
-          { id: "intervention-refresh-profile-confirm" },
-        ];
-        result.payload.helpUrl =
-          "https://support.mozilla.org/kb/refresh-firefox-reset-add-ons-and-settings";
-        break;
-      case TIPS.UPDATE_ASK:
-        l10nkeys = [
-          { id: "intervention-update-ask" },
-          { id: "intervention-update-ask-confirm" },
-        ];
-        result.payload.helpUrl =
-          "https://support.mozilla.org/kb/update-firefox-latest-release";
-        break;
-      case TIPS.UPDATE_REFRESH:
-        l10nkeys = [
-          { id: "intervention-update-refresh" },
-          { id: "intervention-update-refresh-confirm" },
-        ];
-        result.payload.helpUrl =
-          "https://support.mozilla.org/kb/refresh-firefox-reset-add-ons-and-settings";
-        break;
-      case TIPS.UPDATE_RESTART:
-        l10nkeys = [
-          { id: "intervention-update-restart" },
-          { id: "intervention-update-restart-confirm" },
-        ];
-        result.payload.helpUrl =
-          "https://support.mozilla.org/kb/update-firefox-latest-release";
-        break;
-      case TIPS.UPDATE_WEB:
-        l10nkeys = [
-          { id: "intervention-update-web" },
-          { id: "intervention-update-web-confirm" },
-        ];
-        result.payload.helpUrl =
-          "https://support.mozilla.org/kb/update-firefox-latest-release";
-        break;
-    }
-
-    let [mainText, confirmButtonText] = await this._l10n.formatValues(l10nkeys);
-    result.payload.text = mainText;
-    result.payload.buttonText = confirmButtonText;
+    Object.assign(result.payload, getL10nPropertiesForTip(this.currentTip));

    if (!this.queries.has(queryContext)) {
      return;
--- a/browser/components/urlbar/UrlbarProviderSearchTips.jsm
+++ b/browser/components/urlbar/UrlbarProviderSearchTips.jsm
@ -92,8 +92,6 @@ class ProviderSearchTips extends UrlbarProvider {
    this.showedTipInCurrentSession = false;
    // Whether we've shown a tip in the current engagement.
    this.showedTipInCurrentEngagement = false;
-
-    this._l10n = new Localization(["browser/browser.ftl"]);
  }

  get PRIORITY() {
@ -160,7 +158,7 @@ class ProviderSearchTips extends UrlbarProvider {
      UrlbarUtils.RESULT_TYPE.TIP,
      UrlbarUtils.RESULT_SOURCE.OTHER_LOCAL,
      {
-        buttonText: await this._l10n.formatValue("urlbar-search-tips-confirm"),
+        buttonTextData: { id: "urlbar-search-tips-confirm" },
        icon: defaultEngine.iconURI.spec,
      }
    );
@ -168,21 +166,21 @@ class ProviderSearchTips extends UrlbarProvider {
    switch (tip) {
      case TIPS.ONBOARD:
        result.heuristic = true;
-        result.payload.text = await this._l10n.formatValue(
-          "urlbar-search-tips-onboard",
-          {
+        result.payload.textData = {
+          id: "urlbar-search-tips-onboard",
+          args: {
            engineName: defaultEngine.name,
-          }
-        );
+          },
+        };
        break;
      case TIPS.REDIRECT:
        result.heuristic = false;
-        result.payload.text = await this._l10n.formatValue(
-          "urlbar-search-tips-redirect",
-          {
+        result.payload.textData = {
+          id: "urlbar-search-tips-redirect",
+          args: {
            engineName: defaultEngine.name,
-          }
-        );
+          },
+        };
        break;
    }

--- a/browser/components/urlbar/UrlbarUtils.jsm
+++ b/browser/components/urlbar/UrlbarUtils.jsm
@ -91,7 +91,9 @@ var UrlbarUtils = {
    // Payload: { url, icon, device, title }
    REMOTE_TAB: 6,
    // An actionable message to help the user with their query.
-    // Payload: { text, buttonText, data, [buttonUrl], [helpUrl] }
+    // textData and buttonTextData are objects containing an l10n id and args.
+    // If a tip is untranslated it's possible to provide text and buttonText.
+    // Payload: { icon, textData, buttonTextData, [buttonUrl], [helpUrl] }
    TIP: 7,
  },

--- a/browser/components/urlbar/UrlbarView.jsm
+++ b/browser/components/urlbar/UrlbarView.jsm
@ -1055,10 +1055,28 @@ class UrlbarView {
    favicon.src = result.payload.icon || UrlbarUtils.ICON.TIP;

    let title = item._elements.get("title");
-    title.textContent = result.payload.text;
+    // Add-ons will provide text, rather than l10n ids.
+    if (result.payload.textData) {
+      this.document.l10n.setAttributes(
+        title,
+        result.payload.textData.id,
+        result.payload.textData.args
+      );
+    } else {
+      title.textContent = result.payload.text;
+    }

    let tipButton = item._elements.get("tipButton");
-    tipButton.textContent = result.payload.buttonText;
+    // Add-ons will provide buttonText, rather than l10n ids.
+    if (result.payload.buttonTextData) {
+      this.document.l10n.setAttributes(
+        tipButton,
+        result.payload.buttonTextData.id,
+        result.payload.buttonTextData.args
+      );
+    } else {
+      tipButton.textContent = result.payload.buttonText;
+    }

    let helpIcon = item._elements.get("helpButton");
    helpIcon.style.display = result.payload.helpUrl ? "" : "none";
--- a/browser/components/urlbar/docs/overview.rst
+++ b/browser/components/urlbar/docs/overview.rst
@ -377,15 +377,26 @@ The following RESULT_TYPEs are supported:
 .. highlight:: JavaScript
 .. code::

+    // An open tab.
    // Payload: { icon, url, userContextId }
    TAB_SWITCH: 1,
+    // A search suggestion or engine.
    // Payload: { icon, suggestion, keyword, query, keywordOffer, inPrivateWindow, isPrivateEngine }
    SEARCH: 2,
+    // A common url/title tuple, may be a bookmark with tags.
    // Payload: { icon, url, title, tags }
    URL: 3,
+    // A bookmark keyword.
    // Payload: { icon, url, keyword, postData }
    KEYWORD: 4,
+    // A WebExtension Omnibox result.
    // Payload: { icon, keyword, title, content }
    OMNIBOX: 5,
+    // A tab from another synced device.
    // Payload: { icon, url, device, title }
    REMOTE_TAB: 6,
+    // An actionable message to help the user with their query.
+    // textData and buttonTextData are objects containing an l10n id and args.
+    // If a tip is untranslated it's possible to provide text and buttonText.
+    // Payload: { icon, textData, buttonTextData, [buttonUrl], [helpUrl] }
+    TIP: 7,
--- a/browser/components/urlbar/tests/UrlbarTestUtils.jsm
+++ b/browser/components/urlbar/tests/UrlbarTestUtils.jsm
@ -143,6 +143,7 @@ var UrlbarTestUtils = {
    let actions = element.getElementsByClassName("urlbarView-action");
    let urls = element.getElementsByClassName("urlbarView-url");
    let typeIcon = element.querySelector(".urlbarView-type-icon");
+    await win.document.l10n.translateFragment(element);
    details.displayed = {
      title: element.getElementsByClassName("urlbarView-title")[0].textContent,
      action: actions.length ? actions[0].textContent : null,