| <!DOCTYPE html> |
| <link rel="help" href="https://drafts.csswg.org/cssom-view-1/#dom-element-getclientrects"> |
| <link rel="author" title="Koji Ishii" href="mailto:kojii@chromium.org"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <body> |
| <div> |
| <span>test</span> |
| <span id="vertical-align-sub-as-grand-child" |
| title="sub element in a child inline box should not be included"> |
| <span> |
| <sub class="not-include" style="vertical-align: sub">subscript</sub> |
| </span> |
| </span> |
| <span>test</span> |
| </div> |
| <script> |
| testTargetDoesNotInclude('vertical-align-sub-as-grand-child'); |
| |
| function testTargetDoesNotInclude(target) { |
| target = document.getElementById(target); |
| test(() => { |
| let target_rects = target.getClientRects(); |
| |
| let not_include_rects = []; |
| for (let element of target.querySelectorAll('.not-include')) { |
| for (let rect of element.getClientRects()) |
| not_include_rects.push(rect); |
| } |
| for (let rect of target_rects) { |
| for (let not_include_rect of not_include_rects) { |
| assert_rect_not_equals(rect, not_include_rect); |
| } |
| } |
| }, target.title); |
| } |
| |
| function assert_rect_not_equals(rect1, rect2) { |
| assert_false(rectEquals(rect1, rect2), |
| `${rectToString(rect1)} and ${rectToString(rect2)} are not equal`); |
| } |
| |
| function rectEquals(rect1, rect2) { |
| return rect1.x === rect2.x && rect1.y === rect2.y && |
| rect1.width === rect2.width && rect1.height === rect2.height; |
| } |
| |
| function rectToString(rect) { |
| return `{${rect.x}, ${rect.y} ${rect.width}x${rect.height}}`; |
| } |
| </script> |
| </body> |
