- Revision
- 159626
- Author
- [email protected]
- Date
- 2013-11-21 07:17:08 -0800 (Thu, 21 Nov 2013)
Log Message
Fix hover area for divs with css transforms
https://bugs.webkit.org/show_bug.cgi?id=124647
Patch by Mihai Maerean <[email protected]> on 2013-11-21
Reviewed by Allan Sandfeld Jensen.
Source/WebCore:
Non transformed layers are now being hit last, not through or in-between transformed layers.
The paint order says that the divs creating stacking contexts (including transforms) are painted after the
other siblings so they should be hit tested in the reverse order. Also, a rotated div in a non-rotated parent
should be hit in its entire area, not hit its parent's background, even if the z-coordinate is negative where
the mouse is located.
Test: transforms/3d/hit-testing/hover-rotated-negative-z.html
* rendering/RenderLayer.cpp:
(WebCore::computeZOffset):
LayoutTests:
* transforms/3d/hit-testing/hover-rotated-negative-z.html: Added.
* transforms/3d/hit-testing/hover-rotated-negative-z-expected.txt: Added.
Modified Paths
Added Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (159625 => 159626)
--- trunk/LayoutTests/ChangeLog 2013-11-21 14:58:20 UTC (rev 159625)
+++ trunk/LayoutTests/ChangeLog 2013-11-21 15:17:08 UTC (rev 159626)
@@ -1,3 +1,13 @@
+2013-11-21 Mihai Maerean <[email protected]>
+
+ Fix hover area for divs with css transforms
+ https://bugs.webkit.org/show_bug.cgi?id=124647
+
+ Reviewed by Allan Sandfeld Jensen.
+
+ * transforms/3d/hit-testing/hover-rotated-negative-z.html: Added.
+ * transforms/3d/hit-testing/hover-rotated-negative-z-expected.txt: Added.
+
2013-11-21 Radu Stavila <[email protected]>
Created test for positioned fragmented content which overflows the regions.
Added: trunk/LayoutTests/transforms/3d/hit-testing/hover-rotated-negative-z-expected.txt (0 => 159626)
--- trunk/LayoutTests/transforms/3d/hit-testing/hover-rotated-negative-z-expected.txt (rev 0)
+++ trunk/LayoutTests/transforms/3d/hit-testing/hover-rotated-negative-z-expected.txt 2013-11-21 15:17:08 UTC (rev 159626)
@@ -0,0 +1,8 @@
+transformed
+Test passes if the hover state of a transformed div is activated on the entire surface of the div.
+
+Element at 70, 70 has id "transformed": PASS
+Element at 630, 130 has id "transformed": PASS
+Element at 40, 130 has id "transformed": PASS
+Element at 620, 270 has id "transformed": PASS
+
Added: trunk/LayoutTests/transforms/3d/hit-testing/hover-rotated-negative-z.html (0 => 159626)
--- trunk/LayoutTests/transforms/3d/hit-testing/hover-rotated-negative-z.html (rev 0)
+++ trunk/LayoutTests/transforms/3d/hit-testing/hover-rotated-negative-z.html 2013-11-21 15:17:08 UTC (rev 159626)
@@ -0,0 +1,42 @@
+<html>
+ <head>
+ <title>Test - Bug #124647: Fix hover area for divs with css transforms</title>
+ <style>
+ #transformed {
+ -webkit-transform: translateY(50px) rotateX(20deg) rotateZ(10deg);
+ border: solid 5px rgba(128,128,128,0.5);
+ padding: 10px;
+ margin: 15px;
+ }
+ #transformed:hover {
+ box-shadow: 0px 0px 0px 10px rgba(0,128,0,0.5);
+ }
+ #parent {
+ outline: dotted 1px #888;
+ }
+ #transformed, #parent {
+ width: 600px;
+ height: 150px;
+ }
+ </style>
+
+ <script src=""
+ <script>
+ const hitTestData = [
+ { 'point': [70, 70], 'target' : 'transformed' },
+ { 'point': [630, 130], 'target' : 'transformed' },
+ { 'point': [40, 130], 'target' : 'transformed' },
+ { 'point': [620, 270], 'target' : 'transformed' }
+ ];
+
+ window.addEventListener('load', runTest, false);
+ </script>
+ </head>
+ <body id="body">
+ <div id="parent"><div id="transformed">transformed</div></div>
+
+ <p>Test passes if the hover state of a transformed div is activated on the entire surface of the div.</p>
+
+ <div id="results"></div>
+ </body>
+</html>
\ No newline at end of file
Modified: trunk/Source/WebCore/ChangeLog (159625 => 159626)
--- trunk/Source/WebCore/ChangeLog 2013-11-21 14:58:20 UTC (rev 159625)
+++ trunk/Source/WebCore/ChangeLog 2013-11-21 15:17:08 UTC (rev 159626)
@@ -1,3 +1,21 @@
+2013-11-21 Mihai Maerean <[email protected]>
+
+ Fix hover area for divs with css transforms
+ https://bugs.webkit.org/show_bug.cgi?id=124647
+
+ Reviewed by Allan Sandfeld Jensen.
+
+ Non transformed layers are now being hit last, not through or in-between transformed layers.
+ The paint order says that the divs creating stacking contexts (including transforms) are painted after the
+ other siblings so they should be hit tested in the reverse order. Also, a rotated div in a non-rotated parent
+ should be hit in its entire area, not hit its parent's background, even if the z-coordinate is negative where
+ the mouse is located.
+
+ Test: transforms/3d/hit-testing/hover-rotated-negative-z.html
+
+ * rendering/RenderLayer.cpp:
+ (WebCore::computeZOffset):
+
2013-11-21 Andres Gomez <[email protected]>
[GTK] Release compilation fails when defining "LOG_DISABLED=0"
Modified: trunk/Source/WebCore/rendering/RenderLayer.cpp (159625 => 159626)
--- trunk/Source/WebCore/rendering/RenderLayer.cpp 2013-11-21 14:58:20 UTC (rev 159625)
+++ trunk/Source/WebCore/rendering/RenderLayer.cpp 2013-11-21 15:17:08 UTC (rev 159626)
@@ -4545,8 +4545,14 @@
static double computeZOffset(const HitTestingTransformState& transformState)
{
// We got an affine transform, so no z-offset
- if (transformState.m_accumulatedTransform.isAffine())
- return 0;
+ if (transformState.m_accumulatedTransform.isAffine()) {
+ // Non transformed layers are being hit last, not through or in-between transformed layers.
+ // The paint order says that the divs creating stacking contexts (including transforms) are painted after the
+ // other siblings so they should be hit tested in the reverse order. Also, a rotated div in a non-rotated parent
+ // should be hit in its entire area, not hit its parent's background, even if the z-coordinate is negative where
+ // the mouse is located.
+ return -std::numeric_limits<int>::max();
+ }
// Flatten the point into the target plane
FloatPoint targetPoint = transformState.mappedPoint();
