RESOLVED FIXED 76850
Clipping of render layer boundaries does not take page scale into account 
https://bugs.webkit.org/show_bug.cgi?id=76850
Summary Clipping of render layer boundaries does not take page scale into account
Sami Kyostila
Reported 2012-01-23 11:56:03 PST
The boundaries for render layers that are descendants of clipping containers (e.g., overflow: hidden) are incorrectly stored into the compositor's overlap map. The problem is that the boundaries are in scaled CSS coordinates while the clip rects are unscaled. The result is that the overlap check sometimes fails depending on the page geometry and scale.
Attachments
Patch (4.80 KB, patch)
2012-01-23 12:17 PST, Sami Kyostila 		no flags
DetailsFormatted DiffDiff
Patch (4.77 KB, patch)
2012-01-24 05:50 PST, Sami Kyostila 		no flags
DetailsFormatted DiffDiff
Patch (5.00 KB, patch)
2012-01-25 03:54 PST, Sami Kyostila 		no flags
DetailsFormatted DiffDiff
Show Obsolete (2) View All Add attachment proposed patch, testcase, etc.
Sami Kyostila
Comment 1 2012-01-23 12:17:15 PST
Created attachment 123596 [details] Patch
Sami Kyostila
Comment 2 2012-01-24 05:50:00 PST
Created attachment 123719 [details] Patch - Fixed typo in changelog.
Simon Fraser (smfr)
Comment 3 2012-01-24 16:12:18 PST
Comment on attachment 123719 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=123719&action=review It would be nice if the bug listed some real-world sites known by be broken. > LayoutTests/compositing/overflow/overflow-scaled-descendant-overlapping.html:25 > + <div style="position: absolute; left: 400px; z-index: 1; background: #0f0"> > + <!-- Green should appear on top. --> > + </div> > + > + <div style="position: absolute; left: 400px; overflow: hidden"> > + <div style="-webkit-transform: translateZ(0); background: #f00"> > + <!-- Red should be hidden. --> > + </div> Please use 'red' and 'green' for colors, rather than hex values. Also, use of css classes like '#indicator" makes the test self-documenting. I also don't like inline style in general.
Sami Kyostila
Comment 4 2012-01-25 03:11:32 PST
A real-world site where this happens is the mobile version eBay (http://mobileweb.ebay.com/). It has a popup ad which is placed to the bottom of the viewport using absolute positioning and some JavaScript. The page also has an image gallery with images that are positioned using CSS 3D transforms. The bug is that the popup is obscured by the gallery images despite having a higher z-index. The bug is triggered because the popup does not get its own graphics layer unless it overlaps with another existing graphics layer. It is this overlap test that fails due to the missing page scale factor. To make it easier to trigger the bug on that page, first set page scale > 1 and then call createAndroidAppPopup() on that page since the popup normally appears somewhat nondeterministically.
Sami Kyostila
Comment 5 2012-01-25 03:50:50 PST
Comment on attachment 123719 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=123719&action=review >> LayoutTests/compositing/overflow/overflow-scaled-descendant-overlapping.html:25 >> + </div> > > Please use 'red' and 'green' for colors, rather than hex values. > > Also, use of css classes like '#indicator" makes the test self-documenting. I also don't like inline style in general. I've now removed the inline style defitions and rewritten the test to use CSS classes like existing tests do.
Sami Kyostila
Comment 6 2012-01-25 03:54:58 PST
Created attachment 123917 [details] Patch
Simon Fraser (smfr)
Comment 7 2012-01-25 07:27:29 PST
Comment on attachment 123917 [details] Patch Much cleaner test, thanks.
WebKit Review Bot
Comment 8 2012-01-25 07:51:08 PST
Comment on attachment 123917 [details] Patch Clearing flags on attachment: 123917 Committed r105879: <http://trac.webkit.org/changeset/105879>
WebKit Review Bot
Comment 9 2012-01-25 07:51:13 PST
All reviewed patches have been landed. Closing bug.
Note You need to log in before you can comment on or make changes to this bug.