| OLD | NEW |
| 1 <img id="png"/> | 1 <img id="png"/> |
| 2 <img id="jpeg-high"/> |
| 3 <img id="jpeg-low"/> |
| 4 <img id="webp-high"/> |
| 5 <img id="webp-low"/> |
| 2 <script type="text/javascript"> | 6 <script type="text/javascript"> |
| 3 if (window.testRunner) { | 7 if (window.testRunner) { |
| 4 testRunner.waitUntilDone(); | 8 testRunner.waitUntilDone(); |
| 5 } | 9 } |
| 6 | 10 |
| 7 // TODO: Add more image types to this test once the toImageData() for webgl | |
| 8 // is completed. See crbug.com/657531. | |
| 9 var pngImage = document.getElementById('png'); | 11 var pngImage = document.getElementById('png'); |
| 12 var jpegImageHigh = document.getElementById('jpeg-high'); |
| 13 var jpegImageLow = document.getElementById('jpeg-low'); |
| 14 var webpImageHigh = document.getElementById('webp-high'); |
| 15 var webpImageLow = document.getElementById('webp-low'); |
| 16 var numTestCount = 5; |
| 10 function imageLoaded() { | 17 function imageLoaded() { |
| 11 if (window.testRunner) { | 18 numTestCount--; |
| 19 if (numTestCount == 0 && window.testRunner) { |
| 12 window.testRunner.notifyDone(); | 20 window.testRunner.notifyDone(); |
| 13 } | 21 } |
| 14 } | 22 } |
| 15 pngImage.addEventListener('load', imageLoaded); | 23 pngImage.addEventListener('load', imageLoaded); |
| 24 jpegImageHigh.addEventListener('load', imageLoaded); |
| 25 jpegImageLow.addEventListener('load', imageLoaded); |
| 26 webpImageHigh.addEventListener('load', imageLoaded); |
| 27 webpImageLow.addEventListener('load', imageLoaded); |
| 16 | 28 |
| 17 var offCanvas = new OffscreenCanvas(50, 50); | 29 var offCanvas = new OffscreenCanvas(50, 50); |
| 18 var gl = offCanvas.getContext('webgl'); | 30 var gl = offCanvas.getContext('webgl'); |
| 19 gl.clearColor(0, 1, 0, 1); | 31 gl.clearColor(0, 1, 0, 1); |
| 20 gl.clear(gl.COLOR_BUFFER_BIT); | 32 gl.clear(gl.COLOR_BUFFER_BIT); |
| 21 | 33 |
| 22 offCanvas.convertToBlob() | 34 offCanvas.convertToBlob() |
| 23 .then(function(blob) { | 35 .then(function(blob) { |
| 24 pngImage.src = URL.createObjectURL(blob); | 36 pngImage.src = URL.createObjectURL(blob); |
| 25 }); | 37 }); |
| 26 | 38 |
| 39 offCanvas.convertToBlob({type: "image/jpeg"}) |
| 40 .then(function(blob) { |
| 41 jpegImageHigh.src = URL.createObjectURL(blob); |
| 42 }); |
| 43 |
| 44 offCanvas.convertToBlob({type: "image/jpeg", quality: 0.2}) |
| 45 .then(function(blob) { |
| 46 jpegImageLow.src = URL.createObjectURL(blob); |
| 47 }); |
| 48 |
| 49 offCanvas.convertToBlob({type: "image/webp"}) |
| 50 .then(function(blob) { |
| 51 webpImageHigh.src = URL.createObjectURL(blob); |
| 52 }); |
| 53 |
| 54 offCanvas.convertToBlob({type: "image/webp", quality: 0.2}) |
| 55 .then(function(blob) { |
| 56 webpImageLow.src = URL.createObjectURL(blob); |
| 57 }); |
| 58 |
| 27 </script> | 59 </script> |
| 28 | 60 |
| OLD | NEW |