Localization.formatValues should accept an array of object. (#198)

Author: zbraniecki

fluent-dom/src/dom_localization.js

@@ -314,13 +314,13 @@ export default class DOMLocalization extends Localization {
    * array.
    *
    * @param {Element} element
-   * @returns {Array<string, Object>}
+   * @returns {Object}
    * @private
    */
   getKeysForElement(element) {
-    return [
-      element.getAttribute(L10NID_ATTR_NAME),
-      JSON.parse(element.getAttribute(L10NARGS_ATTR_NAME) || null)
-    ];
+    return {
+      id: element.getAttribute(L10NID_ATTR_NAME),
+      args: JSON.parse(element.getAttribute(L10NARGS_ATTR_NAME) || null)
+    };
   }
 }

fluent-dom/src/localization.js

@@ -31,7 +31,7 @@ export default class Localization {
    * DOMLocalization. In case of errors, fetch the next context in the
    * fallback chain.
    *
-   * @param   {Array<Array>}          keys    - Translation keys to format.
+   * @param   {Array<Object>}         keys    - Translation keys to format.
    * @param   {Function}              method  - Formatting function.
    * @returns {Promise<Array<string|Object>>}
    * @private
@@ -64,8 +64,8 @@ export default class Localization {
    * objects which are suitable for the translation of DOM elements.
    *
    *     docL10n.formatMessages([
-   *       ['hello', { who: 'Mary' }],
-   *       ['welcome', undefined]
+   *       {id: 'hello', args: { who: 'Mary' }},
+   *       {id: 'welcome'}
    *     ]).then(console.log);
    *
    *     // [
@@ -75,7 +75,7 @@ export default class Localization {
    *
    * Returns a Promise resolving to an array of the translation strings.
    *
-   * @param   {Array<Array>} keys
+   * @param   {Array<Object>} keys
    * @returns {Promise<Array<{value: string, attributes: Object}>>}
    * @private
    */
@@ -90,16 +90,16 @@ export default class Localization {
    * either be simple string identifiers or `[id, args]` arrays.
    *
    *     docL10n.formatValues([
-   *       ['hello', { who: 'Mary' }],
-   *       ['hello', { who: 'John' }],
-   *       ['welcome']
+   *       {id: 'hello', args: { who: 'Mary' }},
+   *       {id: 'hello', args: { who: 'John' }},
+   *       {id: 'welcome'}
    *     ]).then(console.log);
    *
    *     // ['Hello, Mary!', 'Hello, John!', 'Welcome!']
    *
    * Returns a Promise resolving to an array of the translation strings.
    *
-   * @param   {Array<Array>} keys
+   * @param   {Array<Object>} keys
    * @returns {Promise<Array<string>>}
    */
   formatValues(keys) {
@@ -129,7 +129,7 @@ export default class Localization {
    * @returns {Promise<string>}
    */
   async formatValue(id, args) {
-    const [val] = await this.formatValues([[id, args]]);
+    const [val] = await this.formatValues([{id, args}]);
     return val;
   }
 
@@ -249,17 +249,17 @@ function keysFromContext(method, ctx, keys, translations) {
   const messageErrors = [];
   const missingIds = new Set();
 
-  keys.forEach((key, i) => {
+  keys.forEach(({id, args}, i) => {
     if (translations[i] !== undefined) {
       return;
     }
 
-    if (ctx.hasMessage(key[0])) {
+    if (ctx.hasMessage(id)) {
       messageErrors.length = 0;
-      translations[i] = method(ctx, messageErrors, key[0], key[1]);
+      translations[i] = method(ctx, messageErrors, id, args);
       // XXX: Report resolver errors
     } else {
-      missingIds.add(key[0]);
+      missingIds.add(id);
     }
   });
 

fluent-dom/test/localization_test.js

@@ -11,14 +11,14 @@ async function* mockGenerateMessages(resourceIds) {
 suite("formatMessages", function() {
   test("returns a translation", async function() {
     const loc = new Localization(["test.ftl"], mockGenerateMessages);
-    const translations = await loc.formatMessages([["key1"]]);
+    const translations = await loc.formatMessages([{id: "key1"}]);
 
     assert.equal(translations[0].value, "Key 1");
   });
 
   test("returns undefined for a missing translation", async function() {
     const loc = new Localization(["test.ftl"], mockGenerateMessages);
-    const translations = await loc.formatMessages([["missing_key"]]);
+    const translations = await loc.formatMessages([{id: "missing_key"}]);
 
     // Make sure that the returned value here is `undefined`.
     // This allows bindings to handle missing translations.