Bug 1526881 [wpt PR 15302] - Add MathML to check the painting of fraction bars and the effect of C…, a=testonly
authorFrédéric Wang <fred.wang@free.fr>
Wed, 06 Mar 2019 10:35:50 +0000
changeset 522509 bd2cb43949529ad7ac51543dc135495d8f110188
parent 522508 10b5bdcadca6afd3231c64c82a7133e60bc8868a
child 522510 81ace099679c1783d6711a39e7d9ee6d3585ae7c
push id10871
push usercbrindusan@mozilla.com
push dateMon, 18 Mar 2019 15:49:32 +0000
treeherdermozilla-beta@018abdd16060 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstestonly
bugs1526881, 15302
milestone67.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1526881 [wpt PR 15302] - Add MathML to check the painting of fraction bars and the effect of C…, a=testonly Automatic update from web-platform-tests Add MathML to check the painting of fraction bars and the effect of C… (#15302) * Add MathML to check the painting of fraction bars and the effect of CSS color and visibility on it. -- wpt-commits: afcd81505a695d8c4f64687466732aebf4bef991 wpt-pr: 15302
testing/web-platform/tests/mathml/presentation-markup/fractions/frac-bar-001-ref.html
testing/web-platform/tests/mathml/presentation-markup/fractions/frac-bar-001.html
testing/web-platform/tests/mathml/presentation-markup/fractions/frac-color-002-ref.html
testing/web-platform/tests/mathml/presentation-markup/fractions/frac-color-002.html
testing/web-platform/tests/mathml/presentation-markup/fractions/frac-visibility-001-ref.html
testing/web-platform/tests/mathml/presentation-markup/fractions/frac-visibility-001.html
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/mathml/presentation-markup/fractions/frac-bar-001-ref.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>fractions bar</title>
+    <style type="text/css">
+      #container {
+          position: absolute;
+          left: 10px;
+          top: 50px;
+          width: 150px;
+          height: 150px;
+          background: green;
+      }
+    </style>
+  </head>
+  <body>
+    <p>This test passes if you see a green square.</p>
+    <div id="container"></div>
+  </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/mathml/presentation-markup/fractions/frac-bar-001.html
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+  <head>
+    <meta charset="utf-8">
+    <title>fractions bar</title>
+    <link rel="help" href="http://www.mathml-association.org/MathMLinHTML5/S3.html#SS3.SSS2">
+    <meta name="assert" content="Verifies painting of the fraction bar">
+    <link rel="match" href="frac-bar-001-ref.html">
+    <style type="text/css">
+      @font-face {
+        font-family: TestFont;
+        src: url("/fonts/math/fraction-rulethickness10000.woff");
+      }
+      math {
+        /* FractionRuleThickness = 10000 * 1 / 1000 = 10px; */
+        /* The gap / shift / axisheight parameters are set to 0. */
+        font-family: "TestFont";
+        font-size: 1px;
+      }
+      #container {
+          position: absolute;
+          left: 0;
+          top: 0;
+      }
+    </style>
+    <script src="/common/reftest-wait.js"></script>
+    <script>
+      window.addEventListener("load", () => {
+        // Delay the check to workaround WebKit's bug https://webkit.org/b/174030.
+        requestAnimationFrame(() => { document.fonts.ready.then(adjustPositionOfFraction); });
+      });
+      function adjustPositionOfFraction()
+      {
+        requestAnimationFrame(() => {
+          var container = document.getElementById("container");
+          var numeratorBox = document.getElementById("numerator").getBoundingClientRect();
+          container.style.left = (10 - numeratorBox.left) + "px";
+          container.style.top = (50 - numeratorBox.top) + "px";
+          requestAnimationFrame(takeScreenshot);
+        });
+      }
+    </script>
+  </head>
+  <body>
+    <p>This test passes if you see a green square.</p>
+    <div id="container">
+      <math>
+        <mfrac style="color: green; font-size: 15em">
+          <mspace id="numerator" width="150px"></mspace>
+          <mspace></mspace>
+        </mfrac>
+      </math>
+    </div>
+  </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/mathml/presentation-markup/fractions/frac-color-002-ref.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>fractions color</title>
+  </head>
+  <body>
+    <p>This test passes if you see a green square and a blue square.</p>
+    <div style="background: green; width: 200px; height: 200px;">
+    </div>
+    <div style="background: blue; width: 200px; height: 200px;">
+    </div>
+  </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/mathml/presentation-markup/fractions/frac-color-002.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>fractions color</title>
+    <link rel="help" href="http://www.mathml-association.org/MathMLinHTML5/S3.html#SS3.SSS2">
+    <meta name="assert" content="Verifies the color attribute affects the fraction bar">
+    <link rel="match" href="frac-color-002-ref.html">
+  </head>
+  <body>
+    <p>This test passes if you see a green square and a blue square.</p>
+    <div style="background: green; width: 200px; height: 200px;">
+      <math>
+        <mspace width="10px"></mspace>
+        <mfrac style="color: green">
+          <mspace width="150px" height="20px"></mspace>
+          <mspace width="150px" height="20px"></mspace>
+        </mfrac>
+      </math>
+    </div>
+    <div style="background: blue; width: 200px; height: 200px;">
+      <math>
+        <mspace width="10px"></mspace>
+        <mfrac style="color: blue">
+          <mspace width="150px" height="20px"></mspace>
+          <mspace width="150px" height="20px"></mspace>
+        </mfrac>
+      </math>
+    </div>
+  </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/mathml/presentation-markup/fractions/frac-visibility-001-ref.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Fraction bar visibility</title>
+  </head>
+  <body>
+    <p>This test passes if you see a green square and no red.</p>
+    <div style="background: green; width: 200px; height: 200px;">
+    </div>
+  </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/mathml/presentation-markup/fractions/frac-visibility-001.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Fraction bar visibility</title>
+    <link rel="help" href="http://www.mathml-association.org/MathMLinHTML5/S3.html#SS3.SSS2">
+    <meta name="assert" content="The CSS visible property affects the rendering of the fraction bar.">
+    <link rel="match" href="frac-visibility-001-ref.html">
+  </head>
+  <body>
+    <p>This test passes if you see a green square and no red.</p>
+    <div style="background: green; width: 200px; height: 200px;">
+      <math>
+        <mfrac style="visibility: hidden; color: red">
+          <mspace width="200px" height="20px"></mspace>
+          <mspace width="200px" height="20px"></mspace>
+        </mfrac>
+      </math>
+    </div>
+  </body>
+</html>