Stop OffscreenCanvas resize from changing placeholder attributes

third_party/WebKit/LayoutTests/fast/canvas/OffscreenCanvas-resize.html

Index: third_party/WebKit/LayoutTests/fast/canvas/OffscreenCanvas-resize.html
diff --git a/third_party/WebKit/LayoutTests/fast/canvas/OffscreenCanvas-resize.html b/third_party/WebKit/LayoutTests/fast/canvas/OffscreenCanvas-resize.html
index cca55fbfaa1877335206c4e55d93aa80d70a049c..432d9b3b133a73621a54cb5b9644ad8ca77d6260 100644
--- a/third_party/WebKit/LayoutTests/fast/canvas/OffscreenCanvas-resize.html
+++ b/third_party/WebKit/LayoutTests/fast/canvas/OffscreenCanvas-resize.html
@@ -80,18 +80,32 @@ async_test(function(t) {
     assert_equals(placeholder.width, 10);
     assert_equals(placeholder.height, 20);     
   });
+  var asyncStepsCompleted = 0;
   ctx.commit();
-  t.step(function() {
-    // Verify that commit() does not synchronously update the size of its placeholder canvas.
-    assert_equals(placeholder.width, 10);
-    assert_equals(placeholder.height, 20);     
+  createImageBitmap(placeholder).then(image => {
+    t.step(function() {
+      // Verify that the placeholder was not updated synchronously.
+      assert_equals(image.width, 10);
+      assert_equals(image.height, 20);          
+    });
+    asyncStepsCompleted = asyncStepsCompleted + 1;
+    if (asyncStepsCompleted == 2) {
+      t.done();
+    }
   });
   // Set timeout acts as a sync barrier to allow commit to propagate
   setTimeout(function(){
     t.step(function() {
       // Verify that commit() asynchronously updates the size of its placeholder canvas.
-      assert_equals(placeholder.width, 30);
-      assert_equals(placeholder.height, 40);     
+      assert_equals(placeholder.width, 10);
+      assert_equals(placeholder.height, 20);     
+    });
+    t.step(function() {
+      // Verify that width/height attributes are still settable even though they have no effect.
+      placeholder.width = 50;
+      placeholder.height = 60;
+      assert_equals(placeholder.width, 50);
+      assert_equals(placeholder.height, 60);     
     });
     createImageBitmap(placeholder).then(image => {
       t.step(function() {
@@ -99,7 +113,10 @@ async_test(function(t) {
         assert_equals(image.width, 30);
         assert_equals(image.height, 40);          
       });
-      t.done();
+      asyncStepsCompleted = asyncStepsCompleted + 1;
+      if (asyncStepsCompleted == 2) {
+        t.done();
+      }
     });
   }, 0);
 }, "Verify that resizing an OffscreenCanvas with a 2d context propagates the new size to its placeholder canvas asynchronously, upon commit.");
@@ -125,18 +142,32 @@ async_test(function(t) {
     assert_equals(placeholder.width, 10);
     assert_equals(placeholder.height, 20);     
   });
+  var asyncStepsCompleted = 0;
   ctx.commit();
-  t.step(function() {
-    // Verify that commit() does not synchronously update the size of its placeholder canvas.
-    assert_equals(placeholder.width, 10);
-    assert_equals(placeholder.height, 20);     
+  createImageBitmap(placeholder).then(image => {
+    t.step(function() {
+      // Verify that the placeholder was not updated synchronously.
+      assert_equals(image.width, 10);
+      assert_equals(image.height, 20);          
+    });
+    asyncStepsCompleted = asyncStepsCompleted + 1;
+    if (asyncStepsCompleted == 2) {
+      t.done();
+    }
   });
   // Set timeout acts as a sync barrier to allow commit to propagate
   setTimeout(function(){
     t.step(function() {
       // Verify that commit() asynchronously updates the size of its placeholder canvas.
-      assert_equals(placeholder.width, 30);
-      assert_equals(placeholder.height, 40);     
+      assert_equals(placeholder.width, 10);
+      assert_equals(placeholder.height, 20);     
+    });
+    t.step(function() {
+      // Verify that width/height attributes are still settable even though they have no effect.
+      placeholder.width = 50;
+      placeholder.height = 60;
+      assert_equals(placeholder.width, 50);
+      assert_equals(placeholder.height, 60);     
     });
     createImageBitmap(placeholder).then(image => {
       t.step(function() {
@@ -144,9 +175,42 @@ async_test(function(t) {
         assert_equals(image.width, 30);
         assert_equals(image.height, 40);          
       });
-      t.done();
+      asyncStepsCompleted = asyncStepsCompleted + 1;
+      if (asyncStepsCompleted == 2) {
+        t.done();
+      }
     });
   }, 0);
 }, "Verify that resizing an OffscreenCanvas with a webgl context propagates the new size to its placeholder canvas asynchronously, upon commit.");
 
+async_test(function(t){
+  var placeholder = document.createElement('canvas');
+  placeholder.width = 1;
+  placeholder.height = 1;
+  var offscreen = placeholder.transferControlToOffscreen();
+  var ctx = offscreen.getContext('2d');
+  offscreen.width = offscreen.height = 10;
+  ctx.fillStyle = '#0f0';
+  ctx.fillRect(0, 0, 10, 10);
+  ctx.commit();
+  // Set timeout acts as a sync barrier to allow commit to propagate
+  setTimeout(function(){
+    var testCanvas = document.createElement('canvas');
+    testCanvas.width = testCanvas.height = 20;
+    testCtx = testCanvas.getContext('2d');
+    testCtx.drawImage(placeholder, 0, 0);
+    var pixel1 = testCtx.getImageData(9, 9, 1, 1).data;
+    var pixel2 = testCtx.getImageData(9, 10, 1, 1).data;
+    var pixel3 = testCtx.getImageData(10, 9, 1, 1).data;
+    t.step(function() {
+      assert_equals(placeholder.width, 1);
+      assert_equals(placeholder.height, 1);
+      assert_array_equals(pixel1, [0, 255, 0, 255]);
+      assert_array_equals(pixel2, [0, 0, 0, 0]);
+      assert_array_equals(pixel3, [0, 0, 0, 0]);
+    });
+    t.done();
+  });
+
+}, "Verify that drawImage uses the size of the committed frame as the intinsic size of a placeholder canvas.");
 </script>