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