| 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 id="myWorker" type="text/worker"> | 6 <script id="myWorker" type="text/worker"> |
| 3 self.onmessage = function (e) { | 7 self.onmessage = function (e) { |
| 4 var offCanvas = new OffscreenCanvas(50, 50); | 8 var offCanvas = new OffscreenCanvas(50, 50); |
| 5 var gl = offCanvas.getContext('webgl'); | 9 var gl = offCanvas.getContext('webgl'); |
| 6 gl.clearColor(0, 1, 0, 1); | 10 gl.clearColor(0, 1, 0, 1); |
| 7 gl.clear(gl.COLOR_BUFFER_BIT); | 11 gl.clear(gl.COLOR_BUFFER_BIT); |
| 8 | 12 |
| 9 // TODO: Add more image types to this test once the toImageData() for webgl | |
| 10 // is completed. See crbug.com/657531. | |
| 11 offCanvas.convertToBlob() | 13 offCanvas.convertToBlob() |
| 12 .then(function(blob) { | 14 .then(function(blob) { |
| 13 self.postMessage({version: "png", data:blob}); | 15 self.postMessage({version: "png", data:blob}); |
| 14 }); | 16 }); |
| 17 |
| 18 offCanvas.convertToBlob({type: "image/jpeg"}) |
| 19 .then(function(blob) { |
| 20 self.postMessage({version: "jpeg-high", data:blob}); |
| 21 }); |
| 22 |
| 23 offCanvas.convertToBlob({type: "image/jpeg", quality: 0.2}) |
| 24 .then(function(blob) { |
| 25 self.postMessage({version: "jpeg-low", data:blob}); |
| 26 }); |
| 27 |
| 28 offCanvas.convertToBlob({type: "image/webp"}) |
| 29 .then(function(blob) { |
| 30 self.postMessage({version: "webp-high", data:blob}); |
| 31 }); |
| 32 |
| 33 offCanvas.convertToBlob({type: "image/webp", quality: 0.2}) |
| 34 .then(function(blob) { |
| 35 |
| 36 self.postMessage({version: "webp-low", data:blob}); |
| 37 }); |
| 15 } | 38 } |
| 16 </script> | 39 </script> |
| 17 <script> | 40 <script> |
| 18 if (window.testRunner) { | 41 if (window.testRunner) { |
| 19 testRunner.waitUntilDone(); | 42 testRunner.waitUntilDone(); |
| 20 } | 43 } |
| 21 | 44 |
| 22 var pngImage = document.getElementById('png'); | 45 var pngImage = document.getElementById('png'); |
| 46 var jpegImageHigh = document.getElementById('jpeg-high'); |
| 47 var jpegImageLow = document.getElementById('jpeg-low'); |
| 48 var webpImageHigh = document.getElementById('webp-high'); |
| 49 var webpImageLow = document.getElementById('webp-low'); |
| 50 var numTestCount = 5; |
| 23 function imageLoaded() { | 51 function imageLoaded() { |
| 24 if (window.testRunner) { | 52 numTestCount--; |
| 53 if (numTestCount == 0 && window.testRunner) { |
| 25 window.testRunner.notifyDone(); | 54 window.testRunner.notifyDone(); |
| 26 } | 55 } |
| 27 } | 56 } |
| 28 pngImage.addEventListener('load', imageLoaded); | 57 pngImage.addEventListener('load', imageLoaded); |
| 58 jpegImageHigh.addEventListener('load', imageLoaded); |
| 59 jpegImageLow.addEventListener('load', imageLoaded); |
| 60 webpImageHigh.addEventListener('load', imageLoaded); |
| 61 webpImageLow.addEventListener('load', imageLoaded); |
| 29 | 62 |
| 30 var workerBlob = new Blob([document.getElementById('myWorker').textContent]); | 63 var workerBlob = new Blob([document.getElementById('myWorker').textContent]); |
| 31 var worker = new Worker(URL.createObjectURL(workerBlob)); | 64 var worker = new Worker(URL.createObjectURL(workerBlob)); |
| 32 worker.addEventListener("message", function(msg) { | 65 worker.addEventListener("message", function(msg) { |
| 33 var blob = msg.data.data; | 66 var blob = msg.data.data; |
| 34 switch (msg.data.version) { | 67 switch (msg.data.version) { |
| 35 case 'png': | 68 case 'png': |
| 36 pngImage.src = URL.createObjectURL(blob); | 69 pngImage.src = URL.createObjectURL(blob); |
| 37 break; | 70 break; |
| 71 case 'jpeg-high': |
| 72 jpegImageHigh.src = URL.createObjectURL(blob); |
| 73 break; |
| 74 case 'jpeg-low': |
| 75 jpegImageLow.src = URL.createObjectURL(blob); |
| 76 break; |
| 77 case 'webp-high': |
| 78 webpImageHigh.src = URL.createObjectURL(blob); |
| 79 break; |
| 80 case 'webp-low': |
| 81 webpImageLow.src = URL.createObjectURL(blob); |
| 82 break; |
| 38 } | 83 } |
| 39 }); | 84 }); |
| 40 worker.postMessage(""); | 85 worker.postMessage(""); |
| 41 </script> | 86 </script> |
| 42 | 87 |
| OLD | NEW |