Canvas and DOM go out of sync
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 4 Mar 2013 22:16:46 +0000 (22:16 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 4 Mar 2013 22:16:46 +0000 (22:16 +0000)
https://bugs.webkit.org/show_bug.cgi?id=107701

Patch by Alexis Hetu <sugoi@chromium.org> on 2013-03-04
Reviewed by Simon Fraser.

Source/WebCore:

Test: fast/canvas/canvas-overflow-hidden-animation.html

Added an update of the current compositor from the layer's stacking
container when the layer itself isn't a stacking container.

* rendering/RenderLayerBacking.cpp:
(WebCore::RenderLayerBacking::updateAfterLayout):
Added an update of the stacking container of the owning layer of the
layer backing when the owning layer isn't a stacking container itself.

LayoutTests:

Added a new layout test for moving an object (a div) within a div that
has the "overflow:hidden" property.

* fast/canvas/canvas-overflow-hidden-animation-expected.html: Added.
* fast/canvas/canvas-overflow-hidden-animation.html: Added.

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

LayoutTests/ChangeLog
LayoutTests/fast/canvas/canvas-overflow-hidden-animation-expected.html [new file with mode: 0644]
LayoutTests/fast/canvas/canvas-overflow-hidden-animation.html [new file with mode: 0644]
Source/WebCore/ChangeLog
Source/WebCore/rendering/RenderLayerBacking.cpp

index cd2d555..9358038 100644 (file)
@@ -1,3 +1,16 @@
+2013-03-04  Alexis Hetu  <sugoi@chromium.org>
+
+        Canvas and DOM go out of sync
+        https://bugs.webkit.org/show_bug.cgi?id=107701
+
+        Reviewed by Simon Fraser.
+
+        Added a new layout test for moving an object (a div) within a div that
+        has the "overflow:hidden" property.
+
+        * fast/canvas/canvas-overflow-hidden-animation-expected.html: Added.
+        * fast/canvas/canvas-overflow-hidden-animation.html: Added.
+
 2013-03-04  Tom Sepez  <tsepez@chromium.org>
 
         XSSAuditor bypass with --> comment syntax.
diff --git a/LayoutTests/fast/canvas/canvas-overflow-hidden-animation-expected.html b/LayoutTests/fast/canvas/canvas-overflow-hidden-animation-expected.html
new file mode 100644 (file)
index 0000000..47133bc
--- /dev/null
@@ -0,0 +1,63 @@
+<!doctype html>
+<html>
+  <head>
+  <style>
+#canvas {
+  width: 300px;
+  height: 300px;
+  position: absolute;
+  left: 0px;
+  top: 0px;
+}
+
+#overlay {
+  width: 300px;
+  height: 300px;
+  position: absolute;
+  left: 0px;
+  top: 0px;
+  overflow: hidden;
+}
+
+#follower {
+  position: absolute;
+  left: 0px;
+  top: 0px;
+  width: 50px;
+  height: 50px;
+  background-color: #00FF00;
+}
+  </style>
+  </head>
+  <body>
+  <canvas id="canvas"></canvas>
+  <div id="overlay"><div id="follower"></div></div>
+    <script>
+if (window.testRunner) {
+  testRunner.waitUntilDone();
+}
+
+var canvas = document.getElementById("canvas");
+canvas.width = 300;
+canvas.height = 300;
+
+var ctx = canvas.getContext("2d");
+ctx.fillStyle = "#FF0000";
+
+var follower = document.getElementById("follower");
+
+drawLoop = function() {
+  // draw the object
+  ctx.clearRect(0, 0, 300, 300);
+  ctx.fillRect(0, 0, 50, 50);
+
+  if (window.testRunner) {
+    testRunner.notifyDone();
+  }
+};
+
+window.setTimeout(drawLoop, 0);
+    </script>
+  </body>
+</html>
+
diff --git a/LayoutTests/fast/canvas/canvas-overflow-hidden-animation.html b/LayoutTests/fast/canvas/canvas-overflow-hidden-animation.html
new file mode 100644 (file)
index 0000000..8e4750f
--- /dev/null
@@ -0,0 +1,67 @@
+<!doctype html>
+<html>
+  <head>
+  <style>
+#canvas {
+  width: 300px;
+  height: 300px;
+  position: absolute;
+  left: 0px;
+  top: 0px;
+}
+
+#overlay {
+  width: 300px;
+  height: 300px;
+  position: absolute;
+  left: 0px;
+  top: 0px;
+  overflow: hidden;
+}
+
+#follower {
+  position: absolute;
+  left: 50px;
+  top: 50px;
+  width: 50px;
+  height: 50px;
+  background-color: #00FF00;
+}
+  </style>
+  </head>
+  <body>
+  <canvas id="canvas"></canvas>
+  <div id="overlay"><div id="follower"></div></div>
+    <script>
+if (window.testRunner) {
+  testRunner.waitUntilDone();
+}
+
+var canvas = document.getElementById("canvas");
+canvas.width = 300;
+canvas.height = 300;
+
+var ctx = canvas.getContext("2d");
+ctx.fillStyle = "#FF0000";
+
+var follower = document.getElementById("follower");
+
+drawLoop = function() {
+  // update the follower
+  follower.style.left = "0px";
+  follower.style.top  = "0px";
+  
+  // draw the object
+  ctx.clearRect(0, 0, 300, 300);
+  ctx.fillRect(0, 0, 50, 50);
+
+  if (window.testRunner) {
+    testRunner.notifyDone();
+  }
+};
+
+window.setTimeout(drawLoop, 0);
+    </script>
+  </body>
+</html>
+
index 86bca39..2ed2b8a 100644 (file)
@@ -1,3 +1,20 @@
+2013-03-04  Alexis Hetu  <sugoi@chromium.org>
+
+        Canvas and DOM go out of sync
+        https://bugs.webkit.org/show_bug.cgi?id=107701
+
+        Reviewed by Simon Fraser.
+
+        Test: fast/canvas/canvas-overflow-hidden-animation.html
+
+        Added an update of the current compositor from the layer's stacking
+        container when the layer itself isn't a stacking container.
+
+        * rendering/RenderLayerBacking.cpp:
+        (WebCore::RenderLayerBacking::updateAfterLayout):
+        Added an update of the stacking container of the owning layer of the
+        layer backing when the owning layer isn't a stacking container itself.
+
 2013-03-04  Alexey Proskuryakov  <ap@apple.com>
 
         Small BlobResourceHandle cleanup
index 448a896..b364a06 100644 (file)
@@ -464,6 +464,9 @@ void RenderLayerBacking::updateAfterLayout(UpdateAfterLayoutFlags flags)
         if (flags & IsUpdateRoot) {
             updateGraphicsLayerGeometry();
             layerCompositor->updateRootLayerPosition();
+            RenderLayer* stackingContainer = m_owningLayer->enclosingStackingContainer();
+            if (!layerCompositor->compositingLayersNeedRebuild() && stackingContainer && (stackingContainer != m_owningLayer))
+                layerCompositor->updateCompositingDescendantGeometry(stackingContainer, stackingContainer, flags & CompositingChildrenOnly);
         }
     }