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
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
|
<!doctype html>
<html>
<head>
<title>Assigning mediastream to a video element</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#navigatorusermedia">
</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 the MediaStream object returned by
the success callback in getUserMedia can be properly assigned to a video element
via the <code>srcObject</code> attribute.</p>
<audio id="aud"></audio>
<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>
'use strict';
const vid = document.getElementById("vid");
function queueTask(f) {
window.onmessage = f;
window.postMessage("hi");
}
promise_test(async t => {
await setMediaPermission();
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
vid.srcObject = stream;
}, "Tests that a MediaStream can be assigned to a video element with srcObject");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
vid.srcObject = stream;
assert_true(!vid.seeking, "A MediaStream is not seekable");
assert_equals(vid.seekable.length, 0, "A MediaStream is not seekable");
}, "Tests that a MediaStream assigned to a video element is not seekable");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
vid.srcObject = stream;
assert_equals(vid.readyState, vid.HAVE_NOTHING,
"readyState is HAVE_NOTHING initially");
await new Promise(r => vid.onloadeddata = r);
assert_equals(vid.readyState, vid.HAVE_ENOUGH_DATA,
"Upon having loaded a media stream, the UA sets readyState to HAVE_ENOUGH_DATA");
}, "Tests that a MediaStream assigned to a video element is in readyState HAVE_NOTHING initially");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
vid.srcObject = stream;
assert_equals(vid.duration, NaN,
"A MediaStream does not have any duration initially.");
await new Promise(r => vid.ondurationchange = r);
assert_equals(vid.duration, Infinity,
"A loaded MediaStream does not have a pre-defined duration.");
vid.play();
await new Promise(r => vid.ontimeupdate = r);
for (const t of stream.getTracks()) {
t.stop();
}
await new Promise(r => vid.ondurationchange = r);
assert_equals(vid.duration, vid.currentTime,
"After ending playback, duration gets set to currentTime");
}, "Tests that a MediaStream assigned to a video element has expected duration");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
vid.preload = "metadata";
vid.srcObject = stream;
assert_equals(vid.buffered.length, 0,
"A MediaStream cannot be preloaded. Therefore, there are no buffered timeranges");
assert_equals(vid.preload, "none", "preload must always be none");
vid.preload = "auto";
assert_equals(vid.preload, "none", "Setting preload must be ignored");
await new Promise(r => vid.onloadeddata = r);
assert_equals(vid.buffered.length, 0,
"A MediaStream cannot be preloaded. Therefore, there are no buffered timeranges");
vid.srcObject = null;
assert_equals(vid.preload, "metadata",
"The preload attribute returns the value it had before using a MediaStream");
}, "Tests that a video element with a MediaStream assigned is not preloaded");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
vid.defaultPlaybackRate = 0.3;
vid.playbackRate = 0.3;
vid.onratechange = t.unreached_func("ratechange event must not be fired");
vid.srcObject = stream;
assert_equals(vid.defaultPlaybackRate, 1, "playback rate is always 1");
vid.defaultPlaybackRate = 0.5;
assert_equals(vid.defaultPlaybackRate, 1,
"Setting defaultPlaybackRate must be ignored");
assert_equals(vid.playbackRate, 1, "playback rate is always 1");
vid.playbackRate = 0.5;
assert_equals(vid.playbackRate, 1, "Setting playbackRate must be ignored");
vid.srcObject = null;
assert_equals(vid.defaultPlaybackRate, 0.3,
"The defaultPlaybackRate attribute returns the value it had before using a MediaStream");
assert_equals(vid.playbackRate, 0.3,
"The playbackRate attribute is set to the value of the defaultPlaybackRate attribute when unsetting srcObject");
// Check that there's no ratechange event
await new Promise(r => t.step_timeout(r, 100));
}, "Tests that a video element with a MediaStream assigned ignores playbackRate attributes (defaultPlaybackRate is identical)");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
vid.defaultPlaybackRate = 0.3;
vid.playbackRate = 0.4;
vid.onratechange = t.unreached_func("ratechange event must not be fired");
vid.srcObject = stream;
assert_equals(vid.defaultPlaybackRate, 1, "playback rate is always 1");
vid.defaultPlaybackRate = 0.5;
assert_equals(vid.defaultPlaybackRate, 1,
"Setting defaultPlaybackRate must be ignored");
assert_equals(vid.playbackRate, 1, "playback rate is always 1");
vid.playbackRate = 0.5;
assert_equals(vid.playbackRate, 1, "Setting playbackRate must be ignored");
vid.srcObject = null;
assert_equals(vid.defaultPlaybackRate, 0.3,
"The defaultPlaybackRate attribute returns the value it had before using a MediaStream");
assert_equals(vid.playbackRate, 0.3,
"The playbackRate attribute is set to the value of the defaultPlaybackRate attribute when unsetting srcObject (and fires ratechange)");
await new Promise(r => vid.onratechange = r);
}, "Tests that a video element with a MediaStream assigned ignores playbackRate attributes (defaultPlaybackRate is different)");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
vid.srcObject = stream;
await new Promise(r => vid.oncanplay = r);
vid.play();
await new Promise(r => vid.ontimeupdate = r);
assert_greater_than(vid.currentTime, 0,
"currentTime is greater than 0 after first timeupdate");
assert_equals(vid.played.length, 1,
"A MediaStream's timeline always consists of a single range");
assert_equals(vid.played.start(0), 0,
"A MediaStream's timeline always starts at zero");
assert_equals(vid.played.end(0), vid.currentTime,
"A MediaStream's end MUST return the last known currentTime");
const time = vid.currentTime;
vid.currentTime = 0;
assert_equals(vid.currentTime, time,
"The UA MUST ignore attempts to set the currentTime attribute");
}, "Tests that a media element with an assigned MediaStream reports the played attribute as expected");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
vid.srcObject = stream;
assert_equals(vid.currentTime, 0, "The initial value is 0");
vid.currentTime = 42;
assert_equals(vid.currentTime, 0,
"The UA MUST ignore attempts to set the currentTime attribute (default playback start position)");
await new Promise(r => vid.onloadeddata = r);
assert_equals(vid.currentTime, 0, "The initial value is 0");
vid.currentTime = 42;
assert_equals(vid.currentTime, 0,
"The UA MUST ignore attempts to set the currentTime attribute (official playback position)");
vid.play();
await new Promise(r => vid.ontimeupdate = r);
assert_greater_than(vid.currentTime, 0,
"currentTime is greater than 0 after first timeupdate");
const lastTime = vid.currentTime;
vid.currentTime = 0;
assert_equals(vid.currentTime, lastTime,
"The UA MUST ignore attempts to set the currentTime attribute (restart)");
for(const t of stream.getTracks()) {
t.stop();
}
await new Promise(r => vid.onended = r);
assert_greater_than_equal(vid.currentTime, lastTime,
"currentTime advanced after stopping");
}, "Tests that a media element with an assigned MediaStream reports the currentTime attribute as expected");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
vid.srcObject = stream;
await new Promise(r => t.step_timeout(r, 500));
vid.play();
await new Promise(r => vid.ontimeupdate = r);
assert_between_exclusive(vid.currentTime, 0, 0.5,
"currentTime starts at 0 and has progressed at first timeupdate");
}, "Tests that a media element with an assigned MediaStream starts its timeline at 0 regardless of when the MediaStream was created");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
vid.srcObject = stream;
vid.play();
await new Promise(r => vid.ontimeupdate = r);
vid.pause();
const pauseCurrentTime = vid.currentTime;
await new Promise(r => vid.onpause = r);
vid.ontimeupdate = () => assert_unreached("No timeupdate while paused");
await new Promise(r => t.step_timeout(r, 500));
assert_equals(vid.currentTime, pauseCurrentTime,
"currentTime does not change while paused");
vid.play();
await new Promise(r => vid.ontimeupdate = r);
assert_between_exclusive(vid.currentTime - pauseCurrentTime, 0, 0.5,
"currentTime does not skip ahead after pause");
}, "Tests that a media element with an assigned MediaStream does not advance currentTime while paused");
promise_test(async t => {
const canvas = document.createElement("canvas");
const ctx = canvas.getContext("2d");
const stream = canvas.captureStream();
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
vid.srcObject = stream;
vid.ontimeupdate = () =>
assert_unreached("No timeupdate until potentially playing");
vid.play();
await new Promise(r => t.step_timeout(r, 1000));
assert_equals(vid.readyState, vid.HAVE_NOTHING,
"Video dimensions not known yet");
const start = performance.now();
ctx.fillStyle = "green";
ctx.fillRect(0, 0, canvas.width, canvas.height);
// Wait for, and check, potentially playing
await new Promise(r => vid.oncanplay = r);
const canplayDuration = (performance.now() - start) / 1000;
// "canplay" was just dispatched from a task queued when the element became
// potentially playing. currentTime may not have progressed more than the time
// it took from becoming potentially playing to starting the
// canplay-dispatching task. Though the media clock and the js clock may be
// different, so we take double this duration, or 100ms, whichever is greater,
// as a safety margin.
const margin = Math.max(0.1, canplayDuration * 2);
assert_between_inclusive(vid.currentTime, 0, margin,
"currentTime has not advanced more than twice it took to dispatch canplay");
assert_false(vid.paused, "Media element is not paused");
assert_false(vid.ended, "Media element is not ended");
assert_equals(vid.error, null,
"Media element playback has not stopped due to errors");
assert_greater_than(vid.readyState, vid.HAVE_CURRENT_DATA,
"Media element playback is not blocked");
// Unclear how to check for "paused for user interaction" and "paused for
// in-band content".
await new Promise(r => vid.ontimeupdate = r);
assert_between_exclusive(vid.currentTime, 0, 1,
"currentTime advances while potentially playing");
}, "Tests that a media element with an assigned MediaStream does not start advancing currentTime until potentially playing");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => {
vid.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
assert_equals(vid.loop, false, "loop is false by default");
vid.srcObject = stream;
vid.loop = true;
assert_equals(vid.loop, true,
"loop can be changed when assigned a MediaStream");
await new Promise(r => vid.onloadeddata = r);
vid.loop = false;
assert_equals(vid.loop, false,
"loop can be changed when having loaded a MediaStream");
vid.play();
await new Promise(r => vid.ontimeupdate = r);
vid.loop = true;
assert_equals(vid.loop, true,
"loop can be changed when playing a MediaStream");
for(const t of stream.getTracks()) {
t.stop();
}
// If loop is ignored, we get "ended",
// otherwise the media element sets currentTime to 0 without ending.
await new Promise(r => vid.onended = r);
}, "Tests that the loop attribute has no effect on a media element with an assigned MediaStream");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => { vid.srcObject = null; });
vid.srcObject = stream;
await vid.play();
for (const track of stream.getTracks()) {
track.stop();
}
assert_false(stream.active, "MediaStream becomes inactive with only ended tracks");
assert_false(vid.ended, "HTMLMediaElement reports ended the next time the event loop reaches step 1 (sync)");
await Promise.resolve();
assert_false(vid.ended, "HTMLMediaElement reports ended the next time the event loop reaches step 1 (microtask)");
let ended = false;
vid.onended = () => ended = true;
await new Promise(r => queueTask(r));
assert_true(vid.ended, "HTMLMediaElement becomes ended asynchronously when its MediaStream provider becomes inactive");
assert_true(ended, "HTMLMediaElement fires the ended event asynchronously when its MediaStream provider becomes inactive");
}, "Tests that a media element with an assigned MediaStream ends when the MediaStream becomes inactive through tracks ending");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({audio: true, video: true});
t.add_cleanup(() => {
aud.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
aud.srcObject = stream;
await aud.play();
for (const track of stream.getAudioTracks()) {
track.stop();
}
assert_true(stream.active, "MediaStream is still active with a live video track");
assert_false(aud.ended, "HTMLMediaElement reports ended the next time the event loop reaches step 1 (sync)");
await Promise.resolve();
assert_false(aud.ended, "HTMLMediaElement reports ended the next time the event loop reaches step 1 (microtask)");
let ended = false;
aud.onended = () => ended = true;
await new Promise(r => queueTask(r));
assert_true(aud.ended, "HTMLAudioElement becomes ended asynchronously when its MediaStream provider becomes inaudible");
assert_true(ended, "HTMLAudioElement fires the ended event asynchronously when its MediaStream provider becomes inaudible");
}, "Tests that an audio element with an assigned MediaStream ends when the MediaStream becomes inaudible through audio tracks ending");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({video: true});
t.add_cleanup(() => { vid.srcObject = null; });
vid.srcObject = stream;
await vid.play();
for (const track of stream.getTracks()) {
stream.removeTrack(track);
}
assert_false(stream.active, "MediaStream becomes inactive with no tracks");
assert_false(vid.ended, "HTMLMediaElement reports ended the next time the event loop reaches step 1 (sync)");
await Promise.resolve();
assert_false(vid.ended, "HTMLMediaElement reports ended the next time the event loop reaches step 1 (microtask)");
let ended = false;
vid.onended = () => ended = true;
await new Promise(r => queueTask(r));
assert_true(vid.ended, "HTMLMediaElement becomes ended asynchronously when its MediaStream provider becomes inactive");
assert_true(ended, "HTMLMediaElement fires the ended event asynchronously when its MediaStream provider becomes inactive");
}, "Tests that a media element with an assigned MediaStream ends when the MediaStream becomes inactive through track removal");
promise_test(async t => {
const stream = await navigator.mediaDevices.getUserMedia({audio: true, video: true});
t.add_cleanup(() => {
aud.srcObject = null;
stream.getTracks().forEach(track => track.stop());
});
aud.srcObject = stream;
await aud.play();
for (const track of stream.getAudioTracks()) {
stream.removeTrack(track);
}
assert_true(stream.active, "MediaStream is still active with a live video track");
assert_false(aud.ended, "HTMLMediaElement reports ended the next time the event loop reaches step 1 (sync)");
await Promise.resolve();
assert_false(aud.ended, "HTMLMediaElement reports ended the next time the event loop reaches step 1 (microtask)");
let ended = false;
aud.onended = () => ended = true;
await new Promise(r => queueTask(r));
assert_true(aud.ended, "HTMLAudioElement becomes ended asynchronously when its MediaStream provider becomes inaudible");
assert_true(ended, "HTMLAudioElement fires the ended event asynchronously when its MediaStream provider becomes inaudible");
}, "Tests that an audio element with an assigned MediaStream ends when the MediaStream becomes inaudible through track removal");
</script>
</body>
</html>
|
