Message: Ensure spread value is always an array (bugfix)

or else simple FormattedText was output as individual characters
(`“t””h””i””s”`). Added some test to prevent this as well as ensuring
the proper structure of Replaced Elements.

Borrowed alwaysArray from Globalizejs.

Ref #76

Signed-off-by: Frédéric Miserey <frederic@none.net>

Author: Frédéric Miserey

src/generator.js

@@ -1,5 +1,6 @@
 import React from "react";
 import Globalize from "globalize";
+import alwaysArray from "./util/always-array";
 
 var commonPropNames = ["elements", "locale"];
 
@@ -46,8 +47,8 @@ function generator(fn, localPropNames, options) {
             this.globalizePropValues[0] = props.children;
 
             beforeFormat.call(this, props);
-            var formattedValue = this.globalize[fn].apply(this.globalize, this.globalizePropValues);
-            this.value = afterFormat.call(this, formattedValue);
+            var formattedValue = this.globalize[fn](...this.globalizePropValues);
+            this.value = alwaysArray(afterFormat.call(this, formattedValue));
         }
 
         render() {

src/util/always-array.js

@@ -0,0 +1,3 @@
+export default function alwaysArray(stringOrArray) {
+    return Array.isArray(stringOrArray) ? stringOrArray : stringOrArray ? [stringOrArray] : [];
+}

test/formatMessage.spec.js

@@ -51,6 +51,11 @@ Globalize.loadMessages({
             expect(wrapper.text()).to.equal("Hi");
         });
 
+        it("outputs strings not as an array of characters", () => {
+            const wrapper = shallow(<FormatMessage>Hi</FormatMessage>);
+            expect(wrapper.children().getElements().length).to.equal(1);
+        });
+
         it("resolves path and prints 'Hi'", () => {
             const wrapper = shallow(<FormatMessage path="salutations/hi" />);
             expect(wrapper.text()).to.equal("Hi");
@@ -64,10 +69,12 @@ Globalize.loadMessages({
         it("properly replaces elements", () => {
             const wrapper = shallow(<FormatMessage path="elements/rglink" elements={{reactGlobalizeLink: <a href="https://github.com/jquery-support/react-globalize"></a>}} />);
             expect(wrapper.html()).to.equal("<span>For more information, see <a href=\"https://github.com/jquery-support/react-globalize\">React Globalize</a></span>");
+            expect(wrapper.children().getElements().length).to.equal(2);
+            expect(wrapper.children().get(1).type).to.equal("a");
         });
 
         it("uses proper gender inflection", () => {
-            const wrapper = shallow(<FormatMessage path="party" variables={{guest:"Mozart", guestGender:"male", host:"Beethoven", hostGender:"other"}} />);
+            const wrapper = shallow(<FormatMessage path="party" variables={{guest: "Mozart", guestGender: "male", host: "Beethoven", hostGender: "other"}} />);
             expect(wrapper.text()).to.equal("Beethoven invites Mozart to their party");
         });