Bug 201603 - Synchronize MathML WPT tests against upstream
[WebKit-https.git] / LayoutTests / imported / w3c / web-platform-tests / mathml / presentation-markup / operators / embellished-operator-001.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title>Embellished operators</title>
6 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
7 <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#embellished-operators">
8 <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#definition-of-space-like-elements">
9 <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#layout-of-mrow">
10 <meta name="assert" content="Verify definition of embellished operators">
11 <script src="/resources/testharness.js"></script>
12 <script src="/resources/testharnessreport.js"></script>
13 <script src="/mathml/support/feature-detection.js"></script>
14 <style>
15   /* Default spacing of operator 'X' is 0.2777777777777778em so quite different
16      from the measured/specified 0em and 1em. */
17   math, math * {
18       font: 25px/1 Ahem;
19   }
20   mn {
21       color: black;
22   }
23   .testedElement mo {
24       color: yellow !important;
25   }
26   .testedElement, .testedElement * {
27       color: blue !important;
28       background: blue !important;
29   }
30 </style>
31 <script>
32   function spaceBeforeElement(id) {
33       var element = document.getElementById(id);
34       var mnBefore = element.previousElementSibling;
35       return element.getBoundingClientRect().left - mnBefore.getBoundingClientRect().right;
36   }
37
38   function spaceBeforeCoreOperator(id) {
39       var element = document.getElementById(id);
40       var coreMo = element.getElementsByTagName("mo")[0];
41       return coreMo.getBoundingClientRect().left - element.getBoundingClientRect().left;
42   }
43
44   setup({ explicit_done: true });
45   window.addEventListener("load", runTests);
46
47   function runTests() {
48       var epsilon = 1;
49       var emToPx = 25;
50
51       ["mrow", "mstyle", "mphantom", "mpadded"].forEach(tag => {
52           test(function() {
53               assert_true(MathMLFeatureDetection.has_operator_spacing());
54               assert_approx_equals(spaceBeforeElement(`${tag}-op`), 2 * emToPx, epsilon);
55               assert_approx_equals(spaceBeforeCoreOperator(`${tag}-op`), 0, epsilon);
56           }, `${tag} (embellished operator)`);
57
58           test(function() {
59               assert_true(MathMLFeatureDetection.has_operator_spacing());
60               assert_approx_equals(spaceBeforeElement(`${tag}-nonop`), 0, epsilon);
61               assert_approx_equals(spaceBeforeCoreOperator(`${tag}-nonop`), 2 * emToPx, epsilon);
62           }, `${tag} (not embellished operator)`);
63       });
64
65       done();
66   }
67 </script>
68 </head>
69 <body>
70   <div id="log"></div>
71   <p>
72     <math>
73       <mn>X</mn>
74       <mrow id="mrow-op" class="testedElement">
75         <mo lspace="2em" rspace="0em">X</mo>
76         <mtext class="space-like">X</mtext>
77       </mrow>
78       <mn>X</mn>
79     </math>
80   </p>
81   <p>
82     <math>
83       <mn>X</mn>
84       <mrow id="mrow-nonop" class="testedElement">
85         <mo lspace="2em" rspace="0em">X</mo>
86         <mn>X</mn> <!-- "mn" is not space-like -->
87       </mrow>
88       <mn>X</mn>
89     </math>
90   </p>
91   <!-- mstyle is an embellished operator if its children consist
92        of one embellished operator and zero or more space-like elements. -->
93   <p>
94     <math>
95       <mn>X</mn>
96       <mstyle id="mstyle-op" class="testedElement">
97         <mo lspace="2em" rspace="0em">X</mo>
98       </mstyle>
99       <mn>X</mn>
100     </math>
101   </p>
102   <p>
103     <math>
104       <mn>X</mn>
105       <mstyle id="mstyle-nonop" class="testedElement">
106         <mo lspace="2em" rspace="0em">X</mo>
107         <mn>X</mn> <!-- "mn" is not space-like -->
108       </mstyle>
109       <mn>X</mn>
110     </math>
111   </p>
112   <!-- mphantom is an embellished operator if its children consist
113        of one embellished operator and zero or more space-like elements. -->
114   <p>
115     <math>
116       <mn>X</mn>
117       <mphantom id="mphantom-op" class="testedElement">
118         <mo lspace="2em" rspace="0em">X</mo>
119       </mphantom>
120       <mn>X</mn>
121     </math>
122   </p>
123   <p>
124     <math>
125       <mn>X</mn>
126       <mphantom id="mphantom-nonop" class="testedElement">
127         <mo lspace="2em" rspace="0em">X</mo>
128         <mn>X</mn> <!-- "mn" is not space-like -->
129       </mphantom>
130       <mn>X</mn>
131     </math>
132   </p>
133   <!-- mpadded is an embellished operator if its children consist
134        of one embellished operator and zero or more space-like elements. -->
135   <p>
136     <math>
137       <mn>X</mn>
138       <mpadded id="mpadded-op" class="testedElement">
139         <mo lspace="2em" rspace="0em">X</mo>
140       </mpadded>
141       <mn>X</mn>
142     </math>
143   </p>
144   <p>
145     <math>
146       <mn>X</mn>
147       <mpadded id="mpadded-nonop" class="testedElement">
148         <mo lspace="2em" rspace="0em">X</mo>
149         <mn>X</mn> <!-- "mn" is not space-like -->
150       </mpadded>
151       <mn>X</mn>
152     </math>
153   </p>
154 </body>
155 </html>