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
|
<!doctype html>
<html>
<head>
<title>A disabled video track is rendered as blackness</title>
<link rel="author" title="Dominique Hazael-Massieux" href="mailto:dom@w3.org"/>
<link rel="help" href="http://dev.w3.org/2011/webrtc/editor/getusermedia.html#introduction">
<link rel="help" href="http://dev.w3.org/2011/webrtc/editor/getusermedia.html#mediastreams-as-media-elements">
</head>
<body>
<p class="instructions">When prompted, accept to share your video stream.</p>
<h1 class="instructions">Description</h1>
<p class="instructions">This test checks that a disabled video track in a
MediaStream is handled correctly by HTMLVideoElement.</p>
<video id="vid"></video>
<div id='log'></div>
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<script src=/resources/testdriver.js></script>
<script src=/resources/testdriver-vendor.js></script>
<script src=permission-helper.js></script>
<script>
const vid = document.getElementById("vid");
const cv = document.createElement("canvas");
promise_test(async t => {
await setMediaPermission("granted", ["camera"]);
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
for (let track of stream.getTracks()) {
track.stop();
}
vid.srcObject = null;
});
stream.getTracks()[0].enabled = false;
vid.srcObject = stream;
vid.play();
await new Promise(r => vid.onloadeddata = r);
cv.width = vid.videoWidth;
cv.height = vid.videoHeight;
const ctx = cv.getContext("2d");
ctx.drawImage(vid,0,0);
const imageData = ctx.getImageData(0, 0, cv.width, cv.height);
for (let i = 0; i < imageData.data.length / 4; ++i) {
assert_equals(imageData.data[i * 4], 0, "No red component in pixel #" + i);
assert_equals(imageData.data[i * 4 + 1], 0, "No green component in pixel #" + i);
assert_equals(imageData.data[i * 4 + 2], 0, "No blue component in pixel #" + i);
assert_equals(imageData.data[i * 4 + 3], 255, "No transparency in pixel #" + i);
}
}, "Tests that a disabled video track in a MediaStream is rendered as blackness");
promise_test(async t => {
const ctx = cv.getContext("2d");
ctx.fillStyle = "red";
ctx.fillRect(0, 0, cv.width, cv.height);
const stream = cv.captureStream();
t.add_cleanup(() => {
for (let track of stream.getTracks()) {
track.stop();
}
vid.srcObject = null;
});
stream.getTracks()[0].enabled = false;
vid.srcObject = stream;
vid.play();
await new Promise(r => vid.onloadeddata = r);
assert_equals(vid.videoWidth, cv.width);
assert_equals(vid.videoHeight, cv.height);
}, "Test that a video element rendering a disabled video track reports correct intrinsic dimensions");
promise_test(async t => {
const originalWidth = cv.width;
const originalHeight = cv.height;
const vid2 = document.createElement("video");
const ctx = cv.getContext("2d");
ctx.fillStyle = "red";
ctx.fillRect(0, 0, cv.width, cv.height);
const stream = cv.captureStream();
const stream2 = stream.clone();
t.add_cleanup(() => {
for (let track of [...stream.getTracks(), ...stream2.getTracks()]) {
track.stop();
}
vid.srcObject = null;
vid2.srcObject = null;
cv.width = originalWidth;
cv.height = originalHeight;
});
stream.getTracks()[0].enabled = false;
vid.srcObject = stream;
vid2.srcObject = stream2;
vid.play();
vid2.play();
await Promise.all([
new Promise(r => vid.onresize = r),
new Promise(r => vid2.onresize = r),
]);
// Test "flow" of the disabled track by checking for "resize" events on a
// video element rendering that track. They should not fire. As a reference,
// we look for two "resize" events on a different video element rendering an
// enabled clone of the disabled track. We look for two and not one event
// because then we don't rely on any ordering of events coming from the two
// video elements.
let resized = 0;
vid.addEventListener("resize", () => ++resized);
for (let i = 0; i < 2; ++i) {
cv.width = cv.width / 2;
cv.height = cv.height / 2;
ctx.fillRect(0, 0, cv.width, cv.height);
await new Promise(r => vid2.onresize = r);
}
assert_equals(resized, 0);
}, "Test that frames don't flow for a disabled video track");
</script>
</body>
</html>
|
