Bug 1504457 Migrate subcribe.js to Fluent r=flod,jaws
authorCollin Wing <masterkrombi@gmail.com>
Wed, 07 Nov 2018 13:08:43 +0000
changeset 445059 2f99ff39ada663ff6e18f5007b39fe85c8347665
parent 445058 9dfe0f1937e98bc9534c21e7700480efe4a74ff8
child 445060 5a43a256230ed6905945642bf5a9d7b81e4e6927
push id109671
push userjwein@mozilla.com
push dateThu, 08 Nov 2018 03:00:23 +0000
treeherdermozilla-inbound@2f99ff39ada6 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersflod, jaws
bugs1504457
milestone65.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1504457 Migrate subcribe.js to Fluent r=flod,jaws Differential Revision: https://phabricator.services.mozilla.com/D10863
devtools/startup/aboutdevtools/subscribe.js
devtools/startup/locales/en-US/aboutDevTools.ftl
devtools/startup/locales/en-US/aboutdevtools.properties
python/l10n/fluent_migrations/bug_1504457_aboutdevtools.py
--- a/devtools/startup/aboutdevtools/subscribe.js
+++ b/devtools/startup/aboutdevtools/subscribe.js
@@ -5,42 +5,37 @@
 "use strict";
 
 /**
  * This file handles the newsletter subscription form on about:devtools.
  * It is largely inspired from https://mozilla.github.io/basket-example/
  */
 
 window.addEventListener("load", function() {
-  const { Services } = ChromeUtils.import("resource://gre/modules/Services.jsm", {});
-
   // Timeout for the subscribe XHR.
   const REQUEST_TIMEOUT = 5000;
 
-  const ABOUTDEVTOOLS_STRINGS = "chrome://devtools-startup/locale/aboutdevtools.properties";
-  const aboutDevtoolsBundle = Services.strings.createBundle(ABOUTDEVTOOLS_STRINGS);
-
   const emailInput = document.getElementById("email");
   const newsletterErrors = document.getElementById("newsletter-errors");
   const newsletterForm = document.getElementById("newsletter-form");
   const newsletterPrivacySection = document.getElementById("newsletter-privacy");
   const newsletterThanks = document.getElementById("newsletter-thanks");
 
   /**
    * Update the error panel to display the provided errors. If the argument is null or
    * empty, a default error message will be displayed.
    *
    * @param {Array} errors
    *        Array of strings, each item being an error message to display.
    */
-  function updateErrorPanel(errors) {
+  async function updateErrorPanel(errors) {
     clearErrorPanel();
 
     if (!errors || errors.length == 0) {
-      errors = [aboutDevtoolsBundle.GetStringFromName("newsletter.error.unknown")];
+      errors = [await document.l10n.formatValues([{id: "newsletter-error-unknown"}])];
     }
 
     // Create errors markup.
     const fragment = document.createDocumentFragment();
     for (const error of errors) {
       const item = document.createElement("p");
       item.classList.add("error");
       item.appendChild(document.createTextNode(error));
@@ -87,43 +82,46 @@ window.addEventListener("load", function
     evt.preventDefault();
     evt.stopPropagation();
 
     // New submission, clear old errors
     clearErrorPanel();
 
     const xhr = new XMLHttpRequest();
 
-    xhr.onload = function(r) {
+    xhr.onload = async function(r) {
       if (r.target.status >= 200 && r.target.status < 300) {
         const {response} = r.target;
 
         if (response.success === true) {
           // Hide form and show success message.
           newsletterForm.style.display = "none";
           newsletterThanks.classList.add("show");
         } else {
           // We trust the error messages from the service to be meaningful for the user.
           updateErrorPanel(response.errors);
         }
       } else {
         const {status, statusText} = r.target;
         const statusInfo = `${status} - ${statusText}`;
-        const error = aboutDevtoolsBundle
-          .formatStringFromName("newsletter.error.common", [statusInfo], 1);
+        const error = await document.l10n.formatValues([
+          { id: "newsletter-error-common", args: { errorDescription: statusInfo } },
+        ]);
         updateErrorPanel([error]);
       }
     };
 
     xhr.onerror = () => {
       updateErrorPanel();
     };
 
-    xhr.ontimeout = () => {
-      const error = aboutDevtoolsBundle.GetStringFromName("newsletter.error.timeout");
+    xhr.ontimeout = async () => {
+      const error = await document.l10n.formatValues([
+        { id: "newsletter-error-timeout" },
+      ]);
       updateErrorPanel([error]);
     };
 
     const url = newsletterForm.getAttribute("action");
 
     xhr.open("POST", url, true);
     xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
     xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
--- a/devtools/startup/locales/en-US/aboutDevTools.ftl
+++ b/devtools/startup/locales/en-US/aboutDevTools.ftl
@@ -43,10 +43,15 @@ features-responsive-title = Responsive D
 features-responsive-desc = Test sites on emulated devices in your browser. <a data-l10n-name="learn-more">{ features-learn-more }</a>
 features-visual-editing-title = Visual Editing
 features-visual-editing-desc = Fine-tune animations, alignment and padding. <a data-l10n-name="learn-more">{ features-learn-more }</a>
 features-performance-title = Performance
 features-performance-desc = Unblock bottlenecks, streamline processes, optimize assets. <a data-l10n-name="learn-more">{ features-learn-more }</a>
 features-memory-title = Memory
 features-memory-desc = Find memory leaks and make your application zippy. <a data-l10n-name="learn-more">{ features-learn-more }</a>
 # Variables:
+#   $errorDescription (String) - The error that occurred e.g. 404 - Not Found
+newsletter-error-common = Subscription request failed ({ $errorDescription }).
+newsletter-error-unknown = An unexpected error occurred.
+newsletter-error-timeout = Subscription request timed out.
+# Variables:
 #   $shortcut (String) - The keyboard shortcut used for the tool
 welcome-message = You’ve successfully enabled Developer Tools! To get started, explore the Web Developer menu or open the tools with { $shortcut }.
deleted file mode 100644
--- a/devtools/startup/locales/en-US/aboutdevtools.properties
+++ /dev/null
@@ -1,18 +0,0 @@
-# This Source Code Form is subject to the terms of the Mozilla Public
-# 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 These strings are used in the about:devtools page.
-
-# LOCALIZATION NOTE (newsletter.error.common): error text displayed when the newsletter
-# subscription failed. The argument will be replaced with request's status code and status
-# text (e.g. "404 - Not Found")
-newsletter.error.common=Subscription request failed (%S).
-
-# LOCALIZATION NOTE (newsletter.error.unknown): error text displayed when the newsletter
-# subscription failed for an unexpected reason.
-newsletter.error.unknown=An unexpected error occurred.
-
-# LOCALIZATION NOTE (newsletter.error.timeout): error text displayed when the newsletter
-# subscription timed out.
-newsletter.error.timeout=Subscription request timed out.
new file mode 100644
--- /dev/null
+++ b/python/l10n/fluent_migrations/bug_1504457_aboutdevtools.py
@@ -0,0 +1,40 @@
+from __future__ import absolute_import
+import fluent.syntax.ast as FTL
+from fluent.migrate.helpers import transforms_from
+from fluent.migrate.helpers import VARIABLE_REFERENCE
+from fluent.migrate.helpers import TERM_REFERENCE
+from fluent.migrate.helpers import MESSAGE_REFERENCE
+from fluent.migrate import REPLACE
+from fluent.migrate import COPY
+from fluent.migrate import CONCAT
+
+def migrate(ctx):
+    """Bug 1504457 -  Migrate subscribe.js strings of about:devtools to Fluent, part {index}"""
+
+    ctx.add_transforms(
+        "devtools/startup/aboutDevTools.ftl",
+        "devtools/startup/aboutDevTools.ftl",
+        transforms_from(
+"""
+newsletter-error-unknown = { COPY("devtools/startup/aboutdevtools.properties", "newsletter.error.unknown")}
+newsletter-error-timeout = { COPY("devtools/startup/aboutdevtools.properties", "newsletter.error.timeout")}
+"""
+        )
+    )
+
+    ctx.add_transforms(
+        "devtools/startup/aboutDevTools.ftl",
+        "devtools/startup/aboutDevTools.ftl",
+        [
+            FTL.Message(
+                id=FTL.Identifier("newsletter-error-common"),
+                value=REPLACE(
+                    "devtools/startup/aboutdevtools.properties",
+                    "newsletter.error.common",
+                    {
+                        "%S": VARIABLE_REFERENCE("errorDescription")
+                    }
+                )
+            )
+        ]
+    )