xidachen | 5d34a13 | 2016-01-23 23:27:32 | [diff] [blame^] | 1 | <!DOCTYPE html> |
| 2 | <html> |
| 3 | <body> |
| 4 | <canvas id="canvas" width="3" height="2"></canvas> |
| 5 | <script src="../../resources/js-test.js"></script> |
| 6 | <script> |
| 7 | jsTestIsAsync = true; |
| 8 | var worker = new Worker('./resources/canvas-ImageBitmap-structured-clone.js'); |
| 9 | |
| 10 | description("Tests that ImageBitmap supports structured clone and that the pixel data survives the trip between main <--> worker"); |
| 11 | |
| 12 | function shouldNotBeCalled() { |
| 13 | testFailed("createImageBitmap promise rejected."); |
| 14 | finishJSTest(); |
| 15 | } |
| 16 | |
| 17 | var imageWidth1 = 3; |
| 18 | var imageHeight1 = 2; |
| 19 | var imageWidth2 = 1; |
| 20 | var imageHeight2 = 1; |
| 21 | var bitmapWidth; |
| 22 | var bitmapHeight; |
| 23 | var newImage1; |
| 24 | var newImage2; |
| 25 | var imageBitmap1; |
| 26 | var imageBitmap2; |
| 27 | var newImageBitmap; |
| 28 | var image1 = new ImageData(new Uint8ClampedArray( |
| 29 | [255, 0, 0, 255, |
| 30 | 0, 255, 0, 255, |
| 31 | 255, 255, 255, 127, |
| 32 | 0, 0, 0, 64, |
| 33 | 12, 34, 56, 64, |
| 34 | 12, 34, 56, 127]), |
| 35 | imageWidth1, imageHeight1); |
| 36 | var image2 = new ImageData(new Uint8ClampedArray([255, 128, 64, 127]), imageWidth2, imageHeight2); |
| 37 | var context = document.getElementById("canvas").getContext("2d"); |
| 38 | |
| 39 | var p1 = createImageBitmap(image1).then(function(image) {imageBitmap1 = image}); |
| 40 | var p2 = createImageBitmap(image2).then(function(image) {imageBitmap2 = image}); |
| 41 | Promise.all([p1, p2]).then(function() { |
| 42 | bitmapWidth = imageBitmap1.width; |
| 43 | bitmapHeight = imageBitmap1.height; |
| 44 | shouldBe("bitmapWidth", "imageWidth1"); |
| 45 | shouldBe("bitmapHeight", "imageHeight1"); |
| 46 | |
| 47 | worker.postMessage({label:'bitmap1', data:imageBitmap1}); |
| 48 | |
| 49 | // Structured cloning should not neuter the source ImageBitmap |
| 50 | bitmapWidth = imageBitmap1.width; |
| 51 | bitmapHeight = imageBitmap1.height; |
| 52 | shouldBe("bitmapWidth", "imageWidth1"); |
| 53 | shouldBe("bitmapHeight", "imageHeight1"); |
| 54 | }, shouldNotBeCalled); |
| 55 | |
| 56 | worker.onmessage = function(e) { |
| 57 | newImageBitmap = e.data.data; |
| 58 | bitmapWidth = newImageBitmap.width; |
| 59 | bitmapHeight = newImageBitmap.height; |
| 60 | context.clearRect(0, 0, imageWidth1, imageHeight1); |
| 61 | context.drawImage(newImageBitmap, 0, 0, bitmapWidth, bitmapHeight); |
| 62 | newImage = context.getImageData(0, 0, bitmapWidth, bitmapHeight); |
| 63 | |
| 64 | switch (e.data.label) { |
| 65 | case 'bitmap1': |
| 66 | shouldBe("bitmapWidth", "imageWidth1"); |
| 67 | shouldBe("bitmapHeight", "imageHeight1"); |
| 68 | |
| 69 | // newImage is not necessary the same as imageData because of |
| 70 | // multiplying and dividing by alpha during the round trip, but |
| 71 | // they should be close. |
| 72 | // The alpha channel should be exactly the same. |
| 73 | shouldBeCloseTo("newImage.data[0]", "image1.data[0]", 5); |
| 74 | shouldBeCloseTo("newImage.data[1]", "image1.data[1]", 5); |
| 75 | shouldBeCloseTo("newImage.data[2]", "image1.data[2]", 5); |
| 76 | shouldBe("newImage.data[3]", "image1.data[3]"); |
| 77 | |
| 78 | shouldBeCloseTo("newImage.data[4]", "image1.data[4]", 5); |
| 79 | shouldBeCloseTo("newImage.data[5]", "image1.data[5]", 5); |
| 80 | shouldBeCloseTo("newImage.data[6]", "image1.data[6]", 5); |
| 81 | shouldBe("newImage.data[7]", "image1.data[7]"); |
| 82 | |
| 83 | shouldBeCloseTo("newImage.data[8]", "image1.data[8]", 5); |
| 84 | shouldBeCloseTo("newImage.data[9]", "image1.data[9]", 5); |
| 85 | shouldBeCloseTo("newImage.data[10]", "image1.data[10]", 5); |
| 86 | shouldBe("newImage.data[11]", "image1.data[11]"); |
| 87 | |
| 88 | shouldBeCloseTo("newImage.data[12]", "image1.data[12]", 5); |
| 89 | shouldBeCloseTo("newImage.data[13]", "image1.data[13]", 5); |
| 90 | shouldBeCloseTo("newImage.data[14]", "image1.data[14]", 5); |
| 91 | shouldBe("newImage.data[15]", "image1.data[15]"); |
| 92 | |
| 93 | shouldBeCloseTo("newImage.data[16]", "image1.data[16]", 5); |
| 94 | shouldBeCloseTo("newImage.data[17]", "image1.data[17]", 5); |
| 95 | shouldBeCloseTo("newImage.data[18]", "image1.data[18]", 5); |
| 96 | shouldBe("newImage.data[19]", "image1.data[19]"); |
| 97 | |
| 98 | shouldBeCloseTo("newImage.data[20]", "image1.data[20]", 5); |
| 99 | shouldBeCloseTo("newImage.data[21]", "image1.data[21]", 5); |
| 100 | shouldBeCloseTo("newImage.data[22]", "image1.data[22]", 5); |
| 101 | shouldBe("newImage.data[23]", "image1.data[23]"); |
| 102 | |
| 103 | bitmapWidth = imageBitmap2.width; |
| 104 | bitmapHeight = imageBitmap2.height; |
| 105 | shouldBe("bitmapWidth", "imageWidth2"); |
| 106 | shouldBe("bitmapHeight", "imageHeight2"); |
| 107 | |
| 108 | worker.postMessage({label:'bitmap2', data:imageBitmap2}); |
| 109 | |
| 110 | // Structured cloning should not neuter the source ImageBitmap |
| 111 | bitmapWidth = imageBitmap2.width; |
| 112 | bitmapHeight = imageBitmap2.height; |
| 113 | shouldBe("bitmapWidth", "imageWidth2"); |
| 114 | shouldBe("bitmapHeight", "imageHeight2"); |
| 115 | break; |
| 116 | case 'bitmap2': |
| 117 | shouldBe("bitmapWidth", "imageWidth2"); |
| 118 | shouldBe("bitmapHeight", "imageHeight2"); |
| 119 | |
| 120 | shouldBeCloseTo("newImage.data[0]", "image2.data[0]", 5); |
| 121 | shouldBeCloseTo("newImage.data[1]", "image2.data[1]", 5); |
| 122 | shouldBeCloseTo("newImage.data[2]", "image2.data[2]", 5); |
| 123 | shouldBe("newImage.data[3]", "image2.data[3]"); |
| 124 | finishJSTest(); |
| 125 | break; |
| 126 | } |
| 127 | } |
| 128 | </script> |
| 129 | </body> |
| 130 | </html> |