Remove development-only code from production builds

Author: Nicolas Gallagher

src/generator.js

@@ -43,7 +43,7 @@ function generator(fn, localPropNames, options) {
             this.globalizePropValues[0] = props.children;
 
             beforeFormat.call(this);
-            const formattedValue = this.globalize[fn].apply(this.globalize, this.globalizePropValues);
+            var formattedValue = this.globalize[fn].apply(this.globalize, this.globalizePropValues);
             this.value = afterFormat.call(this, formattedValue);
         },
         render: function() {

src/message.js

@@ -4,11 +4,10 @@ import generator from "./generator";
 import "globalize/message";
 import "globalize/plural";
 
-function messageSetup(componentProps, globalize, args) {
-    var defaultMessage, path;
-    var children = componentProps.children;
-    var scope = componentProps.scope;
-    var pathProperty = componentProps.path;
+function messageSetup(globalize, props, globalizePropValues) {
+    var defaultMessage;
+    var children = props.children;
+    var scope = props.scope;
 
     function getDefaultMessage(children) {
         if (typeof children === "string") {
@@ -18,71 +17,72 @@ function messageSetup(componentProps, globalize, args) {
         }
     }
 
-    function getMessage() {
-        return globalize.cldr.get(["globalize-messages/{bundle}"].concat(path));
-    }
-
-    function setMessage(message) {
-        var data = {};
-        function set(data, path, value) {
-            var i;
-            var node = data;
-            var length = path.length;
-
-            for (i = 0; i < length - 1; i++) {
-                if (!node[path[i]]) {
-                    node[path[i]] = {};
-                }
-                node = node[path[i]];
-            }
-            node[path[i]] = value;
-        }
-        set(data, [globalize.cldr.attributes.bundle].concat(path), message);
-        Globalize.loadMessages(data);
-    }
-
     // Set path - path as props supercedes default value.
-    if (pathProperty) {
-        // Override generator assumption. The generator assumes the args[0]
+    if (props.path) {
+        // Override generator assumption. The generator assumes the globalizePropValues[0]
         // (path) and props.children to be mutually exclusive, but this isn't
         // true here for messages. Because, it's possible to use props.path (for
         // path) and props.children for defaultMessage, which are two different
         // variables.
-        args[0] = pathProperty;
-        path = pathProperty.split("/");
+        globalizePropValues[0] = props.path;
     } else {
-        // Although the generator had already set args[0] (path) as
+        // Although the generator had already set globalizePropValues[0] (path) as
         // props.children, here its type is checked and its value is sanitized.
         defaultMessage = getDefaultMessage(children);
-        args[0] = sanitizePath(defaultMessage);
-        path = [args[0]];
+        globalizePropValues[0] = sanitizePath(defaultMessage);
     }
 
     // Scope path.
     if (scope) {
-        args[0] = scope + "/" + args[0];
-        path = scope.split("/").concat(path);
+        globalizePropValues[0] = scope + "/" + globalizePropValues[0];
     }
 
     // Development mode only.
-    if (globalize.cldr) {
-        if (!getMessage()) {
-            defaultMessage = defaultMessage || getDefaultMessage(children);
-            setMessage(defaultMessage);
+    if (process.env.NODE_ENV !== "production") {
+        var path = props.path ? props.path.split("/") : [globalizePropValues[0]];
+        /* eslint-disable no-inner-declarations */
+        function getMessage(globalize, path) {
+            return globalize.cldr.get(["globalize-messages/{bundle}"].concat(path));
         }
-    }
 
+        function setMessage(globalize, path, message) {
+            var data = {};
+            function set(data, path, value) {
+                var i;
+                var node = data;
+                var length = path.length;
+
+                for (i = 0; i < length - 1; i++) {
+                    if (!node[path[i]]) {
+                        node[path[i]] = {};
+                    }
+                    node = node[path[i]];
+                }
+                node[path[i]] = value;
+            }
+            set(data, [globalize.cldr.attributes.bundle].concat(path), message);
+            Globalize.loadMessages(data);
+        }
+        /* eslint-enable no-inner-declarations */
+
+        if (globalize.cldr) {
+            if (!getMessage(globalize, path)) {
+                defaultMessage = defaultMessage || getDefaultMessage(children);
+                setMessage(globalize, path, defaultMessage);
+            }
+        }
+    }
 }
 
-function replaceElements(componentProps, formatted) {
-    var elements = componentProps.elements;
+function replaceElements(props, formatted) {
+    var elements = props.elements;
 
     function _replaceElements(string, elements) {
         if (typeof string !== "string") {
-            throw new Error("missing or invalid string `" + string + "` (" + typeof string + ")");
+            throw new Error("Missing or invalid string `" + string + "` (" + typeof string + ")");
         }
         if (typeof elements !== "object") {
-            throw new Error("missing or invalid elements `" + elements + "` (" + typeof elements + ")");
+            throw new Error("Missing or invalid elements `" + elements + "` (" + typeof elements + ")");
         }
 
         // Given [x, y, z], it returns [x, element, y, element, z].
@@ -156,9 +156,8 @@ function sanitizePath(pathString) {
 }
 
 // Overload Globalize's `.formatMessage` to allow default message.
-var messageFormatterSuper = Globalize.messageFormatter;
-Globalize.messageFormatter =
-Globalize.prototype.messageFormatter = function(pathOrMessage) {
+var globalizeMessageFormatter = Globalize.messageFormatter;
+Globalize.messageFormatter = Globalize.prototype.messageFormatter = function(pathOrMessage) {
     var aux = {};
     var sanitizedPath = sanitizePath(pathOrMessage);
 
@@ -167,9 +166,9 @@ Globalize.prototype.messageFormatter = function(pathOrMessage) {
         // On runtime, the only way for deciding between using sanitizedPath or
         // pathOrMessage as path is by checking which formatter exists.
         arguments[0] = sanitizedPath;
-        aux = messageFormatterSuper.apply(this, arguments);
+        aux = globalizeMessageFormatter.apply(this, arguments);
         arguments[0] = pathOrMessage;
-        return aux || messageFormatterSuper.apply(this, arguments);
+        return aux || globalizeMessageFormatter.apply(this, arguments);
     }
 
     var sanitizedPathExists = this.cldr.get(["globalize-messages/{bundle}", sanitizedPath]) !== undefined;
@@ -186,12 +185,12 @@ Globalize.prototype.messageFormatter = function(pathOrMessage) {
     }
 
     arguments[0] = sanitizedPathExists ? sanitizedPath : pathOrMessage;
-    return messageFormatterSuper.apply(this, arguments);
+    return globalizeMessageFormatter.apply(this, arguments);
 };
 
 export default generator("formatMessage", ["path", "variables"], {
     beforeFormat: function() {
-        messageSetup(this.props, this.globalize, this.globalizePropValues);
+        messageSetup(this.globalize, this.props, this.globalizePropValues);
     },
     afterFormat: function(formattedValue) {
         return replaceElements(this.props, formattedValue);

test/formatMessage.spec.js

@@ -26,34 +26,46 @@ Globalize.loadMessages({
     }
 });
 
-describe("formatMessage Component", () => {
-    it("renders as a <span>", () => {
-        const wrapper = shallow(<FormatMessage path="salutations/hi" />);
-        expect(wrapper.type()).to.equal("span");
-    });
+[ "development", "production" ].forEach((env) => {
+    describe(`formatMessage Component (${env})`, () => {
+        var originalEnv = process.env.NODE_ENV;
 
-    it("uses default message and prints 'Hi'", () => {
-        const wrapper = shallow(<FormatMessage>Hi</FormatMessage>);
-        expect(wrapper.text()).to.equal("Hi");
-    });
+        before(() => {
+            process.env.NODE_ENV = env;
+        });
 
-    it("resolves path and prints 'Hi'", () => {
-        const wrapper = shallow(<FormatMessage path="salutations/hi" />);
-        expect(wrapper.text()).to.equal("Hi");
-    });
+        after(() => {
+            process.env.NODE_ENV = originalEnv;
+        });
 
-    it("properly replaces variables", () => {
-        const wrapper = shallow(<FormatMessage path="variables/hello" variables={["Wolfgang", "Amadeus", "Mozart"]} />);
-        expect(wrapper.text()).to.equal("Hello, Wolfgang Amadeus Mozart");
-    });
+        it("renders as a <span>", () => {
+            const wrapper = shallow(<FormatMessage path="salutations/hi" />);
+            expect(wrapper.type()).to.equal("span");
+        });
 
-    it("uses proper gender inflection", () => {
-        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");
-    });
+        it("uses default message and prints 'Hi'", () => {
+            const wrapper = shallow(<FormatMessage>Hi</FormatMessage>);
+            expect(wrapper.text()).to.equal("Hi");
+        });
+
+        it("resolves path and prints 'Hi'", () => {
+            const wrapper = shallow(<FormatMessage path="salutations/hi" />);
+            expect(wrapper.text()).to.equal("Hi");
+        });
+
+        it("properly replaces variables", () => {
+            const wrapper = shallow(<FormatMessage path="variables/hello" variables={["Wolfgang", "Amadeus", "Mozart"]} />);
+            expect(wrapper.text()).to.equal("Hello, Wolfgang Amadeus Mozart");
+        });
+
+        it("uses proper gender inflection", () => {
+            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");
+        });
 
-    it("uses proper plural inflection", () => {
-        const wrapper = shallow(<FormatMessage path="task" variables={{count: 1}} />);
-        expect(wrapper.text()).to.equal("You have one task remaining");
+        it("uses proper plural inflection", () => {
+            const wrapper = shallow(<FormatMessage path="task" variables={{count: 1}} />);
+            expect(wrapper.text()).to.equal("You have one task remaining");
+        });
     });
 });