LibWeb/MathML: Parse mathml attributes as <length>s

`HTML::parse_dimension_value()` doesn't parse units except for `%` for
percentages; it just ignores them and treats it as a number of pixels.
Now that we can parse `<length>` and pals directly, do that instead,
which makes non-px units work.

Author: AtkinsSJ

Libraries/LibWeb/MathML/MathMLElement.cpp

@@ -101,7 +101,7 @@ void MathMLElement::apply_presentational_hints(GC::Ref<CSS::CascadedProperties>
             // The mathsize attribute, if present, must have a value that is a valid <length-percentage>.
             // In that case, the user agent is expected to treat the attribute as a presentational hint setting the
             // element's font-size property to the corresponding value.
-            if (auto parsed_value = HTML::parse_dimension_value(value))
+            if (auto parsed_value = parse_css_type(CSS::Parser::ParsingParams { document() }, value, CSS::ValueType::LengthPercentage))
                 cascaded_properties->set_property_from_presentational_hint(CSS::PropertyID::FontSize, parsed_value.release_nonnull());
         } else if (name == AttributeNames::displaystyle) {
             // https://w3c.github.io/mathml-core/#dfn-displaystyle

Libraries/LibWeb/MathML/MathMLMspaceElement.cpp

@@ -31,11 +31,11 @@ void MathMLMspaceElement::apply_presentational_hints(GC::Ref<CSS::CascadedProper
     Base::apply_presentational_hints(cascaded_properties);
     // https://w3c.github.io/mathml-core/#attribute-mspace-width
     // The width, height, depth, if present, must have a value that is a valid <length-percentage>.
+    CSS::Parser::ParsingParams parsing_params { document() };
     auto parse_non_percentage_value = [&](FlyString const& attribute_name) -> RefPtr<CSS::StyleValue const> {
         if (auto attribute = this->attribute(attribute_name); attribute.has_value()) {
-            if (auto value = HTML::parse_dimension_value(attribute.value()); value && !value->is_percentage()) {
+            if (auto value = parse_css_type(parsing_params, attribute.value(), CSS::ValueType::Length))
                 return value;
-            }
         }
         return nullptr;
     };

Tests/LibWeb/Text/expected/MathML/presentational_hints.txt

@@ -6,6 +6,8 @@ color: rgb(255, 0, 0)
 background-color: blue
 background-color: rgb(0, 0, 255)
 font-size: 10px
+font-size: 24px
+font-size: 32px
 math-style: compact
 math-style: normal
 math-style: normal
@@ -19,6 +21,10 @@ text-transform: math-auto
 text-transform: none
 width: 10px
 width: auto
+width: 32px
 height: 20px
+height: auto
+height: 32px
 height: 30px
 height: auto
+height: 48px

Tests/LibWeb/Text/input/MathML/presentational_hints.html

@@ -17,6 +17,8 @@
     </math>
     <math data-prop="font-size">
         <mi mathsize="10px"></mi>
+        <mi mathsize="150%"></mi>
+        <mi mathsize="2em"></mi>
     </math>
     <math data-prop="math-style">
         <mi displaystyle=""></mi>
@@ -38,11 +40,15 @@
     <math data-prop="width">
         <mspace width="10px"></mspace>
         <mspace width="10%"></mspace>
+        <mspace width="2em"></mspace>
     </math>
     <math data-prop="height">
         <mspace height="20px"></mspace>
-        <mspace depth="30px"></mspace>
         <mspace height="10%"></mspace>
+        <mspace height="2em"></mspace>
+        <mspace depth="30px"></mspace>
+        <mspace depth="20%"></mspace>
+        <mspace depth="3em"></mspace>
     </math>
 </body>
 <script>