| <!doctype html> |
| <title>align attribute mapping on replaced elements</title> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <img id="replaced" src="/images/green.png"> |
| <something id="non-replaced"></something> |
| <script> |
| const kMapping = { |
| "left": ["float", "left"], |
| "right": ["float", "right"], |
| |
| "top": ["vertical-align", "top"], |
| |
| // This one requires a magic value (`-moz-middle-with-baseline` on Gecko, |
| // `-webkit-baseline-middle` on WebKit-based browsers). |
| "middle": ["vertical-align", undefined], |
| // These are inconsistent across browsers. WebKit maps it to "middle", Gecko |
| // to the aforementioned value. |
| "center": ["vertical-align", undefined], |
| |
| "baseline": ["vertical-align", "baseline"], |
| "bottom": ["vertical-align", "baseline"], // *shrug* |
| |
| "texttop": ["vertical-align", "text-top"], |
| "absmiddle": ["vertical-align", "middle"], |
| "abscenter": ["vertical-align", "middle"], |
| "absbottom": ["vertical-align", "bottom"], |
| }; |
| |
| const kInitialValues = { |
| "vertical-align": "baseline", |
| "float": "none", |
| }; |
| |
| let replaced = document.getElementById("replaced"); |
| let nonReplaced = document.getElementById("non-replaced"); |
| let t = async_test("align attribute mapping"); |
| onload = t.step_func_done(function() { |
| for (const attributeValue in kMapping) { |
| for (const element of [replaced, nonReplaced]) { |
| test(function() { |
| element.setAttribute("align", attributeValue); |
| let [property, expected] = kMapping[attributeValue]; |
| let actual = getComputedStyle(element).getPropertyValue(property); |
| if (element == nonReplaced) { |
| assert_equals(actual, kInitialValues[property], "align shouldn't map to non-replaced elements") |
| } else { |
| if (expected) { |
| assert_equals(actual, expected, `align=${attributeValue} should map to ${property}: ${expected}`); |
| } else { |
| assert_equals(property, "vertical-align"); |
| assert_not_equals(actual, "baseline", `align=${attributeValue} should map a vertical-align value`); |
| } |
| } |
| }, `align=${attributeValue} on ${element == replaced ? "replaced" : "non-replaced"} elements`); |
| } |
| } |
| }); |
| </script> |
