Index: third_party/WebKit/LayoutTests/hittesting/paint-containment-hittest.html |
diff --git a/third_party/WebKit/LayoutTests/hittesting/paint-containment-hittest.html b/third_party/WebKit/LayoutTests/hittesting/paint-containment-hittest.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..24f7bd19217d512d0e40a04df22b6b39e81aba27 |
--- /dev/null |
+++ b/third_party/WebKit/LayoutTests/hittesting/paint-containment-hittest.html |
@@ -0,0 +1,63 @@ |
+<!DOCTYPE html> |
+<script src="../resources/js-test.js"></script> |
+<script> |
+var centerX; |
+var centerY; |
+function hitTestCenterOfElement(elementID, expectedID) |
+{ |
+ var element = document.getElementById(elementID); |
+ var rect = element.getBoundingClientRect(); |
+ centerX = rect.left + (rect.width / 2); |
+ centerY = rect.top + (rect.height / 2); |
+ shouldBe("document.elementFromPoint(centerX, centerY).id", "'" + expectedID + "'"); |
+} |
+ |
+function test() { |
+ hitTestCenterOfElement("containTransform", "containTransform"); |
+ hitTestCenterOfElement("containAbsolute", "containAbsolute"); |
+ hitTestCenterOfElement("containFixed", "containFixed"); |
+ |
+ hitTestCenterOfElement("transform", "body"); |
+ hitTestCenterOfElement("absolute", "body"); |
+ hitTestCenterOfElement("fixed", "body"); |
+} |
+</script> |
+<style> |
+div { |
+ width: 100px; |
+ height: 100px; |
+ background-color: green; |
+} |
+div > div { |
+ background-color: red; |
+} |
+.paintContainment { |
+ contain: paint; |
+ margin: 10px; |
+} |
+#transform { |
+ transform: translateZ(0) translateX(100px); |
+} |
+#absolute { |
+ position: absolute; |
+ top: 0px; |
+ left: 100px; |
+} |
+#fixed { |
+ position: fixed; |
+ top: 0px; |
+ left: 100px; |
+} |
+</style> |
+<body onload="test()" id="body"> |
+ <p>Hit testing should respect clips established by contain: paint.</p> |
+<div id="containTransform" class="paintContainment"> |
+ <div id="transform"></div> |
+</div> |
+<div id="containAbsolute" class="paintContainment"> |
+ <div id="absolute"></div> |
+</div> |
+<div id="containFixed" class="paintContainment"> |
+ <div id="fixed"></div> |
+</div> |
+<pre id="console"></pre> |