| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| * { box-sizing: border-box; } |
| body { margin: 0; } |
| span { position: absolute; top: 0; left: 0; } |
| </style> |
| <script> |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| function output(s) |
| { |
| window.log.innerText += s + "\n"; |
| } |
| |
| function runTest() |
| { |
| if (!window.internals) { |
| output("This test cannot be run outside of WebKitTestRunner."); |
| return; |
| } |
| |
| function dumpIndicatorBoundsForElement(el) |
| { |
| var indicatorOptions = {"useBoundingRectAndPaintAllContentForComplexRanges": true}; |
| var range = internals.rangeFromLocationAndLength(el, 0, 1); |
| var indicator = window.internals.textIndicatorForRange(range, indicatorOptions); |
| var rect = indicator.textBoundingRectInRootViewCoordinates; |
| output(`${el.id}: ${rect.x} ${rect.y} ${rect.width} ${rect.height}`); |
| } |
| |
| dumpIndicatorBoundsForElement(document.getElementById("imageOnly")); |
| dumpIndicatorBoundsForElement(document.getElementById("picture")); |
| dumpIndicatorBoundsForElement(document.getElementById("clippedPicture")); |
| dumpIndicatorBoundsForElement(document.getElementById("deeperClippedPicture")); |
| } |
| </script> |
| </head> |
| <body onload="runTest()"> |
| <span id="imageOnly"><img src="../images/resources/green-256x256.jpg"></span> |
| <span id="picture"><picture><img src="../images/resources/green-256x256.jpg"></picture></span> |
| <span id="clippedPicture"><picture style="display: inline-block; height: 20px; overflow: hidden;"><img src="../images/resources/green-256x256.jpg"></picture></span> |
| <span id="deeperClippedPicture"><div style="display: inline-block; height: 20px; overflow: hidden;"><picture style="position: relative; height: 50px; overflow: hidden;"><img src="../images/resources/green-256x256.jpg"></picture></div></span> |
| <pre id="log"></pre> |
| </body> |
| </html> |
