| <!DOCTYPE html> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <style> |
| #container { |
| -webkit-writing-mode:vertical-rl; |
| } |
| #container > div { |
| border:solid thin black; |
| font-size:20px; |
| height:2em; |
| line-height:1; |
| } |
| .tcy { |
| -webkit-text-combine:horizontal; |
| } |
| </style> |
| <div id="container"> |
| <div title="break after">国<span data-expected="1,0" class="tcy">123</span>国</div> |
| <div title="break before">国国<span data-expected="0,1" class="tcy">123</span>国</div> |
| <div title="after open">国「<span data-expected="1,1" class="tcy">123</span></div> |
| <div title="before close">国<span data-expected="0,1" class="tcy">123</span>」</div> |
| <div title="break after with break inside">国<span data-expected="1,0" class="tcy">国国</span>国</div> |
| <div title="break before with break inside">国国<span data-expected="0,1" class="tcy">国国</span>国</div> |
| <div title="after open with break inside">国「<span data-expected="1,1" class="tcy">国国</span></div> |
| <div title="before close with break inside">国<span data-expected="0,1" class="tcy">国国</span>」</div> |
| </div> |
| <script> |
| (function () { |
| var blocks = document.querySelectorAll("div[title]"); |
| for (var i = 0; i < blocks.length; i++) |
| testColumnAndRow(blocks[i]); |
| |
| function testColumnAndRow(block) { |
| test(function () { |
| var targets = block.querySelectorAll("span[data-expected]"); |
| for (var i = 0; i < targets.length; i++) { |
| var element = targets[i]; |
| var expected = eval("[" + element.dataset.expected + "]"); |
| var actual = getColumnAndRow(element); |
| assert_array_equals(actual, expected); |
| } |
| }, block.title); |
| } |
| |
| function getColumnAndRow(element) { |
| var rect = element.getBoundingClientRect(); |
| var block = element.parentElement.getBoundingClientRect() |
| var column = rect.top - block.top; |
| var row = block.right - rect.right; |
| return [Math.round(column / 20), Math.round(row / 20)]; |
| } |
| })(); |
| |
| if (window.testRunner) |
| container.style.display = "none"; |
| </script> |