scripts-rendering-from-in-flow.html (9533B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"/> 5 <title>scripts rendering from in-flow children</title> 6 <link rel="help" href="https://w3c.github.io/mathml-core/#script-and-limit-schemata"> 7 <meta name="assert" content="Verify rendering of scripts and limits is only affected by in-flow children."> 8 <style> 9 .oof1 { 10 position: absolute; 11 } 12 .oof2 { 13 position: fixed; 14 } 15 .nobox { 16 display: none; 17 } 18 </style> 19 <script src="/resources/testharness.js"></script> 20 <script src="/resources/testharnessreport.js"></script> 21 <script src="/mathml/support/layout-comparison.js"></script> 22 <script> 23 setup({ explicit_done: true }); 24 window.addEventListener("load", runTests); 25 26 function runTests() { 27 let container = document.querySelector("#container"); 28 const epsilon = 1; 29 30 for (let math of container.children) { 31 let tagName = math.id; 32 let element = math.firstElementChild; 33 let reference = element.nextElementSibling; 34 35 test(function() { 36 compareLayout(element, reference, epsilon); 37 }, `Rendering of ${tagName} should only be affected by in-flow children`); 38 } 39 40 done(); 41 } 42 </script> 43 </head> 44 <body> 45 <div id="log"></div> 46 <div id="container"> 47 <math id="mmultiscripts"> 48 <mmultiscripts> 49 <mspace width="32px" class="oof1"/> 50 <mspace width="16px" class="oof2"/> 51 <mspace width="8px" class="nobox"/> 52 <mspace width="128px" height="24px" style="background: lightblue"/> 53 <mspace width="32px" class="oof1"/> 54 <mspace width="16px" class="oof2"/> 55 <mspace width="8px" class="nobox"/> 56 <mspace width="64px" height="8px" style="background: lightgreen"/> 57 <mspace width="32px" class="oof1"/> 58 <mspace width="16px" class="oof2"/> 59 <mspace width="8px" class="nobox"/> 60 <mspace width="32px" height="16px" style="background: lightgreen"/> 61 <mspace width="32px" class="oof1"/> 62 <mspace width="16px" class="oof2"/> 63 <mspace width="8px" class="nobox"/> 64 <mspace width="96px" height="48px" style="background: lightgreen"/> 65 <mspace width="32px" class="oof1"/> 66 <mspace width="16px" class="oof2"/> 67 <mspace width="8px" class="nobox"/> 68 <mspace width="48px" height="32px" style="background: lightgreen"/> 69 <mspace width="32px" class="oof1"/> 70 <mspace width="16px" class="oof2"/> 71 <mspace width="8px" class="nobox"/> 72 <mprescripts/> 73 <mspace width="32px" class="oof1"/> 74 <mspace width="16px" class="oof2"/> 75 <mspace width="8px" class="nobox"/> 76 <mspace width="32px" height="16px" style="background: lightsalmon"/> 77 <mspace width="32px" class="oof1"/> 78 <mspace width="16px" class="oof2"/> 79 <mspace width="8px" class="nobox"/> 80 <mspace width="16px" height="48px" style="background: lightsalmon"/> 81 <mspace width="32px" class="oof1"/> 82 <mspace width="16px" class="oof2"/> 83 <mspace width="8px" class="nobox"/> 84 </mmultiscripts> 85 86 <mmultiscripts> 87 <mspace width="128px" height="24px" style="background: lightblue"/> 88 <mspace width="64px" height="8px" style="background: lightgreen"/> 89 <mspace width="32px" height="16px" style="background: lightgreen"/> 90 <mspace width="96px" height="48px" style="background: lightgreen"/> 91 <mspace width="48px" height="32px" style="background: lightgreen"/> 92 <mprescripts/> 93 <mspace width="32px" height="16px" style="background: lightsalmon"/> 94 <mspace width="16px" height="48px" style="background: lightsalmon"/> 95 </mmultiscripts> 96 </math> 97 98 <math id="munder"> 99 <munder> 100 <mspace width="32px" class="oof1"/> 101 <mspace width="16px" class="oof2"/> 102 <mspace width="8px" class="nobox"/> 103 <mspace width="128px" height="24px" style="background: lightblue"/> 104 <mspace width="32px" class="oof1"/> 105 <mspace width="16px" class="oof2"/> 106 <mspace width="8px" class="nobox"/> 107 <mspace width="64px" height="8px" style="background: lightgreen"/> 108 <mspace width="32px" class="oof1"/> 109 <mspace width="16px" class="oof2"/> 110 <mspace width="8px" class="nobox"/> 111 </munder> 112 113 <munder> 114 <mspace width="128px" height="24px" style="background: lightblue"/> 115 <mspace width="64px" height="8px" style="background: lightgreen"/> 116 </munder> 117 </math> 118 119 <math id="mover"> 120 <mover> 121 <mspace width="32px" class="oof1"/> 122 <mspace width="16px" class="oof2"/> 123 <mspace width="8px" class="nobox"/> 124 <mspace width="128px" height="24px" style="background: lightblue"/> 125 <mspace width="32px" class="oof1"/> 126 <mspace width="16px" class="oof2"/> 127 <mspace width="8px" class="nobox"/> 128 <mspace width="32px" height="16px" style="background: lightsalmon"/> 129 <mspace width="32px" class="oof1"/> 130 <mspace width="16px" class="oof2"/> 131 <mspace width="8px" class="nobox"/> 132 </mover> 133 134 <mover> 135 <mspace width="128px" height="24px" style="background: lightblue"/> 136 <mspace width="32px" height="16px" style="background: lightsalmon"/> 137 </mover> 138 </math> 139 140 <math id="munderover"> 141 <munderover> 142 <mspace width="32px" class="oof1"/> 143 <mspace width="16px" class="oof2"/> 144 <mspace width="8px" class="nobox"/> 145 <mspace width="128px" height="24px" style="background: lightblue"/> 146 <mspace width="32px" class="oof1"/> 147 <mspace width="16px" class="oof2"/> 148 <mspace width="8px" class="nobox"/> 149 <mspace width="64px" height="8px" style="background: lightgreen"/> 150 <mspace width="32px" class="oof1"/> 151 <mspace width="16px" class="oof2"/> 152 <mspace width="8px" class="nobox"/> 153 <mspace width="32px" height="16px" style="background: lightsalmon"/> 154 <mspace width="32px" class="oof1"/> 155 <mspace width="16px" class="oof2"/> 156 <mspace width="8px" class="nobox"/> 157 </munderover> 158 159 <munderover> 160 <mspace width="128px" height="24px" style="background: lightblue"/> 161 <mspace width="64px" height="8px" style="background: lightgreen"/> 162 <mspace width="32px" height="16px" style="background: lightsalmon"/> 163 </munderover> 164 </math> 165 166 <math id="msub"> 167 <msub> 168 <mspace width="32px" class="oof1"/> 169 <mspace width="16px" class="oof2"/> 170 <mspace width="8px" class="nobox"/> 171 <mspace width="128px" height="24px" style="background: lightblue"/> 172 <mspace width="32px" class="oof1"/> 173 <mspace width="16px" class="oof2"/> 174 <mspace width="8px" class="nobox"/> 175 <mspace width="64px" height="8px" style="background: lightgreen"/> 176 <mspace width="32px" class="oof1"/> 177 <mspace width="16px" class="oof2"/> 178 <mspace width="8px" class="nobox"/> 179 </msub> 180 181 <msub> 182 <mspace width="128px" height="24px" style="background: lightblue"/> 183 <mspace width="64px" height="8px" style="background: lightgreen"/> 184 </msub> 185 </math> 186 187 <math id="msup"> 188 <msup> 189 <mspace width="32px" class="oof1"/> 190 <mspace width="16px" class="oof2"/> 191 <mspace width="8px" class="nobox"/> 192 <mspace width="128px" height="24px" style="background: lightblue"/> 193 <mspace width="32px" class="oof1"/> 194 <mspace width="16px" class="oof2"/> 195 <mspace width="8px" class="nobox"/> 196 <mspace width="32px" height="16px" style="background: lightsalmon"/> 197 <mspace width="32px" class="oof1"/> 198 <mspace width="16px" class="oof2"/> 199 <mspace width="8px" class="nobox"/> 200 </msup> 201 202 <msup> 203 <mspace width="128px" height="24px" style="background: lightblue"/> 204 <mspace width="32px" height="16px" style="background: lightsalmon"/> 205 </msup> 206 </math> 207 208 <math id="msubsup"> 209 <msubsup> 210 <mspace width="32px" class="oof1"/> 211 <mspace width="16px" class="oof2"/> 212 <mspace width="8px" class="nobox"/> 213 <mspace width="128px" height="24px" style="background: lightblue"/> 214 <mspace width="32px" class="oof1"/> 215 <mspace width="16px" class="oof2"/> 216 <mspace width="8px" class="nobox"/> 217 <mspace width="64px" height="8px" style="background: lightgreen"/> 218 <mspace width="32px" class="oof1"/> 219 <mspace width="16px" class="oof2"/> 220 <mspace width="8px" class="nobox"/> 221 <mspace width="32px" height="16px" style="background: lightsalmon"/> 222 <mspace width="32px" class="oof1"/> 223 <mspace width="16px" class="oof2"/> 224 <mspace width="8px" class="nobox"/> 225 </msubsup> 226 227 <msubsup> 228 <mspace width="128px" height="24px" style="background: lightblue"/> 229 <mspace width="64px" height="8px" style="background: lightgreen"/> 230 <mspace width="32px" height="16px" style="background: lightsalmon"/> 231 </msubsup> 232 </math> 233 </div> 234 </body> 235 </html>