servo/tests/wpt/css-tests/css-ruby-1_dev/html/line-break-around-ruby-001.htm
Ms2ger 296fa2512b Update web-platform-tests and CSS tests.
- Update CSS tests to revision e05bfd5e30ed662c2f8a353577003f8eed230180.
- Update web-platform-tests to revision a052787dd5c069a340031011196b73affbd68cd9.
2017-02-06 22:38:29 +01:00

40 lines
No EOL
1.6 KiB
HTML

<!DOCTYPE html>
<html><head><meta charset="utf-8">
<title>CSS Ruby Test: Test line breaking before and after &lt;ruby&gt; elements.</title>
<link href="https://drafts.csswg.org/css-ruby-1/#ruby-layout" rel="help">
<meta content="est line breaking before and after <ruby> elements" name="assert">
<meta content="dom" name="flags">
<link href="mailto:kojiishi@gmail.com" rel="author" title="Koji Ishii">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
#container > div {
line-height:2;
margin-bottom:1em;
}
</style>
</head><body><div id="log"></div>
<div id="container">
<div style="width:2em;" title="OP+ID">あ(かき</div>
<div style="width:2em;" title="ID+CL">あい)か</div>
<div style="width:2em;" title="span+CL"><span></span>)か</div>
<div style="width:2em;" title="OP+ruby">あ(<ruby><rt></rt></ruby></div>
<div style="width:2em;" title="ruby+CL"><ruby><rt></rt></ruby>)か</div>
<div style="width:3em;" title="OP+ruby+CL">あ(<ruby><rt></rt></ruby>)か</div>
</div>
<script>
runTests();
function runTests() {
var lineHeight = parseFloat(getComputedStyle(container.firstElementChild).lineHeight);
Array.prototype.forEach.call(container.children, function (element) {
test(function () {
var lineCount = element.offsetHeight / lineHeight;
assert_approx_equals(lineCount, 3, 0.1);
}, element.title);
});
if (window.testRunner)
container.style.display = "none";
}
</script>
</body></html>