Added ability to create a dashed vertical line in arrays, using ':' (#1395)

* hacked together a dashed vertical bar

* Updated tests and spec.

* tidied up the screenshot template for arrays

* added the vertical lines at the end back

* Updated screenshots for arrays

src/environments/array.js

@@ -282,6 +282,15 @@ const htmlBuilder = function(group, options) {
                 separator.style.verticalAlign =
                     -(totalHeight - offset) + "em";
 
+                cols.push(separator);
+            } else if (colDescr.separator === ":") {
+                const separator = buildCommon.makeSpan(
+                    ["vertical-separator", "vs-dashed"], [], options
+                );
+                separator.style.height = totalHeight + "em";
+                separator.style.verticalAlign =
+                    -(totalHeight - offset) + "em";
+
                 cols.push(separator);
             } else {
                 throw new ParseError(
@@ -465,6 +474,11 @@ defineEnvironment({
                     type: "separator",
                     separator: "|",
                 };
+            } else if (ca === ":") {
+                return {
+                    type: "separator",
+                    separator: ":",
+                };
             }
             throw new ParseError(
                 "Unknown column alignment: " + node.value,

src/katex.less

@@ -405,6 +405,10 @@
             border-right: 0.05em solid;
         }
 
+        .vs-dashed {
+            border-right: 0.05em dashed;
+        }
+
         .arraycolsep {
             display: inline-block;
         }

test/katex-spec.js

@@ -2324,7 +2324,7 @@ describe("An array environment", function() {
     });
 
     it("should accept vertical separators", function() {
-        const parse = getParsed("\\begin{array}{|l||c|}\\end{array}");
+        const parse = getParsed("\\begin{array}{|l||c:r::}\\end{array}");
         expect(parse[0].type).toBe("array");
         expect(parse[0].value.cols).toEqual([
             {type: "separator", separator: "|"},
@@ -2332,7 +2332,10 @@ describe("An array environment", function() {
             {type: "separator", separator: "|"},
             {type: "separator", separator: "|"},
             {type: "align", align: "c"},
-            {type: "separator", separator: "|"},
+            {type: "separator", separator: ":"},
+            {type: "align", align: "r"},
+            {type: "separator", separator: ":"},
+            {type: "separator", separator: ":"},
         ]);
     });
 

test/screenshotter/ss_data.yaml

@@ -33,7 +33,7 @@ Alignedat: |
         3a &= 3 & 17b &= 34 &\quad 400c &= 1200
     \end{alignedat}
 Arrays: |
-    \left(\begin{array}{|rl|c||}
+    \left(\begin{array}{|rl:c||}
         1&2&3\\
         1+1&2+1&3+1\cr1\over2&\scriptstyle 1/2&\frac12\\[1ex]
         \begin{pmatrix}x\\y\end{pmatrix}&0&\begin{vmatrix}a&b\\c&d\end{vmatrix}