getClientRects-inline-with-block-child.html (1193B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <link rel="help" href="https://drafts.csswg.org/cssom-view-1/#dom-element-getclientrects"> 4 <link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com"> 5 6 <section> 7 <span id="target"> 8 <div style="height: 50px"></div> 9 </span> 10 </section> 11 12 <script src="/resources/testharness.js"></script> 13 <script src="/resources/testharnessreport.js"></script> 14 <script> 15 function assert_rect_equals(actual, expected, description) { 16 assert_equals(actual.x, expected.x, description + " - x"); 17 assert_equals(actual.y, expected.y, description + " - y"); 18 assert_equals(actual.width, expected.width, description + " - width"); 19 assert_equals(actual.height, expected.height, description + " - height"); 20 } 21 test(() => { 22 const target = document.getElementById("target"); 23 const rects = target.getClientRects(); 24 // TODO: check that it's exactly 3 fragments. 25 assert_greater_than_equal(rects.length, 2, "At least 2 fragments"); 26 assert_rect_equals( 27 rects[0], 28 {x: 8, y: 8, width: 0, height: 0}, 29 "First rect", 30 ); 31 assert_rect_equals( 32 rects[rects.length - 1], 33 {x: 8, y: 58, width: 0, height: 0}, 34 "Last rect", 35 ); 36 }); 37 </script>