Bug 41698: Reword the recommendation badges in about:addons

Firefox strings use { -brand-product-name }.
As a result, it seems that the fork is recommending extensions, whereas
AMO curators are doing that.
So, we replace the strings with custom ones that clarify that Mozilla is
recommending them.

We assign the strings with JS because our translation backend does not
support Fluent attributes, yet, but once it does, we should switch to
them, instead.

Upstream bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1825033

toolkit/content/widgets/moz-support-link/moz-support-link.mjs

@@ -56,6 +56,23 @@ export default class MozSupportLink extends HTMLAnchorElement {
       !this.getAttribute("data-l10n-name") &&
       !this.childElementCount
     ) {
+      const fixupL10nId = this.getAttribute("data-basebrowser-l10n-fixup");
+      if (fixupL10nId) {
+        document.l10n.formatValue(fixupL10nId).then(title => {
+          this.setAttribute("title", title);
+          // NOTE: Mozilla adds identical aria-label and title attributes. This is
+          // generally bad practice because this link has no text content, so the
+          // title alone will already act as the accessible name.
+          // Normally setting both aria-label and title will lead to the title being
+          // used as the accessible description, but since they are identical
+          // the LocalAccessible::Description method will make an exception and keep
+          // the description empty.
+          // Since this component is outside of our fork's control, we follow the
+          // same practice just in case Mozilla ever adds some text content.
+          this.setAttribute("aria-label", title);
+        });
+        return;
+      }
       document.l10n.setAttributes(this, "moz-support-link-text");
     }
     document.l10n.translateFragment(this);

toolkit/mozapps/extensions/content/aboutaddons.html

@@ -35,6 +35,8 @@
     <link rel="localization" href="toolkit/about/aboutAddons.ftl" />
     <link rel="localization" href="toolkit/about/abuseReports.ftl" />
 
+    <link rel="localization" href="browser/base-browser.ftl" />
+
     <!-- Defer scripts so all the templates are loaded by the time they run. -->
     <script
       defer
@@ -357,7 +359,7 @@
                 is="moz-support-link"
                 support-page="add-on-badges"
                 utm-content="promoted-addon-badge"
-                data-l10n-id="addon-badge-recommended2"
+                data-basebrowser-l10n-fixup="basebrowser-addon-badge-recommended"
                 hidden
               >
               </a>
@@ -375,7 +377,7 @@
                 is="moz-support-link"
                 support-page="add-on-badges"
                 utm-content="promoted-addon-badge"
-                data-l10n-id="addon-badge-verified2"
+                data-basebrowser-l10n-fixup="basebrowser-addon-badge-verified"
                 hidden
               >
               </a>