Render MathML directly (#1966)

* Render MathML

* Fix lint error

* Change from main api to rendering options

docs/options.md

@@ -5,6 +5,10 @@ title: Options
 You can provide an object of options as the last argument to [`katex.render` and `katex.renderToString`](api.md). Available options are:
 
 - `displayMode`: `boolean`. If `true` the math will be rendered in display mode, which will put the math in display style (so `\int` and `\sum` are large, for example), and will center the math on the page on its own line. If `false` the math will be rendered in inline mode. (default: `false`)
+- `output`: `string`. Determines the markup language of the output. The valid choices are:
+  - `html`: Outputs KaTeX in HTML only.
+  - `mathml`: Outputs KaTeX in MathML only.
+  - `htmlAndMathml`: Outputs HTML for visual rendering and includes MathML for accessibility. This is the default.
 - `leqno`: `boolean`. If `true`, display math has `\tag`s rendered on the left instead of the right, like `\usepackage[leqno]{amsmath}` in LaTeX.
 - `fleqn`: `boolean`. If `true`, display math renders flush left, like `\documentclass[fleqn]` in LaTeX.
 - `throwOnError`: `boolean`. If `true` (the default), KaTeX will throw a `ParseError` when it encounters an unsupported command or invalid LaTeX. If `false`, KaTeX will render unsupported commands as text, and render invalid LaTeX as its source code with hover text giving the error, in the color given by `errorColor`.

src/Settings.js

@@ -18,6 +18,7 @@ export type StrictFunction =
 
 export type SettingsOptions = {
     displayMode?: boolean;
+    output?: "html" | "mathml" | "htmlAndMathml";
     leqno?: boolean;
     fleqn?: boolean;
     throwOnError?: boolean;
@@ -42,6 +43,7 @@ export type SettingsOptions = {
  */
 class Settings {
     displayMode: boolean;
+    output: "html" | "mathml" | "htmlAndMathml";
     leqno: boolean;
     fleqn: boolean;
     throwOnError: boolean;
@@ -57,6 +59,7 @@ class Settings {
         // allow null options
         options = options || {};
         this.displayMode = utils.deflt(options.displayMode, false);
+        this.output = utils.deflt(options.output, "htmlAndMathml");
         this.leqno = utils.deflt(options.leqno, false);
         this.fleqn = utils.deflt(options.fleqn, false);
         this.throwOnError = utils.deflt(options.throwOnError, true);

src/buildMathML.js

@@ -212,6 +212,7 @@ export default function buildMathML(
     tree: AnyParseNode[],
     texExpression: string,
     options: Options,
+    forMathmlOnly: boolean,
 ): DomSpan {
     const expression = buildExpression(tree, options);
 
@@ -235,11 +236,13 @@ export default function buildMathML(
         "semantics", [wrapper, annotation]);
 
     const math = new mathMLTree.MathNode("math", [semantics]);
+    math.setAttribute("xmlns", "http://www.w3.org/1998/Math/MathML");
 
     // You can't style <math> nodes, so we wrap the node in a span.
     // NOTE: The span class is not typed to have <math> nodes as children, and
     // we don't want to make the children type more generic since the children
     // of span are expected to have more fields in `buildHtml` contexts.
+    const wrapperClass = forMathmlOnly ? "katex" : "katex-mathml";
     // $FlowFixMe
-    return buildCommon.makeSpan(["katex-mathml"], [math]);
+    return buildCommon.makeSpan([wrapperClass], [math]);
 }

src/buildTree.js

@@ -36,12 +36,17 @@ export const buildTree = function(
     settings: Settings,
 ): DomSpan {
     const options = optionsFromSettings(settings);
-    const mathMLNode = buildMathML(tree, expression, options);
+    let katexNode;
-    const htmlNode = buildHTML(tree, options);
+    if (settings.output === "mathml") {
-
+        return  buildMathML(tree, expression, options, true);
-    const katexNode = buildCommon.makeSpan(["katex"], [
+    } else if (settings.output === "html") {
-        mathMLNode, htmlNode,
+        const htmlNode = buildHTML(tree, options);
-    ]);
+        katexNode = buildCommon.makeSpan(["katex"], [htmlNode]);
+    } else {
+        const mathMLNode = buildMathML(tree, expression, options, false);
+        const htmlNode = buildHTML(tree, options);
+        katexNode = buildCommon.makeSpan(["katex"], [mathMLNode, htmlNode]);
+    }
 
     return displayWrap(katexNode, settings);
 };

test/__snapshots__/katex-spec.js.snap

@@ -784,7 +784,7 @@ exports[`Extending katex by new fonts and symbols Add new font class to new exte
 
 <span class="katex">
   <span class="katex-mathml">
-    <math>
+    <math xmlns="http://www.w3.org/1998/Math/MathML">
       <semantics>
         <mrow>
           <mi mathvariant="normal">
@@ -862,7 +862,7 @@ exports[`Newlines via \\\\ and \\newline \\\\ causes newline, even after mrel an
 
 <span class="katex">
   <span class="katex-mathml">
-    <math>
+    <math xmlns="http://www.w3.org/1998/Math/MathML">
       <semantics>
         <mrow>
           <mi>

test/__snapshots__/mathml-spec.js.snap

@@ -2,7 +2,7 @@
 
 exports[`A MathML builder \\html@mathml makes clean symbols 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mtext>
@@ -31,7 +31,7 @@ exports[`A MathML builder \\html@mathml makes clean symbols 1`] = `
 
 exports[`A MathML builder \\text fonts become mathvariant 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mtext>
@@ -115,7 +115,7 @@ exports[`A MathML builder \\text fonts become mathvariant 1`] = `
 
 exports[`A MathML builder accents turn into <mover accent="true"> in MathML 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mover accent="true">
@@ -172,7 +172,7 @@ exports[`A MathML builder accents turn into <mover accent="true"> in MathML 1`]
 
 exports[`A MathML builder ligatures render properly 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mtext>
@@ -218,7 +218,7 @@ exports[`A MathML builder ligatures render properly 1`] = `
 
 exports[`A MathML builder normal spaces render normally 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mspace width="1em">
@@ -236,7 +236,7 @@ exports[`A MathML builder normal spaces render normally 1`] = `
 
 exports[`A MathML builder should concatenate digits into single <mn> 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mi>
@@ -265,7 +265,7 @@ exports[`A MathML builder should concatenate digits into single <mn> 1`] = `
 
 exports[`A MathML builder should generate <mphantom> nodes for \\phantom 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mphantom>
@@ -284,7 +284,7 @@ exports[`A MathML builder should generate <mphantom> nodes for \\phantom 1`] = `
 
 exports[`A MathML builder should generate the right types of nodes 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mi>
@@ -319,7 +319,7 @@ exports[`A MathML builder should generate the right types of nodes 1`] = `
 
 exports[`A MathML builder should make prime operators into <mo> nodes 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <msup>
@@ -341,7 +341,7 @@ exports[`A MathML builder should make prime operators into <mo> nodes 1`] = `
 
 exports[`A MathML builder should output \\limsup_{x \\rightarrow \\infty} correctly in \\textstyle 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <munder>
@@ -376,7 +376,7 @@ exports[`A MathML builder should output \\limsup_{x \\rightarrow \\infty} correc
 
 exports[`A MathML builder should output \\limsup_{x \\rightarrow \\infty} in displaymode correctly 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <munder>
@@ -411,7 +411,7 @@ exports[`A MathML builder should output \\limsup_{x \\rightarrow \\infty} in dis
 
 exports[`A MathML builder should render boldsymbol with the correct mathvariants 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mrow>
@@ -451,7 +451,7 @@ exports[`A MathML builder should render boldsymbol with the correct mathvariants
 
 exports[`A MathML builder should render mathchoice as if there was nothing 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mstyle scriptlevel="0"
@@ -498,7 +498,7 @@ exports[`A MathML builder should render mathchoice as if there was nothing 1`] =
 
 exports[`A MathML builder should render mathchoice as if there was nothing 2`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <msubsup>
@@ -539,7 +539,7 @@ exports[`A MathML builder should render mathchoice as if there was nothing 2`] =
 
 exports[`A MathML builder should render mathchoice as if there was nothing 3`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <msub>
@@ -561,7 +561,7 @@ exports[`A MathML builder should render mathchoice as if there was nothing 3`] =
 
 exports[`A MathML builder should render mathchoice as if there was nothing 4`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <msub>
@@ -588,7 +588,7 @@ exports[`A MathML builder should render mathchoice as if there was nothing 4`] =
 
 exports[`A MathML builder should set href attribute for href appropriately 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mi href="http://example.org">
@@ -605,7 +605,7 @@ exports[`A MathML builder should set href attribute for href appropriately 1`] =
 
 exports[`A MathML builder should use <menclose> for colorbox 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mpadded width="+6pt"
@@ -629,7 +629,7 @@ exports[`A MathML builder should use <menclose> for colorbox 1`] = `
 
 exports[`A MathML builder should use <mpadded> for raisebox 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mpadded voffset="0.25em">
@@ -648,7 +648,7 @@ exports[`A MathML builder should use <mpadded> for raisebox 1`] = `
 
 exports[`A MathML builder should use <msupsub> for regular operators 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mstyle scriptlevel="0"
@@ -677,7 +677,7 @@ exports[`A MathML builder should use <msupsub> for regular operators 1`] = `
 
 exports[`A MathML builder should use <munderover> for large operators 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mstyle scriptlevel="0"
@@ -706,7 +706,7 @@ exports[`A MathML builder should use <munderover> for large operators 1`] = `
 
 exports[`A MathML builder special spaces render specially 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mrow>
       <mtext>
@@ -777,7 +777,7 @@ exports[`A MathML builder special spaces render specially 1`] = `
 
 exports[`A MathML builder tags use <mlabeledtr> 1`] = `
 
-<math>
+<math xmlns="http://www.w3.org/1998/Math/MathML">
   <semantics>
     <mtable width="100%">
       <mtr>