Spacing (#1335)

* Move "spacing" builders to functions/symbolsSpacing.js.

* Add flow types to functions/symbolsSpacing.js.

* Address reviewer comments.

src/buildCommon.js

@@ -222,10 +222,10 @@ const boldsymbol = function(
 /**
  * Makes either a mathord or textord in the correct font and color.
  */
-const makeOrd = function<NODETYPE: "textord" | "mathord">(
+const makeOrd = function<NODETYPE: "spacing" | "mathord" | "textord">(
     group: ParseNode<NODETYPE>,
     options: Options,
-    type: NODETYPE,
+    type: "mathord" | "textord",
 ): domTree.symbolNode {
     const mode = group.mode;
     const value = group.value;

src/buildHTML.js

@@ -368,30 +368,6 @@ export const groupTypes = {
             [base, makeSpan(["msupsub"], [supsub])],
             options);
     },
-
-    spacing(group, options) {
-        if (buildCommon.regularSpace.hasOwnProperty(group.value)) {
-            const className = buildCommon.regularSpace[group.value].className;
-            // Spaces are generated by adding an actual space. Each of these
-            // things has an entry in the symbols table, so these will be turned
-            // into appropriate outputs.
-            if (group.mode === "text") {
-                const ord = buildCommon.makeOrd(group, options, "textord");
-                ord.classes.push(className);
-                return ord;
-            } else {
-                return makeSpan(["mspace", className],
-                    [buildCommon.mathsym(group.value, group.mode, options)],
-                    options);
-            }
-        } else {
-            // Other kinds of spaces are of arbitrary width. We use CSS to
-            // generate these.
-            return makeSpan(
-                ["mspace", buildCommon.spacingFunctions[group.value].className],
-                [], options);
-        }
-    },
 };
 
 /**

src/buildMathML.js

@@ -164,22 +164,6 @@ groupTypes.supsub = function(group, options) {
     return node;
 };
 
-groupTypes.spacing = function(group) {
-    let node;
-
-    if (buildCommon.regularSpace.hasOwnProperty(group.value)) {
-        node = new mathMLTree.MathNode(
-            "mtext", [new mathMLTree.TextNode("\u00a0")]);
-    } else {
-        node = new mathMLTree.MathNode("mspace");
-
-        node.setAttribute(
-            "width", buildCommon.spacingFunctions[group.value].size);
-    }
-
-    return node;
-};
-
 groupTypes.tag = function(group, options) {
     const table = new mathMLTree.MathNode("mtable", [
         new mathMLTree.MathNode("mlabeledtr", [

src/defineFunction.js

@@ -208,11 +208,11 @@ export default function defineFunction<NODETYPE: NodeType>({
  */
 export function defineFunctionBuilders<NODETYPE: NodeType>({
     type, htmlBuilder, mathmlBuilder,
-}: {
+}: {|
     type: NODETYPE,
     htmlBuilder: HtmlBuilder<NODETYPE>,
     mathmlBuilder: MathMLBuilder<NODETYPE>,
-}) {
+|}) {
     defineFunction({
         type,
         names: [],

src/domTree.js

@@ -15,17 +15,10 @@ import type Options from "./Options";
 
 /**
  * Create an HTML className based on a list of classes. In addition to joining
- * with spaces, we also remove null or empty classes.
+ * with spaces, we also remove empty classes.
  */
 const createClass = function(classes: string[]): string {
-    classes = classes.slice();
-    for (let i = classes.length - 1; i >= 0; i--) {
-        if (!classes[i]) {
-            classes.splice(i, 1);
-        }
-    }
-
-    return classes.join(" ");
+    return classes.filter(cls => cls).join(" ");
 };
 
 // To ensure that all nodes have compatible signatures for these methods.

src/functions.js

@@ -37,6 +37,7 @@ import "./functions/sqrt";
 import "./functions/styling";
 import "./functions/symbolsOp";
 import "./functions/symbolsOrd";
+import "./functions/symbolsSpacing";
 import "./functions/text";
 import "./functions/underline";
 import "./functions/verb";

src/functions/symbolsSpacing.js

@@ -0,0 +1,48 @@
+// @flow
+import {defineFunctionBuilders} from "../defineFunction";
+import buildCommon from "../buildCommon";
+import mathMLTree from "../mathMLTree";
+
+// ParseNode<"spacing"> created in Parser.js from the "spacing" symbol Groups in
+// src/symbols.js.
+defineFunctionBuilders({
+    type: "spacing",
+    htmlBuilder(group, options) {
+        if (buildCommon.regularSpace.hasOwnProperty(group.value)) {
+            const className = buildCommon.regularSpace[group.value].className || "";
+            // Spaces are generated by adding an actual space. Each of these
+            // things has an entry in the symbols table, so these will be turned
+            // into appropriate outputs.
+            if (group.mode === "text") {
+                const ord = buildCommon.makeOrd(group, options, "textord");
+                ord.classes.push(className);
+                return ord;
+            } else {
+                return buildCommon.makeSpan(["mspace", className],
+                    [buildCommon.mathsym(group.value, group.mode, options)],
+                    options);
+            }
+        } else {
+            // Other kinds of spaces are of arbitrary width. We use CSS to
+            // generate these.
+            return buildCommon.makeSpan(
+                ["mspace", buildCommon.spacingFunctions[group.value].className],
+                [], options);
+        }
+    },
+    mathmlBuilder(group, options) {
+        let node;
+
+        if (buildCommon.regularSpace.hasOwnProperty(group.value)) {
+            node = new mathMLTree.MathNode(
+                "mtext", [new mathMLTree.TextNode("\u00a0")]);
+        } else {
+            node = new mathMLTree.MathNode("mspace");
+
+            node.setAttribute(
+                "width", buildCommon.spacingFunctions[group.value].size);
+        }
+
+        return node;
+    },
+});