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