Add comprehensive MathML support to Scala DOM Types

js/src/test/scala/com/thirdparty/CompileSpec.scala

@@ -1,12 +1,12 @@
 package com.thirdparty
 
-import com.thirdparty.defs.attrs.{AriaAttrs, HtmlAttrs, SvgAttrs}
+import com.thirdparty.defs.attrs.{AriaAttrs, HtmlAttrs, SvgAttrs, MathMLAttrs}
 import com.thirdparty.defs.complex.{ComplexHtmlKeys, ComplexSvgKeys}
 import com.thirdparty.defs.eventProps.{DocumentEventProps, GlobalEventProps, WindowEventProps}
 import com.thirdparty.defs.props.Props
 import com.thirdparty.defs.styles.StyleProps
 import com.thirdparty.defs.styles.units.{Calc, Color, Length, Time, Url}
-import com.thirdparty.defs.tags.{HtmlTags, SvgTags}
+import com.thirdparty.defs.tags.{HtmlTags, SvgTags, MathMLTags}
 import com.thirdparty.keys.{DerivedStyleBuilder, DerivedStyleProp, StyleProp, SvgAttr}
 import com.thirdparty.setters.StyleSetter
 import com.thirdparty.tags.HtmlTag
@@ -49,6 +49,10 @@ class CompileSpec extends AnyFunSpec with Matchers {
     with SvgAttrs
     with ComplexSvgKeys
 
+  object mathml
+    extends MathMLTags
+    with MathMLAttrs
+
   object aria
     extends AriaAttrs
 
@@ -99,6 +103,34 @@ class CompileSpec extends AnyFunSpec with Matchers {
     assert(svg.xlinkHref.qualifiedName == "xlink:href")
     assert(SvgAttr.namespaceUrl(svg.xlinkHref.namespace.get) == "http://www.w3.org/1999/xlink")
 
+    // MathML basic functionality
+
+    assert(mathml.math.domName == "math")
+    assert(mathml.mi.domName == "mi")
+    assert(mathml.mn.domName == "mn")
+    assert(mathml.mo.domName == "mo")
+    assert(mathml.mrow.domName == "mrow")
+    assert(mathml.mfrac.domName == "mfrac")
+    assert(mathml.msup.domName == "msup")
+    assert(mathml.msub.domName == "msub")
+
+    // MathML attributes
+
+    assert(mathml.display.domName == "display")
+    assert(mathml.mathvariant.domName == "mathvariant")
+    assert(mathml.mathsize.domName == "mathsize")
+    assert(mathml.mathcolor.domName == "mathcolor")
+    assert(mathml.mathbackground.domName == "mathbackground")
+    assert(mathml.displaystyle.domName == "displaystyle")
+    assert(mathml.scriptlevel.domName == "scriptlevel")
+    assert(mathml.xmlns.domName == "xmlns")
+
+    // xmlns attribute available on all element types
+
+    assert(html.xmlns.domName == "xmlns") // HTML xmlns
+    assert(svg.xmlns.domName == "xmlns")  // SVG xmlns
+    assert(mathml.xmlns.domName == "xmlns") // MathML xmlns
+
     // Aliases
 
     assert(html.typ == html.`type`)

js/src/test/scala/com/thirdparty/codecs/package.scala

@@ -5,6 +5,7 @@ package object codecs {
   // String Codecs
 
   object StringAsIsCodec extends AsIsCodec[String]
+  val StringAsIs = StringAsIsCodec
 
   // Int Codecs
 
@@ -14,6 +15,7 @@ package object codecs {
     override def decode(domValue: String): Int = domValue.toInt // @TODO this can throw exception. How do we handle this?
     override def encode(scalaValue: Int): String = scalaValue.toString
   }
+  val IntAsString = IntAsStringCodec
 
   // Double Codecs
 
@@ -32,6 +34,7 @@ package object codecs {
     override def decode(domValue: String): Boolean = domValue != null
     override def encode(scalaValue: Boolean): String = if (scalaValue) "" else null
   }
+  val BooleanAsPresence = BooleanAsAttrPresenceCodec
 
   object BooleanAsTrueFalseStringCodec extends Codec[Boolean, String] {
     override def decode(domValue: String): Boolean = domValue == "true"

js/src/test/scala/com/thirdparty/defs/attrs/HtmlAttrs.scala

@@ -181,5 +181,14 @@ trait HtmlAttrs {
     */
   lazy val widthAttr: HtmlAttr[Int] = intHtmlAttr("width")
 
+  /**
+    * The xmlns attribute specifies the XML namespace for the element.
+    * This is especially important when mixing HTML with other XML vocabularies
+    * like SVG or MathML.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/API/Element/namespaceURI namespaceURI @ MDN]]
+    */
+  lazy val xmlns: HtmlAttr[String] = stringHtmlAttr("xmlns")
+
 
 }

js/src/test/scala/com/thirdparty/defs/attrs/MathMLAttrs.scala

@@ -0,0 +1,93 @@
+package com.thirdparty.defs.attrs
+
+import com.thirdparty.keys.MathMLAttr
+import com.thirdparty.codecs._
+
+// #NOTE: GENERATED CODE
+//  - This file is generated at compile time from the data in Scala DOM Types
+//  - See `GeneratorSpec.scala` for code generation params
+//  - Contribute to https://github.com/raquo/scala-dom-types to add missing tags / attrs / props / etc.
+
+trait MathMLAttrs {
+
+  def stringMathMLAttr(name: String, namespace: Option[String] = None): MathMLAttr[String] = new MathMLAttr(name, StringAsIs, namespace)
+  def booleanMathMLAttr(name: String, namespace: Option[String] = None): MathMLAttr[Boolean] = new MathMLAttr(name, BooleanAsPresence, namespace)
+  def intMathMLAttr(name: String, namespace: Option[String] = None): MathMLAttr[Int] = new MathMLAttr(name, IntAsString, namespace)
+
+  /**
+    * This enumerated attribute specifies how the enclosed MathML markup should be rendered.
+    * It can have one of the following values:
+    * - block, which means that this element will be displayed in its own block outside the current span of text
+    * - inline, which means that this element will be displayed inside the current span of text
+    * 
+    * If not present, its default value is inline.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Global_attributes/display display @ MDN]]
+    */
+  lazy val display: MathMLAttr[String] = stringMathMLAttr("display")
+
+  /**
+    * This attribute specifies the logical class of the identifier, which varies
+    * in typography. That is, although the names suggest the typographic style for
+    * the class, semantically, items with the same class are treated "the same"
+    * within an expression, which might or might not involve displaying them with
+    * the same typography.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Global_attributes/mathvariant mathvariant @ MDN]]
+    */
+  lazy val mathvariant: MathMLAttr[String] = stringMathMLAttr("mathvariant")
+
+  /**
+    * This attribute specifies the size of the content. Possible values are:
+    * - small: The content is rendered smaller than the surrounding text.
+    * - normal: The content is rendered at the same size as the surrounding text.
+    * - big: The content is rendered larger than the surrounding text.
+    * - A length value like '12pt', '2em', etc.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Global_attributes/mathsize mathsize @ MDN]]
+    */
+  lazy val mathsize: MathMLAttr[String] = stringMathMLAttr("mathsize")
+
+  /**
+    * This attribute sets the text color and also the fraction line color.
+    * You can use named colors or RGB format like #rgb, #rrggbb and CSS color names.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Global_attributes/mathcolor mathcolor @ MDN]]
+    */
+  lazy val mathcolor: MathMLAttr[String] = stringMathMLAttr("mathcolor")
+
+  /**
+    * This attribute sets the background color. You can use named colors
+    * or RGB format like #rgb, #rrggbb and CSS color names.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Global_attributes/mathbackground mathbackground @ MDN]]
+    */
+  lazy val mathbackground: MathMLAttr[String] = stringMathMLAttr("mathbackground")
+
+  /**
+    * This Boolean attribute specifies whether more vertical space is used
+    * for displayed equations or, if set to false, a more compact layout
+    * is used to display formulas.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Global_attributes/displaystyle displaystyle @ MDN]]
+    */
+  lazy val displaystyle: MathMLAttr[Boolean] = booleanMathMLAttr("displaystyle")
+
+  /**
+    * This attribute specifies a scriptlevel for the element. Larger values
+    * mean smaller font sizes. The scriptlevel is used to control the font size
+    * in a context-dependent way.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Global_attributes/scriptlevel scriptlevel @ MDN]]
+    */
+  lazy val scriptlevel: MathMLAttr[Int] = intMathMLAttr("scriptlevel")
+
+  /**
+    * The xmlns attribute specifies the XML namespace for the MathML element.
+    * For MathML, this should typically be 'http://www.w3.org/1998/Math/MathML'.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Element/math#xmlns xmlns @ MDN]]
+    */
+  lazy val xmlns: MathMLAttr[String] = stringMathMLAttr("xmlns")
+
+}

js/src/test/scala/com/thirdparty/defs/tags/MathMLTags.scala

@@ -0,0 +1,89 @@
+package com.thirdparty.defs.tags
+
+import com.thirdparty.tags.MathMLTag
+import org.scalajs.dom
+
+// #NOTE: GENERATED CODE
+//  - This file is generated at compile time from the data in Scala DOM Types
+//  - See `GeneratorSpec.scala` for code generation params
+//  - Contribute to https://github.com/raquo/scala-dom-types to add missing tags / attrs / props / etc.
+
+trait MathMLTags {
+
+  def mathMLTag[El <: dom.Element](name: String): MathMLTag[El] = new MathMLTag(name)
+
+  /**
+    * The top-level element in MathML is math. Every valid MathML instance
+    * must be wrapped in math tags. In addition you must not nest a second
+    * math element in another, but you can have an arbitrary number of other
+    * child elements in it.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Element/math math @ MDN]]
+    */
+  lazy val math: MathMLTag[dom.Element] = mathMLTag("math")
+
+  /**
+    * The mi element indicates that the content should be rendered as an
+    * identifier such as function names, variables or symbolic constants.
+    * You can also have arbitrary text in it to mark up terms.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Element/mi mi @ MDN]]
+    */
+  lazy val mi: MathMLTag[dom.Element] = mathMLTag("mi")
+
+  /**
+    * The mn element represents a numeric literal which is normally a
+    * sequence of digits with a possible separator (a dot or a comma).
+    * However, it is also allowed to have arbitrary text in it which is
+    * actually a numeric quantity, for example "eleven".
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Element/mn mn @ MDN]]
+    */
+  lazy val mn: MathMLTag[dom.Element] = mathMLTag("mn")
+
+  /**
+    * The mo element represents an operator in a broad sense. Besides
+    * operators in strict mathematical meaning, this element also includes
+    * "operators" like parentheses, separators like comma and semicolon,
+    * or "absolute value" bars.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Element/mo mo @ MDN]]
+    */
+  lazy val mo: MathMLTag[dom.Element] = mathMLTag("mo")
+
+  /**
+    * The mrow element is used to group sub-expressions, which usually
+    * contain one or more operators with their respective operands
+    * (such as mi and mn). This element renders as a horizontal row
+    * containing its arguments.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Element/mrow mrow @ MDN]]
+    */
+  lazy val mrow: MathMLTag[dom.Element] = mathMLTag("mrow")
+
+  /**
+    * The mfrac element is used to display fractions. It can also be
+    * used to mark up fraction-like objects such as binomial coefficients
+    * and Legendre symbols.
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Element/mfrac mfrac @ MDN]]
+    */
+  lazy val mfrac: MathMLTag[dom.Element] = mathMLTag("mfrac")
+
+  /**
+    * The msup element is used to attach a superscript to an expression.
+    * It uses the syntax: msup base superscript
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Element/msup msup @ MDN]]
+    */
+  lazy val msup: MathMLTag[dom.Element] = mathMLTag("msup")
+
+  /**
+    * The msub element is used to attach a subscript to an expression.
+    * It uses the syntax: msub base subscript
+    * 
+    * [[https://developer.mozilla.org/en-US/docs/Web/MathML/Element/msub msub @ MDN]]
+    */
+  lazy val msub: MathMLTag[dom.Element] = mathMLTag("msub")
+
+}

js/src/test/scala/com/thirdparty/keys/MathMLAttr.scala

@@ -0,0 +1,7 @@
+package com.thirdparty.keys
+
+class MathMLAttr[V](
+  override val domName: String,
+  override val codec: com.thirdparty.codecs.Codec[V, String],
+  val namespace: Option[String]
+) extends Attr[V]

js/src/test/scala/com/thirdparty/tags/MathMLTag.scala

@@ -0,0 +1,5 @@
+package com.thirdparty.tags
+
+import org.scalajs.dom
+
+class MathMLTag[El <: dom.Element](val domName: String) extends Tag[El]

jvm/src/test/scala/com/raquo/domtypes/GeneratorSpec.scala

@@ -2,7 +2,7 @@ package com.raquo.domtypes
 
 import com.raquo.domtypes.codegen.DefType.LazyVal
 import com.raquo.domtypes.codegen._
-import com.raquo.domtypes.common.{HtmlTagType, SvgTagType}
+import com.raquo.domtypes.common.{HtmlTagType, SvgTagType, MathMLTagType}
 import com.raquo.domtypes.defs.styles.StyleTraitDefs
 import org.scalatest.funspec.AnyFunSpec
 import org.scalatest.matchers.should.Matchers
@@ -90,6 +90,31 @@ class GeneratorSpec extends AnyFunSpec with Matchers {
     )
   }
 
+  it("Generate MathML tags") {
+    println("=== MATHML TAGS ===")
+
+    val traitName = "MathMLTags"
+
+    val fileContent = generator.generateTagsTrait(
+      tagType = MathMLTagType,
+      defGroups = defGroups.mathMLTagsDefGroups,
+      printDefGroupComments = false,
+      traitCommentLines = Nil,
+      traitModifiers = Nil,
+      traitName = traitName,
+      keyKind = "MathMLTag",
+      baseImplDefComments = Nil,
+      keyImplName = "mathMLTag",
+      defType = LazyVal
+    )
+
+    generator.writeToFile(
+      packagePath = generator.tagDefsPackagePath,
+      fileName = traitName,
+      fileContent = fileContent
+    )
+  }
+
   it("Generate HTML attributes ") {
     println("=== HTML ATTRS ===")
 
@@ -174,6 +199,34 @@ class GeneratorSpec extends AnyFunSpec with Matchers {
     )
   }
 
+  it("Generate MathML attributes ") {
+    println("=== MATHML ATTRS ===")
+
+    val traitName = "MathMLAttrs"
+
+    val fileContent = generator.generateAttrsTrait(
+      defGroups = defGroups.mathMLAttrDefGroups,
+      printDefGroupComments = false,
+      traitModifiers = Nil,
+      traitName = traitName,
+      traitCommentLines = Nil,
+      keyKind = "MathMLAttr",
+      implNameSuffix = "MathMLAttr",
+      baseImplDefComments = Nil,
+      baseImplName = "mathMLAttr",
+      namespaceImports = Nil,
+      namespaceImpl = _ => ???,
+      transformAttrDomName = identity,
+      defType = LazyVal
+    )
+
+    generator.writeToFile(
+      packagePath = generator.attrDefsPackagePath,
+      fileName = traitName,
+      fileContent = fileContent
+    )
+  }
+
   it("Generate HTML Props") {
     println("=== HTML Props ===")