| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta charset="utf-8"> |
| <title>Operator dictionary (combining char)</title> |
| <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> |
| <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo"> |
| <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes"> |
| <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary"> |
| <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#layout-of-mrow"> |
| <link rel="stylesheet" href="./support/operator-dictionary-tests.css"/> |
| <meta name="assert" content="Verify special handling of 2-char operator with a combining character"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="/mathml/support/feature-detection.js"></script> |
| <style> |
| mo { |
| color: blue; |
| } |
| mn { |
| background: black; |
| } |
| </style> |
| <script> |
| setup({ explicit_done: true }); |
| window.addEventListener("load", runTests); |
| |
| function spaceBetween(element, i, j) { |
| return element.children[j].getBoundingClientRect().left - |
| element.children[i].getBoundingClientRect().right; |
| } |
| function runTests() { |
| var epsilon = 1; |
| var emToPx = 25; |
| |
| ["equal", "vertical_bar"].forEach(id => { |
| var div = document.getElementById(id); |
| var ref = div.getElementsByClassName("reference")[0]; |
| var totalSpaceRef = spaceBetween(ref, 0, 2); |
| var lspaceRef = spaceBetween(ref, 0, 1); |
| var rspaceRef = spaceBetween(ref, 1, 2); |
| Array.from(div.getElementsByClassName("combining")).forEach(element => { |
| test(function() { |
| assert_true(MathMLFeatureDetection.has_operator_spacing()); |
| var totalSpace = spaceBetween(element, 0, 2); |
| var lspace = spaceBetween(element, 0, 1); |
| var rspace = spaceBetween(element, 1, 2); |
| assert_approx_equals(totalSpace, totalSpaceRef, epsilon); |
| assert_approx_equals(rspace, rspaceRef, epsilon); |
| assert_approx_equals(lspace, lspaceRef, epsilon); |
| }, `Spacing around ${element.children[1].textContent}`); |
| }); |
| }); |
| |
| done(); |
| } |
| </script> |
| </head> |
| <body> |
| <div id="log"></div> |
| <div id="equal"> |
| <p> |
| <math class="reference"> |
| <mn> </mn> |
| <mo>=</mo> |
| <mn> </mn> |
| </math> |
| </p> |
| <p> |
| <math class="combining"> |
| <mn> </mn> |
| <mo>≠</mo> |
| <mn> </mn> |
| </math> |
| </p> |
| <p> |
| <math class="combining"> |
| <mn> </mn> |
| <mo>=⃒</mo> |
| <mn> </mn> |
| </math> |
| </p> |
| </div> |
| <div id="vertical_bar"> |
| <p> |
| <math class="reference"> |
| <mn> </mn> |
| <mo stretchy="false">|</mo> |
| <mn> </mn> |
| </math> |
| </p> |
| <p> |
| <math class="combining"> |
| <mn> </mn> |
| <mo stretchy="false">|̸</mo> |
| <mn> </mn> |
| </math> |
| </p> |
| <p> |
| <math class="combining"> |
| <mn> </mn> |
| <mo stretchy="false">|⃒</mo> |
| <mn> </mn> |
| </math> |
| </p> |
| </div> |
| </body> |
| </html> |
