| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| .container { |
| border: 1px solid black; |
| padding: 8px; |
| font-family: ahem; |
| } |
| |
| #target { |
| color: blue; |
| outline: 2px solid blue; |
| } |
| |
| .child { |
| border: 1px solid gray; |
| margin: 10px; |
| } |
| </style> |
| <script src="../../resources/js-test-pre.js"></script> |
| </head> |
| <body> |
| <div class="container"> |
| container pre |
| <span id="target">span before |
| <div class="child"> |
| child |
| </div> |
| span after</span> |
| container post |
| </div> |
| <script> |
| const target = document.getElementById('target'); |
| const targetBoundingBox = internals.boundingBox(target); |
| const actualBounds = {x: targetBoundingBox.y, y:targetBoundingBox.y, width: targetBoundingBox.width, height: targetBoundingBox.height }; |
| debug(`Bounding box is ${JSON.stringify(actualBounds)}`); |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </body> |
| </html> |