Bug 19179 - Edge fringe artifact with transformed, masked elements (including reflections)
Summary: Edge fringe artifact with transformed, masked elements (including reflections)
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: 528+ (Nightly build)
Hardware: Mac OS X 10.5
: P2 Normal
Assignee: Simon Fraser (smfr)
URL:
Keywords: InRadar
: 30040 39248 (view as bug list)
Depends on:
Blocks:
 
Reported: 2008-05-21 20:37 PDT by CJ Yetman
Modified: 2010-10-07 13:49 PDT (History)
9 users (show)

See Also:

Attachments
testcase (610 bytes, text/html)
2008-05-21 20:39 PDT, CJ Yetman 		no flags Details
more dramatic demonstration (646 bytes, text/html)
2008-05-22 11:48 PDT, CJ Yetman 		no flags Details
Screenshot (9.80 KB, image/png)
2009-01-03 19:50 PST, Simon Fraser (smfr) 		no flags Details
Patch (40.01 KB, patch)
2010-10-07 13:43 PDT, Simon Fraser (smfr) 		bdakin: review+
Details | Formatted Diff | Diff
View All Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description CJ Yetman 2008-05-21 20:37:33 PDT 
When adding a reflection with -webkit-box-reflect that has a gradient mask... if you also use -webkit-transform: skew, you will see a line at the edge of the reflected image. You will not see the line if the skew is removed or set to 0 degrees. Probably just something to do with the anti-aliasing of the gradient or the skewed image, but there should be some way to resolve it. Sorry, I don't know all the proper terminology, so I'll just attach a test case.

(Tested on latest nightly r33980)
Comment 1 CJ Yetman 2008-05-21 20:39:54 PDT 
Created attachment 21282 [details]
testcase
Comment 2 CJ Yetman 2008-05-22 11:48:34 PDT 
Created attachment 21298 [details]
more dramatic demonstration
Comment 3 mitz 2008-05-22 12:09:01 PDT 
Great test cases. Thanks!
Comment 4 mitz 2008-05-22 12:46:07 PDT 
This can probably happens when applying any mask to any transformed box.
Comment 5 Simon Fraser (smfr) 2009-01-03 19:50:58 PST 
Created attachment 26404 [details]
Screenshot
Comment 6 David Harrison 2009-02-21 08:54:05 PST 
rdar://6608800
Comment 7 mitz 2009-10-04 22:41:49 PDT 
*** Bug 30040 has been marked as a duplicate of this bug. ***
Comment 8 Simon Fraser (smfr) 2009-12-16 10:25:02 PST 
Very obvious example:
<http://media.24ways.org/2009/15/spinner.html>
Comment 9 Simon Fraser (smfr) 2009-12-16 10:27:17 PST 
*** Bug 27832 has been marked as a duplicate of this bug. ***
Comment 10 Darin Adler 2009-12-16 10:33:08 PST 
rdar://6608800 is a different issue. We need a new Radar report.
Comment 11 mitz 2010-02-16 15:45:08 PST 
<rdar://problem/7655359>
Comment 12 Simon Fraser (smfr) 2010-07-07 17:52:56 PDT 
*** Bug 39248 has been marked as a duplicate of this bug. ***
Comment 13 Simon Fraser (smfr) 2010-10-07 11:39:22 PDT 
Maybe fix:

diff --git a/WebCore/rendering/RenderBox.cpp b/WebCore/rendering/RenderBox.cpp
index d54af1f..8b643b4 100644
--- a/WebCore/rendering/RenderBox.cpp
+++ b/WebCore/rendering/RenderBox.cpp
@@ -814,6 +814,11 @@ void RenderBox::paintMaskImages(const PaintInfo& paintInfo, int tx, int ty, int
     bool allMaskImagesLoaded = true;
     
     if (!compositedMask) {
+        // If the context has a rotation, scale or skew, then use a transparency layer to avoid
+        // pixel cruft around the edge of the mask.
+        AffineTransform currentCTM = paintInfo.context->getCTM();
+        pushTransparencyLayer = !currentCTM.isIdentityOrTranslationOrFlipped();;
+
         StyleImage* maskBoxImage = style()->maskBoxImage().image();
         const FillLayer* maskLayers = style()->maskLayers();
Comment 14 Simon Fraser (smfr) 2010-10-07 13:43:14 PDT 
Created attachment 70144 [details]
Patch
Comment 15 Simon Fraser (smfr) 2010-10-07 13:49:39 PDT 
http://trac.webkit.org/changeset/69334