| <!DOCTYPE html> |
| <html> |
| <head></head> |
| <body> |
| <canvas id="myCanvas" width="512" height="256"></canvas> |
| </body> |
| <script> |
| // Test that an offscreen canvas' transform is applied correctly after a call |
| // to transferToImageBitmap. transferToImageBitmap discards the resource but |
| // needs to maintain the matrix. |
| // See crbug.com/102321 |
| var canvas = document.getElementById("myCanvas"); |
| var halfWidth = canvas.width >> 1; |
| |
| var offscreenCanvas = new OffscreenCanvas(canvas.width, canvas.height); |
| var offscreenCtx = offscreenCanvas.getContext('2d'); |
| |
| // The bug only occurs when calling transferToImageBitmap after getting an |
| // OffscreenCanvasRenderingContext2D. |
| offscreenCanvas.transferToImageBitmap(); |
| offscreenCtx.translate(canvas.width/2, 0); |
| |
| offscreenCtx.fillStyle = 'green'; |
| offscreenCtx.fillRect(0, 0, offscreenCanvas.width, offscreenCanvas.height); |
| |
| |
| var ctx = canvas.getContext('2d'); |
| ctx.fillStyle = 'red'; |
| ctx.fillRect(canvas.width/2, 0, canvas.width/2, canvas.height); |
| ctx.drawImage(offscreenCtx.canvas, 0, 0); |
| </script> |
| </html> |
