CSS clip property should make layers non-opaque
authorsimon.fraser@apple.com <simon.fraser@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 23 Jun 2014 19:00:34 +0000 (19:00 +0000)
committersimon.fraser@apple.com <simon.fraser@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 23 Jun 2014 19:00:34 +0000 (19:00 +0000)
https://bugs.webkit.org/show_bug.cgi?id=134147

Source/WebCore:
<rdar://problem/17324579>

Reviewed by Tim Horton.

https://www.fairphone.com has position:fixed elements with clip: rect(...)
but we were making those layers opaque, resulting in garbage pixels
in areas outside the clip rect.

Fix by checking for the clip property in RenderBox::backgroundIsKnownToBeOpaqueInRect().

Test: compositing/contents-opaque/opaque-with-clip.html

* rendering/RenderBox.cpp:
(WebCore::RenderBox::backgroundIsKnownToBeOpaqueInRect):

LayoutTests:

Reviewed by Tim Horton.

* compositing/contents-opaque/opaque-with-clip-expected.html: Added.
* compositing/contents-opaque/opaque-with-clip.html: Added.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@170307 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/compositing/contents-opaque/opaque-with-clip-expected.html [new file with mode: 0644]
LayoutTests/compositing/contents-opaque/opaque-with-clip.html [new file with mode: 0644]
LayoutTests/compositing/geometry/clip-inside-expected.txt
Source/WebCore/ChangeLog
Source/WebCore/rendering/RenderBox.cpp

index 01e0a15..34b3d56 100644 (file)
@@ -1,5 +1,15 @@
 2014-06-23  Simon Fraser  <simon.fraser@apple.com>
 
+        CSS clip property should make layers non-opaque
+        https://bugs.webkit.org/show_bug.cgi?id=134147
+
+        Reviewed by Tim Horton.
+
+        * compositing/contents-opaque/opaque-with-clip-expected.html: Added.
+        * compositing/contents-opaque/opaque-with-clip.html: Added.
+
+2014-06-23  Simon Fraser  <simon.fraser@apple.com>
+
         Adding a mask on a simple color compositing layer removes the content
         https://bugs.webkit.org/show_bug.cgi?id=134127
 
diff --git a/LayoutTests/compositing/contents-opaque/opaque-with-clip-expected.html b/LayoutTests/compositing/contents-opaque/opaque-with-clip-expected.html
new file mode 100644 (file)
index 0000000..309450f
--- /dev/null
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+    <style>
+        .box {
+            position: fixed;
+            top: 0;
+            left: 0;
+            width: 300px;
+            height: 300px;
+            background-color: blue;
+            clip: rect(100px, 300px, 200px, 100px);
+        }
+        
+        .indicator {
+            position: fixed;
+            top: 50px;
+            left: 50px;
+            width: 50px;
+            height: 50px;
+            top: ;
+            background-color: green;
+        }
+    </style>
+</head>
+<body>
+<div class="indicator"></div>
+<div class="box">
+    &nbsp;
+</div>
+</body>
+</html>
diff --git a/LayoutTests/compositing/contents-opaque/opaque-with-clip.html b/LayoutTests/compositing/contents-opaque/opaque-with-clip.html
new file mode 100644 (file)
index 0000000..16ea64e
--- /dev/null
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+    <style>
+        .box {
+            position: fixed;
+            top: 0;
+            left: 0;
+            width: 300px;
+            height: 300px;
+            background-color: blue;
+            clip: rect(100px, 400px, 200px, 100px);
+        }
+        
+        .indicator {
+            position: fixed;
+            top: 50px;
+            left: 50px;
+            width: 50px;
+            height: 50px;
+            top: ;
+            background-color: green;
+        }
+    </style>
+</head>
+<body>
+<div class="indicator"></div>
+<div class="box">
+    &nbsp;
+</div>
+</body>
+</html>
index 0eaa574..c0f6c44 100644 (file)
@@ -12,7 +12,6 @@ Test CSS clip with composited layers. Left and right sides should look the same.
           (position 25.00 35.00)
           (anchor 0.50 0.44)
           (bounds 90.00 80.00)
-          (contentsOpaque 1)
           (drawsContent 1)
           (transform [1.00 0.00 0.00 0.00] [0.00 1.00 0.00 0.00] [0.00 0.00 1.00 0.00] [0.00 0.00 1.00 1.00])
         )
index 1da55d8..1bb5e04 100644 (file)
@@ -1,5 +1,24 @@
 2014-06-23  Simon Fraser  <simon.fraser@apple.com>
 
+        CSS clip property should make layers non-opaque
+        https://bugs.webkit.org/show_bug.cgi?id=134147
+        <rdar://problem/17324579>
+
+        Reviewed by Tim Horton.
+        
+        https://www.fairphone.com has position:fixed elements with clip: rect(...)
+        but we were making those layers opaque, resulting in garbage pixels
+        in areas outside the clip rect.
+        
+        Fix by checking for the clip property in RenderBox::backgroundIsKnownToBeOpaqueInRect().
+
+        Test: compositing/contents-opaque/opaque-with-clip.html
+
+        * rendering/RenderBox.cpp:
+        (WebCore::RenderBox::backgroundIsKnownToBeOpaqueInRect):
+
+2014-06-23  Simon Fraser  <simon.fraser@apple.com>
+
         Adding a mask on a simple color compositing layer removes the content
         https://bugs.webkit.org/show_bug.cgi?id=134127
 
index 0ba4d00..bc5c97d 100644 (file)
@@ -1350,7 +1350,7 @@ bool RenderBox::backgroundIsKnownToBeOpaqueInRect(const LayoutRect& localRect) c
         return false;
     // FIXME: Check the opaqueness of background images.
 
-    if (hasClipPath())
+    if (hasClip() || hasClipPath())
         return false;
 
     // FIXME: Use rounded rect if border radius is present.