1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
|
<!DOCTYPE html>
<html>
<body>
<canvas id="canvas" width="3" height="2"></canvas>
<script src="../../resources/js-test.js"></script>
<script>
jsTestIsAsync = true;
var worker = new Worker('./resources/canvas-ImageBitmap-structured-clone.js');
description("Tests that ImageBitmap supports structured clone and that the pixel data survives the trip between main <--> worker");
function shouldNotBeCalled(e) {
testFailed("promise rejected." + e);
finishJSTest();
}
function compareImageData(data1, data2)
{
if (data1.length != data2.length) {
testFailed("The two image have different dimensions");
return;
}
for (var i = 0; i < data1.length; i++) {
if ((i % 4 != 3 && Math.abs(data1[i] - data2[i]) > 5) ||
(i % 4 == 3 && data1[i] != data2[i])) {
testFailed("The ImageBitmap pixel data did not survive the round trip");
return;
}
}
testPassed("The ImageBitmap pixel data survives the round trip");
}
function checkImageBitmap1() {
shouldBe("bitmapWidth", "imageWidth1");
shouldBe("bitmapHeight", "imageHeight1");
// newImage is not necessary the same as imageData because of
// multiplying and dividing by alpha during the round trip, but
// they should be close.
// The alpha channel should be exactly the same.
compareImageData(newImage.data, image1.data);
}
function checkImageBitmap2() {
shouldBe("bitmapWidth", "imageWidth2");
shouldBe("bitmapHeight", "imageHeight2");
compareImageData(newImage.data, image2.data);
}
function postToWorker(message, transferable) {
return new Promise((resolve, reject) => {
function onMessage(e) {
resolve(e.data);
worker.removeEventListener("message", onMessage);
}
worker.postMessage(message, transferable);
worker.addEventListener("message", onMessage);
});
}
function getNewImageDataFromWorkerReply(newImageBitmap)
{
bitmapWidth = newImageBitmap.width;
bitmapHeight = newImageBitmap.height;
context.clearRect(0, 0, imageWidth1, imageHeight1);
context.drawImage(newImageBitmap, 0, 0, bitmapWidth, bitmapHeight);
newImage = context.getImageData(0, 0, bitmapWidth, bitmapHeight);
}
var imageWidth1 = 3;
var imageHeight1 = 2;
var imageWidth2 = 1;
var imageHeight2 = 1;
var bitmapWidth;
var bitmapHeight;
var imageBitmap1;
var imageBitmap2;
var newImage;
var image1 = new ImageData(new Uint8ClampedArray(
[255, 0, 0, 255,
0, 255, 0, 255,
255, 255, 255, 127,
0, 0, 0, 64,
12, 34, 56, 64,
12, 34, 56, 127]),
imageWidth1, imageHeight1);
var image2 = new ImageData(new Uint8ClampedArray([255, 128, 64, 127]), imageWidth2, imageHeight2);
var context = document.getElementById("canvas").getContext("2d");
var p1 = createImageBitmap(image1).then(function(image) {imageBitmap1 = image});
var p2 = createImageBitmap(image2).then(function(image) {imageBitmap2 = image});
Promise.all([p1, p2]).then(function() {
bitmapWidth = imageBitmap1.width;
bitmapHeight = imageBitmap1.height;
shouldBe("bitmapWidth", "imageWidth1");
shouldBe("bitmapHeight", "imageHeight1");
var replyPromise = postToWorker(imageBitmap1);
// Structured cloning should not neuter the source ImageBitmap
bitmapWidth = imageBitmap1.width;
bitmapHeight = imageBitmap1.height;
shouldBe("bitmapWidth", "imageWidth1");
shouldBe("bitmapHeight", "imageHeight1");
return replyPromise.then(reply => {
getNewImageDataFromWorkerReply(reply);
checkImageBitmap1();
});
}).then(function() {
var replyPromise = postToWorker(imageBitmap1, [imageBitmap1]);
// Transfer the ImageBitmap should neuter it
bitmapWidth = imageBitmap1.width;
bitmapHeight = imageBitmap1.height;
shouldBe("bitmapWidth", "0");
shouldBe("bitmapHeight", "0");
return replyPromise.then(reply => {
getNewImageDataFromWorkerReply(reply);
checkImageBitmap1();
});
}).then(function() {
var replyPromise = postToWorker(imageBitmap2);
// Structured cloning should not neuter the source ImageBitmap
bitmapWidth = imageBitmap2.width;
bitmapHeight = imageBitmap2.height;
shouldBe("bitmapWidth", "imageWidth2");
shouldBe("bitmapHeight", "imageHeight2");
return replyPromise.then(reply => {
getNewImageDataFromWorkerReply(reply);
checkImageBitmap2();
});
}).then(finishJSTest, shouldNotBeCalled);
</script>
</body>
</html>
|
