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: Macintosh 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

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