| <!DOCTYPE html> |
| |
| <html> |
| <head> |
| <style> |
| .container { |
| zoom: 2.3; |
| } |
| |
| #inside-zoom-box { |
| position: absolute; |
| left: 18px; |
| top: 150px; |
| height: 50px; |
| width: 40px; |
| background-color: rgba(0, 0, 0, 0.1); |
| } |
| |
| #outside-zoom-box { |
| position: absolute; |
| left: 21px; |
| top: 150px; |
| height: 50px; |
| width: 40px; |
| background-color: rgba(0, 0, 0, 0.1); |
| } |
| </style> |
| <script src="../../resources/js-test-pre.js"></script> |
| <script> |
| description("Tests getBoundingClient rect with both CSS zoom and page zoom"); |
| |
| var box; |
| var bounds; |
| function doTest() |
| { |
| if (window.eventSender) { |
| eventSender.zoomPageIn(); |
| eventSender.zoomPageIn(); |
| } else { |
| debug('This tests uses eventSender to zoom in twice'); |
| } |
| |
| box = document.getElementById('inside-zoom-box'); |
| bounds = box.getBoundingClientRect(); |
| |
| debug(''); |
| debug('Testing box with CSS zoom on an ancestor') |
| shouldBeEqualToString('bounds.left.toFixed(2)', '18.00'); |
| shouldBeEqualToString('bounds.top.toFixed(2)', '150.00'); |
| shouldBeEqualToString('bounds.width.toFixed(2)', '40.00'); |
| shouldBeEqualToString('bounds.height.toFixed(2)', '50.00'); |
| |
| box = document.getElementById('outside-zoom-box'); |
| bounds = box.getBoundingClientRect(); |
| |
| debug(''); |
| debug('Testing box without CSS zoom on an ancestor'); |
| shouldBeEqualToString('bounds.left.toFixed(2)', '21.00'); |
| shouldBeEqualToString('bounds.top.toFixed(2)', '150.00'); |
| shouldBeEqualToString('bounds.width.toFixed(2)', '40.00'); |
| shouldBeEqualToString('bounds.height.toFixed(2)', '50.00'); |
| } |
| |
| window.addEventListener('load', doTest, false); |
| </script> |
| </head> |
| <body> |
| <div class="container"> |
| <div id="inside-zoom-box"></div> |
| </div> |
| <div id="outside-zoom-box"></div> |
| <script src="../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
