| Index: content/test/data/gpu/pixel_offscreenCanvas_transferToImageBitmap_worker.html
 | 
| diff --git a/content/test/data/gpu/pixel_offscreenCanvas_webgl_commit_worker.html b/content/test/data/gpu/pixel_offscreenCanvas_transferToImageBitmap_worker.html
 | 
| similarity index 50%
 | 
| copy from content/test/data/gpu/pixel_offscreenCanvas_webgl_commit_worker.html
 | 
| copy to content/test/data/gpu/pixel_offscreenCanvas_transferToImageBitmap_worker.html
 | 
| index 2af3576125e3730a6d81b72c04324963504518f1..9a14a05572e40089cba8d82231be646e2c7db973 100644
 | 
| --- a/content/test/data/gpu/pixel_offscreenCanvas_webgl_commit_worker.html
 | 
| +++ b/content/test/data/gpu/pixel_offscreenCanvas_transferToImageBitmap_worker.html
 | 
| @@ -8,7 +8,7 @@ that the baseline images are regenerated on the next run.
 | 
|  
 | 
|  <html>
 | 
|  <head>
 | 
| -<title>OffscreenCanvas commit flow on worker thread: red square on white background.</title>
 | 
| +<title>OffscreenCanvas transferToImageBitmap on worker thread: green and blue squares on white background.</title>
 | 
|  <style type="text/css">
 | 
|  .nomargin {
 | 
|    margin: 0px auto;
 | 
| @@ -16,12 +16,19 @@ that the baseline images are regenerated on the next run.
 | 
|  </style>
 | 
|  <script id="myWorker" type="text/worker">
 | 
|  self.onmessage = function(e) {
 | 
| -  var transferredOffscreenCanvas = e.data;
 | 
| -  var gl = transferredOffscreenCanvas.getContext("webgl");
 | 
| -  gl.clearColor(1.0, 0.0, 0.0, 1.0);
 | 
| -  gl.clear(gl.COLOR_BUFFER_BIT);
 | 
| -  gl.commit();
 | 
| -  self.postMessage("");
 | 
| +  var canvas1 = new OffscreenCanvas(100, 100);
 | 
| +  var gl1 = canvas1.getContext('webgl');
 | 
| +  gl1.clearColor(0.0, 1.0, 0.0, 1.0);
 | 
| +  gl1.clear(gl1.COLOR_BUFFER_BIT);
 | 
| +
 | 
| +  var canvas2 = new OffscreenCanvas(100, 100);
 | 
| +  var gl2 = canvas2.getContext('webgl');
 | 
| +  gl2.clearColor(0.0, 0.0, 1.0, 1.0);
 | 
| +  gl2.clear(gl2.COLOR_BUFFER_BIT);
 | 
| +
 | 
| +  var image1 = canvas1.transferToImageBitmap();
 | 
| +  var image2 = canvas2.transferToImageBitmap();
 | 
| +  self.postMessage({bitmap1: image1, bitmap2: image2}, [image1, image2]);
 | 
|  };
 | 
|  </script>
 | 
|  <script>
 | 
| @@ -39,13 +46,22 @@ function main()
 | 
|  
 | 
|  function draw()
 | 
|  {
 | 
| -  var canvas = document.getElementById("c");
 | 
| -  var offscreenCanvas = canvas.transferControlToOffscreen();
 | 
|    var worker = makeWorker(document.getElementById("myWorker").textContent);
 | 
| -  worker.postMessage(offscreenCanvas, [offscreenCanvas]);
 | 
| -  worker.onmessage = function (e) {
 | 
| +
 | 
| +  worker.onmessage = function(msg) {
 | 
| +    var bitmap1 = msg.data.bitmap1;
 | 
| +    var bitmap2 = msg.data.bitmap2;
 | 
| +    var canvas1 = document.getElementById("canvas1");
 | 
| +    var ctx1 = canvas1.getContext('bitmaprenderer');
 | 
| +    ctx1.transferFromImageBitmap(bitmap1);
 | 
| +
 | 
| +    var canvas2 = document.getElementById('canvas2');
 | 
| +    var ctx2 = canvas2.getContext('bitmaprenderer');
 | 
| +    ctx2.transferFromImageBitmap(bitmap2);
 | 
|      waitForFinish();
 | 
|    }
 | 
| +  
 | 
| +  worker.postMessage("");
 | 
|  }
 | 
|  
 | 
|  function waitForFinish()
 | 
| @@ -65,7 +81,10 @@ function waitForFinish()
 | 
|  <div style="position:relative; width:200px; height:200px; background-color:white">
 | 
|  </div>
 | 
|  <div id="container" style="position:absolute; top:0px; left:0px">
 | 
| -<canvas id="c" width="200" height="200" class="nomargin"></canvas>
 | 
| +<canvas id="canvas1" width="100" height="100" class="nomargin"></canvas>
 | 
| +</div>
 | 
| +<div id="container" style="position:absolute; top:0px; left:150px">
 | 
| +<canvas id="canvas2" width="100" height="100" class="nomargin"></canvas>
 | 
|  </div>
 | 
|  </body>
 | 
|  </html>
 | 
| 
 |