| Index: LayoutTests/fast/events/elementsFromPoint.html
|
| diff --git a/LayoutTests/fast/events/elementsFromPoint.html b/LayoutTests/fast/events/elementsFromPoint.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..3c62c25c669fe28dda54e9375011621123117571
|
| --- /dev/null
|
| +++ b/LayoutTests/fast/events/elementsFromPoint.html
|
| @@ -0,0 +1,107 @@
|
| +<!DOCTYPE HTML>
|
| +<script src="../../resources/js-test.js"></script>
|
| +<style>
|
| +html, body {
|
| + margin: 0;
|
| + padding: 0;
|
| +}
|
| +body {
|
| + height: 500px;
|
| +}
|
| +#simpleDiv {
|
| + width: 200px;
|
| + height: 200px;
|
| + background-color: rgba(0,0,255,0.5);
|
| +}
|
| +#divWithPseudo {
|
| + position: absolute;
|
| + left: 50px;
|
| + top: 50px;
|
| + width: 100px;
|
| + height: 100px;
|
| + background-color: rgba(255,0,0,0.5);
|
| +}
|
| +#divWithPseudo::before {
|
| + position: absolute;
|
| + left: 20px;
|
| + top: 20px;
|
| + width: 100px;
|
| + height: 100px;
|
| + content: "::before";
|
| + background-color: rgba(255,0,0,0.5);
|
| + z-index: 9999;
|
| +}
|
| +#divBetweenPseudo {
|
| + position: absolute;
|
| + left: 100px;
|
| + top: 100px;
|
| + width: 100px;
|
| + height: 100px;
|
| + background-color: rgba(0,255,0,0.5);
|
| +}
|
| +#withMargins {
|
| + margin-top: -15px;
|
| + width: 200px;
|
| + height: 200px;
|
| + background-color: rgba(0,0,0,0.5);
|
| +}
|
| +#inlineSpan {
|
| + float: right;
|
| + background-color: yellow;
|
| + width: 100px;
|
| + height: 1em;
|
| +}
|
| +#noPointerEvents {
|
| + position: absolute;
|
| + left: 50px;
|
| + top: 50px;
|
| + width: 100px;
|
| + height: 300px;
|
| + background-color: rgba(0,0,0,0.1);
|
| + pointer-events: none;
|
| +}
|
| +#threeD {
|
| + position: absolute;
|
| + transform: translate3d(-100px, -100px, 10px);
|
| + left: 140px;
|
| + top: 140px;
|
| + width: 200px;
|
| + height: 50px;
|
| + background-color: rgba(255,255,255,0.5);
|
| +}
|
| +</style>
|
| +<div id="simpleDiv"></div>
|
| +<div id="divWithPseudo"></div>
|
| +<div id="divBetweenPseudo"></div>
|
| +<div id="withMargins"><span id="inlineSpan"></span></div>
|
| +<div id="noPointerEvents"></div>
|
| +<div id="threeD"></div>
|
| +<div id="console"></div>
|
| +<script>
|
| +if (window.testRunner)
|
| + testRunner.dumpAsText();
|
| +
|
| +function assertElementInSequence(sequence, value, expectedInSequence) {
|
| + if (expectedInSequence)
|
| + shouldBeGreaterThanOrEqual(sequence + '.indexOf(' + value + ')', '0');
|
| + else
|
| + shouldBeEqualToNumber(sequence + '.indexOf(' + value + ')', -1);
|
| +}
|
| +
|
| +// Iterate through each of the elements and verify that they are present in
|
| +// elementsFromPoint(x, y) where (x, y) is any of the four corners.
|
| +["simpleDiv", "divWithPseudo", "divBetweenPseudo", "withMargins", "inlineSpan", "noPointerEvents", "threeD"].forEach(function(id) {
|
| + var element = document.getElementById(id);
|
| + var shouldReceivePointerEvents = window.getComputedStyle(element).pointerEvents != "none";
|
| + var rect = element.getBoundingClientRect();
|
| +
|
| + var topLeft = (rect.left + 1) + ', ' + (rect.top + 1);
|
| + var topRight = (rect.right - 1) + ', ' + (rect.top + 1);
|
| + var bottomLeft = (rect.left + 1) + ', ' + (rect.bottom - 1);
|
| + var bottomRight = (rect.right - 1) + ', ' + (rect.bottom - 1);
|
| + assertElementInSequence('document.elementsFromPoint(' + topLeft + ')', id, shouldReceivePointerEvents);
|
| + assertElementInSequence('document.elementsFromPoint(' + topRight + ')', id, shouldReceivePointerEvents);
|
| + assertElementInSequence('document.elementsFromPoint(' + bottomLeft + ')', id, shouldReceivePointerEvents);
|
| + assertElementInSequence('document.elementsFromPoint(' + bottomRight + ')', id, shouldReceivePointerEvents);
|
| +});
|
| +</script>
|
|
|
Chromium Code Reviews
Issue 869813003:
Implement elementsFromPoint (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master