| <!doctype html> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <style> |
| span { |
| background-color: lightgray; |
| border-radius: 2em; |
| padding: 1em; |
| line-height: 4em; |
| } |
| |
| label { |
| padding: 2em; |
| background-color: lightgreen; |
| border-radius: 2em; |
| } |
| |
| div { |
| margin: 2em; |
| } |
| </style> |
| <div> |
| <span id="A"> |
| Two lines with <br/>a hard line break. |
| </span> |
| </div> |
| <div> |
| <span id="B">B<label id="C">C</label></span> |
| </div> |
| <div> |
| <span id="D" style="padding: 2em;">D<label id="E" style="padding: 1em;">E</label></span> |
| </div> |
| <script> |
| test(() => { |
| const rect = document.getElementById('A').getClientRects()[0]; |
| const elementInTopLeftCorner = document.elementFromPoint(rect.left, rect.top); |
| assert_equals(elementInTopLeftCorner.nodeName, 'DIV'); |
| }, 'Hit test outside round-cornered border of the first line of span#A'); |
| |
| test(() => { |
| const rect = document.getElementById('A').getClientRects()[1]; |
| const elementInTopLeftCorner = document.elementFromPoint(rect.left, rect.top); |
| assert_equals(elementInTopLeftCorner.nodeName, 'SPAN'); |
| }, 'Hit test top left corner of the second line of span#A'); |
| |
| test(() => { |
| const rect = document.getElementById('B').getBoundingClientRect(); |
| const elementInTopLeftCorner = document.elementFromPoint(rect.left, rect.top); |
| assert_equals(elementInTopLeftCorner.nodeName, 'DIV'); |
| }, 'Hit test outside round-cornered border of span#B'); |
| |
| test(() => { |
| const rect = document.getElementById('C').getBoundingClientRect(); |
| const elementInTopLeftCorner = document.elementFromPoint(rect.left, rect.top); |
| assert_equals(elementInTopLeftCorner.nodeName, 'BODY'); |
| }, 'Hit test outside round-cornered border of label#C'); |
| |
| test(() => { |
| const rect = document.getElementById('D').getBoundingClientRect(); |
| const elementInTopLeftCorner = document.elementFromPoint(rect.left, rect.top); |
| assert_equals(elementInTopLeftCorner.nodeName, 'BODY'); |
| }, 'Hit test outside round-cornered border of span#D'); |
| |
| test(() => { |
| const rect = document.getElementById('E').getBoundingClientRect(); |
| const elementInTopLeftCorner = document.elementFromPoint(rect.left, rect.top); |
| assert_equals(elementInTopLeftCorner.nodeName, 'SPAN'); |
| }, 'Hit test outside round-cornered border of label#E'); |
| </script> |
