displaystyle-1.html (7869B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>displaystyle</title> 6 <link rel="help" href="https://w3c.github.io/mathml-core/#css-styling"> 7 <link rel="help" href="https://w3c.github.io/mathml-core/#the-displaystyle-and-scriptlevel-attributes"> 8 <link rel="help" href="https://w3c.github.io/mathml-core/#the-math-style-property"> 9 <meta name="assert" content="Verify that the correct inheritance of the displaystyle value by measuring the size of large operators."> 10 <style> 11 @font-face { 12 font-family: TestFont; 13 src: url("/fonts/math/largeop-displayoperatorminheight5000.woff"); 14 } 15 math { 16 font-family: TestFont; 17 font-size: 10px; 18 } 19 </style> 20 <script src="/resources/testharness.js"></script> 21 <script src="/resources/testharnessreport.js"></script> 22 <script src="/mathml/support/attribute-values.js"></script> 23 <script src="/mathml/support/fonts.js"></script> 24 <script> 25 setup({ explicit_done: true }); 26 var emToPx = 10 / 1000; // font-size: 10px, font.em = 1000 27 var epsilon = 5; 28 function verify_displaystyle(elementId, displaystyle, description) { 29 var expectedSize = (displaystyle ? 5000 : 1000) * emToPx; 30 var elementSize = document.getElementById(elementId). 31 getBoundingClientRect().height; 32 assert_approx_equals(elementSize, expectedSize, epsilon, description); 33 } 34 35 window.addEventListener("load", () => { loadAllFonts().then(runTests); }); 36 37 function runTests() { 38 for (transform in AttributeValueTransforms) { 39 TransformAttributeValues(transform, ["display", "displaystyle"]); 40 test(function() { 41 verify_displaystyle("math_default", false, "default"); 42 verify_displaystyle("math_false", false, "explicit displaystyle false"); 43 verify_displaystyle("math_true", true, "explicit displaystyle true"); 44 }, `math element (${transform})`); 45 test(function() { 46 verify_displaystyle("math_inline", false, "explicit display inline"); 47 verify_displaystyle("math_block", true, "explicit display block"); 48 verify_displaystyle("math_block_false", false, "explicit display block and displaystyle false"); 49 verify_displaystyle("math_block_true", true, "explicit display block and displaystyle true"); 50 verify_displaystyle("math_inline_false", false, "explicit display inline and displaystyle false"); 51 verify_displaystyle("math_inline_true", true, "explicit display inline and displaystyle true"); 52 }, `math element (explicit display, ${transform})`); 53 test(function() { 54 verify_displaystyle("mstyle_false", false, "explicit displaystyle false"); 55 verify_displaystyle("mstyle_true", true, "explicit displaystyle true"); 56 }, `mstyle element (${transform})`); 57 test(function() { 58 verify_displaystyle("mtable_default", false, "default"); 59 verify_displaystyle("mtable_false", false, "explicit displaystyle false"); 60 verify_displaystyle("mtable_true", true, "explicit displaystyle true"); 61 }, `mtable element (${transform})`); 62 test(function() { 63 verify_displaystyle("mfrac_sibling", true, "sibling"); 64 verify_displaystyle("mfrac_numerator", false, "numerator"); 65 verify_displaystyle("mfrac_denominator", false, "denominator"); 66 }, `mfrac element (${transform})`); 67 test(function() { 68 verify_displaystyle("mroot_base", true, "base"); 69 verify_displaystyle("mroot_index", false, "index"); 70 }, `mroot element (${transform})`); 71 test(function() { 72 verify_displaystyle("msub_base", true, "base"); 73 verify_displaystyle("msub_subscript", false, "subscript"); 74 }, `msub element (${transform})`); 75 test(function() { 76 verify_displaystyle("msup_base", true, "base"); 77 verify_displaystyle("msup_supscript", false, "supscript"); 78 }, `msup element (${transform})`); 79 test(function() { 80 verify_displaystyle("msubsup_base", true, "base"); 81 verify_displaystyle("msubsup_subscript", false, "subscript"); 82 verify_displaystyle("msubsup_supscript", false, "supscript"); 83 }, `msubsup element (${transform})`); 84 test(function() { 85 verify_displaystyle("munder_base", true, "base"); 86 verify_displaystyle("munder_underscript", false, "underscript"); 87 }, `munder element (${transform})`); 88 test(function() { 89 verify_displaystyle("mover_base", true, "base"); 90 verify_displaystyle("mover_overscript", false, "overscript"); 91 }, `mover element (${transform})`); 92 test(function() { 93 verify_displaystyle("munderover_base", true, "base"); 94 verify_displaystyle("munderover_underscript", false, "underscript"); 95 verify_displaystyle("munderover_overscript", false, "overscript"); 96 }, `munderover element (${transform})`); 97 } 98 done(); 99 } 100 </script> 101 </head> 102 <body> 103 <div id="log"></div> 104 <math><mo id="math_default">⫿</mo></math> 105 <math display="inline"><mo id="math_inline">⫿</mo></math> 106 <math display="block"><mo id="math_block">⫿</mo></math> 107 <math displaystyle="false"><mo id="math_false">⫿</mo></math> 108 <math displaystyle="true"><mo id="math_true">⫿</mo></math> 109 <math display="block" displaystyle="false"> 110 <mo id="math_block_false">⫿</mo> 111 </math> 112 <math display="block" displaystyle="true"> 113 <mo id="math_block_true">⫿</mo> 114 </math> 115 <math display="inline" displaystyle="false"> 116 <mo id="math_inline_false">⫿</mo> 117 </math> 118 <math display="inline" displaystyle="true"> 119 <mo id="math_inline_true">⫿</mo> 120 </math> 121 <math><mstyle displaystyle="false"><mo id="mstyle_false">⫿</mo></mstyle></math> 122 <math><mstyle displaystyle="true"><mo id="mstyle_true">⫿</mo></mstyle></math> 123 <math displaystyle="true"><mtable><mtr><mtd><mo id="mtable_default">⫿</mo></mtd></mtr></mtable></math> 124 <math><mtable displaystyle="true"><mtr><mtd><mo id="mtable_true">⫿</mo></mtd></mtr></mtable></math> 125 <math displaystyle="true"><mtable displaystyle="false"><mtr><mtd><mo id="mtable_false">⫿</mo></mtd></mtr></mtable></math> 126 <math displaystyle="true"><mo id="mfrac_sibling">⫿</mo><mfrac><mo id="mfrac_numerator">⫿</mo><mo id="mfrac_denominator">⫿</mo></mfrac></math> 127 <math displaystyle="true"><mroot><mo id="mroot_base">⫿</mo><mo id="mroot_index">⫿</mo></mroot></math> 128 <math displaystyle="true"><msub><mo id="msub_base">⫿</mo><mo id="msub_subscript">⫿</mo></msub></math> 129 <math displaystyle="true"><msup><mo id="msup_base">⫿</mo><mo id="msup_supscript">⫿</mo></msup></math> 130 <math displaystyle="true"><msubsup><mo id="msubsup_base">⫿</mo><mo id="msubsup_subscript">⫿</mo><mo id="msubsup_supscript">⫿</mo></msubsup></math> 131 <math displaystyle="true"><mmultiscripts><mo id="mmultiscripts_base">⫿</mo><mo id="mmultiscripts_subscript">⫿</mo><mo id="mmultiscripts_supscript">⫿</mo><mprescripts/><mo id="mmultiscripts_presubscript">⫿</mo><mo id="mmultiscripts_presupscript">⫿</mo></mmultiscripts></math> 132 <math displaystyle="true"><munder><mo id="munder_base">⫿</mo><mo id="munder_underscript">⫿</mo></munder></math> 133 <math displaystyle="true"><mover><mo id="mover_base">⫿</mo><mo id="mover_overscript">⫿</mo></mover></math> 134 <math displaystyle="true"><munderover><mo id="munderover_base">⫿</mo><mo id="munderover_underscript">⫿</mo><mo id="munderover_overscript">⫿</mo></munderover></math> 135 </body> 136 </html>