Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(403)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: content/test/data/media/mediarecorder_test.html

Issue 1504063003: MediaRecorder tests for Pause functionality (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Fixing non sense in testPauseAndNoDataAvailable Created 5 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« content/browser/media/webrtc_media_recorder_browsertest.cc ('K') | « content/browser/media/webrtc_media_recorder_browsertest.cc ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <head> 3 <head>
4 <title>MediaStream Recoder Browser Test (w/ MediaSource)</title> 4 <title>MediaStream Recoder Browser Test (w/ MediaSource)</title>
5 </head> 5 </head>
6 <body> 6 <body>
7 <div> Record Real-Time video content browser test.</div> 7 <div> Record Real-Time video content browser test.</div>
8 <video id="video" autoplay></video> 8 <video id="video" autoplay></video>
9 </body> 9 </body>
10 <script type="text/javascript" src="mediarecorder_test_utils.js"></script> 10 <script type="text/javascript" src="mediarecorder_test_utils.js"></script>
11 <script type="text/javascript" src="webrtc_test_utilities.js"></script> 11 <script type="text/javascript" src="webrtc_test_utilities.js"></script>
12 <script> 12 <script>
13 13
14 'use strict'; 14 'use strict';
15 15
16 // This test must be run with experimental GetUserMedia flag on. 16 // This test must be run with experimental GetUserMedia flag on.
17 17
18 const DEFAULT_CONSTRAINTS= {audio:true, video:true}; 18 const DEFAULT_CONSTRAINTS= {audio:true, video:true};
19 const DEFAULT_RECORDER_MIME_TYPE = 'video/vp8'; 19 const DEFAULT_RECORDER_MIME_TYPE = 'video/vp8';
20 const DEFAULT_TIME_SLICE = 100; 20 const DEFAULT_TIME_SLICE = 100;
21 21
22 function createAndStartMediaRecorder(stream, mimeType) { 22 function createAndStartMediaRecorder(stream, mimeType, slice) {
23 return new Promise(function(resolve, reject) { 23 return new Promise(function(resolve, reject) {
24 console.log('Starting MediaRecorder instance');
25 document.getElementById("video").src = URL.createObjectURL(stream); 24 document.getElementById("video").src = URL.createObjectURL(stream);
26 var recorder = new MediaRecorder(stream, {"mimeType" : mimeType}); 25 var recorder = new MediaRecorder(stream, {"mimeType" : mimeType});
27 console.log('Recorder object created.'); 26 console.log('Recorder object created.');
28 recorder.start(); 27 if (slice != undefined) {
mcasas 2015/12/14 23:48:49 !== 'undefined' ? http://stackoverflow.com/questi
cpaulin (no longer in chrome) 2015/12/15 22:44:19 |slice != undefined| is correct, more explicit wou
29 resolve(recorder); 28 recorder.start(slice);
30 }); 29 console.log('Recorder started with time slice', slice);
31 } 30 } else {
32 31 recorder.start();
33 function createAndStartWithTimeSliceMediaRecorder(stream, mimeType, slice) { 32 }
34 return new Promise(function(resolve, reject) {
35 console.log('Starting MediaRecorder instance');
36 document.getElementById("video").src = URL.createObjectURL(stream);
37 var recorder = new MediaRecorder(stream, {"mimeType" : mimeType});
38 console.log('Recorder object created.');
39 recorder.start(slice);
40 console.log('Recorder started with time slice', slice);
41 resolve(recorder); 33 resolve(recorder);
42 }); 34 });
43 } 35 }
44 36
45 function createMediaRecorder(stream, mimeType) { 37 function createMediaRecorder(stream, mimeType) {
46 return new Promise(function(resolve, reject) { 38 return new Promise(function(resolve, reject) {
47 console.log('Starting MediaRecorder instance');
48 document.getElementById("video").src = URL.createObjectURL(stream); 39 document.getElementById("video").src = URL.createObjectURL(stream);
49 var recorder = new MediaRecorder(stream, {"mimeType" : mimeType}); 40 var recorder = new MediaRecorder(stream, {"mimeType" : mimeType});
50 console.log('Recorder object created.'); 41 console.log('Recorder object created.');
51 resolve(recorder); 42 resolve(recorder);
52 }); 43 });
53 } 44 }
54 45
55 function testStartAndRecorderState() { 46 function testStartAndRecorderState() {
56 console.log('testStartAndRecorderState started.');
57 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 47 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
58 .then(function(stream) { 48 .then(function(stream) {
59 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 49 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
60 }) 50 })
61 .then(function(recorder) { 51 .then(function(recorder) {
62 assertEquals('recording', recorder.state); 52 assertEquals('recording', recorder.state);
63 }) 53 })
64 .catch(function(err) { 54 .catch(function(err) {
65 return failTest(err.toString()); 55 return failTest(err.toString());
66 }) 56 })
67 .then(function() { 57 .then(function() {
68 reportTestSuccess(); 58 reportTestSuccess();
69 }); 59 });
70 } 60 }
71 61
72 function testStartStopAndRecorderState() { 62 function testStartStopAndRecorderState() {
73 console.log('testStartStopAndRecorderState started.');
74 var theRecorder; 63 var theRecorder;
75 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 64 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
76 .then(function(stream) { 65 .then(function(stream) {
77 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 66 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
78 }) 67 })
79 .then(function(recorder) { 68 .then(function(recorder) {
80 theRecorder = recorder; 69 theRecorder = recorder;
81 theRecorder.stop(); 70 theRecorder.stop();
82 }) 71 })
83 .then(function() { 72 .then(function() {
84 assertEquals('inactive', theRecorder.state); 73 assertEquals('inactive', theRecorder.state);
85 }) 74 })
86 .catch(function(err) { 75 .catch(function(err) {
87 return failTest(err.toString()); 76 return failTest(err.toString());
88 }) 77 })
89 .then(function() { 78 .then(function() {
90 reportTestSuccess(); 79 reportTestSuccess();
91 }); 80 });
92 } 81 }
93 82
94 function testStartAndDataAvailable() { 83 function testStartAndDataAvailable() {
95 console.log('testStartAndDataAvailable started.');
96 var videoSize = 0; 84 var videoSize = 0;
97 var emptyBlobs = 0; 85 var emptyBlobs = 0;
98 var timeStamps = []; 86 var timeStamps = [];
99 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 87 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
100 .then(function(stream) { 88 .then(function(stream) {
101 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 89 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
102 }) 90 })
103 .then(function(recorder) { 91 .then(function(recorder) {
104 // Save history of Blobs received via dataavailable. 92 // Save history of Blobs received via dataavailable.
105 recorder.ondataavailable = function(event) { 93 recorder.ondataavailable = function(event) {
(...skipping 16 matching lines...) Expand all
122 }) 110 })
123 .catch(function(err) { 111 .catch(function(err) {
124 return failTest(err.toString()); 112 return failTest(err.toString());
125 }) 113 })
126 .then(function() { 114 .then(function() {
127 reportTestSuccess(); 115 reportTestSuccess();
128 }); 116 });
129 } 117 }
130 118
131 function testStartWithTimeSlice() { 119 function testStartWithTimeSlice() {
132 console.log('testStartWithTimeSlice started.');
133 var videoSize = 0; 120 var videoSize = 0;
134 var emptyBlobs = 0; 121 var emptyBlobs = 0;
135 var timeStamps = []; 122 var timeStamps = [];
136 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 123 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
137 .then(function(stream) { 124 .then(function(stream) {
138 return createAndStartWithTimeSliceMediaRecorder(stream, 125 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE,
139 DEFAULT_RECORDER_MIME_TYPE, DEFAULT_TIME_SLICE); 126 DEFAULT_TIME_SLICE);
140 }) 127 })
141 .then(function(recorder) { 128 .then(function(recorder) {
142 recorder.ondataavailable = function(event) { 129 recorder.ondataavailable = function(event) {
143 timeStamps.push(event.timeStamp); 130 timeStamps.push(event.timeStamp);
144 if (event.data.size > 0) 131 if (event.data.size > 0)
145 videoSize += event.data.size; 132 videoSize += event.data.size;
146 else 133 else
147 emptyBlobs += 1; 134 emptyBlobs += 1;
148 }; 135 };
149 }) 136 })
150 .then(function() { 137 .then(function() {
151 return waitFor('Making sure the recording has data', 138 return waitFor('Making sure the recording has data',
152 function() { 139 function() {
153 return videoSize > 0 && timeStamps.length > 10; 140 return videoSize > 0 && timeStamps.length > 10;
154 }); 141 });
155 }) 142 })
156 .then(function() { 143 .then(function() {
157 var timeDeltas = getTimeStampDeltas(timeStamps);
158 timeDeltas.forEach(function(timeDelta) {
159 assertTrue(timeDelta >= DEFAULT_TIME_SLICE, 'A time slice was ' +
160 timeDelta + ' ms which is shorter than the expected minimum '
161 + DEFAULT_TIME_SLICE + 'ms');
162 });
163 assertTrue(emptyBlobs == 0, 'Recording has ' + emptyBlobs + 144 assertTrue(emptyBlobs == 0, 'Recording has ' + emptyBlobs +
164 ' empty blobs, there should be no such empty blobs.'); 145 ' empty blobs, there should be no such empty blobs.');
165 }) 146 })
166 .catch(function(err) { 147 .catch(function(err) {
167 return failTest(err.toString()); 148 return failTest(err.toString());
168 }) 149 })
169 .then(function() { 150 .then(function() {
170 reportTestSuccess(); 151 reportTestSuccess();
171 }); 152 });
172 } 153 }
173 154
174 function testStartAndStartEventTriggered() { 155 function testStartAndStartEventTriggered() {
175 console.log('testStartAndStartEventTriggered started.');
176 var theRecorder; 156 var theRecorder;
177 var startEventReceived = false; 157 var startEventReceived = false;
178 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 158 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
179 .then(function(stream) { 159 .then(function(stream) {
180 return createMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 160 return createMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
181 }) 161 })
182 .then(function(recorder) { 162 .then(function(recorder) {
183 theRecorder = recorder; 163 theRecorder = recorder;
184 theRecorder.onstart = function(event) { 164 theRecorder.onstart = function(event) {
185 startEventReceived = true; 165 startEventReceived = true;
(...skipping 10 matching lines...) Expand all
196 }) 176 })
197 .catch(function(err) { 177 .catch(function(err) {
198 return failTest(err.toString()); 178 return failTest(err.toString());
199 }) 179 })
200 .then(function() { 180 .then(function() {
201 reportTestSuccess(); 181 reportTestSuccess();
202 }); 182 });
203 } 183 }
204 184
205 function testStartStopAndStopEventTriggered() { 185 function testStartStopAndStopEventTriggered() {
206 console.log('testStartStopAndStopEventTriggered started.');
207 var theRecorder; 186 var theRecorder;
208 var stopEventReceived = false; 187 var stopEventReceived = false;
209 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 188 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
210 .then(function(stream) { 189 .then(function(stream) {
211 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 190 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
212 }) 191 })
213 .then(function(recorder) { 192 .then(function(recorder) {
214 recorder.onstop = function(event) { 193 recorder.onstop = function(event) {
215 stopEventReceived = true; 194 stopEventReceived = true;
216 }; 195 };
217 recorder.stop(); 196 recorder.stop();
218 }) 197 })
219 .then(function() { 198 .then(function() {
220 return waitFor('Make sure the stop event was received', 199 return waitFor('Make sure the stop event was received',
221 function() { 200 function() {
222 return stopEventReceived == true; 201 return stopEventReceived == true;
223 }); 202 });
224 }) 203 })
225 .catch(function(err) { 204 .catch(function(err) {
226 return failTest(err.toString()); 205 return failTest(err.toString());
227 }) 206 })
228 .then(function() { 207 .then(function() {
229 reportTestSuccess(); 208 reportTestSuccess();
230 }); 209 });
231 } 210 }
232 211
233 function testResumeAndRecorderState() { 212 function testResumeAndRecorderState() {
234 var theRecorder; 213 var theRecorder;
235 console.log('testResumeAndRecorderState started.');
236 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 214 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
237 .then(function(stream) { 215 .then(function(stream) {
238 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 216 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
239 }) 217 })
240 .then(function(recorder) { 218 .then(function(recorder) {
241 theRecorder = recorder; 219 theRecorder = recorder;
242 theRecorder.pause(); 220 theRecorder.pause();
243 }) 221 })
244 .then(function() { 222 .then(function() {
245 theRecorder.resume(); 223 theRecorder.resume();
246 }) 224 })
247 .then(function() { 225 .then(function() {
248 assertEquals('recording', theRecorder.state); 226 assertEquals('recording', theRecorder.state);
249 }) 227 })
250 .catch(function(err) { 228 .catch(function(err) {
251 return failTest(err.toString()); 229 return failTest(err.toString());
252 }) 230 })
253 .then(function() { 231 .then(function() {
254 reportTestSuccess(); 232 reportTestSuccess();
255 }); 233 });
256 } 234 }
257 235
258 function testResumeAndResumeEventTriggered() { 236 function testResumeAndResumeEventTriggered() {
259 var theRecorder; 237 var theRecorder;
260 var resumeEventReceived = false; 238 var resumeEventReceived = false;
261 console.log('testStartAndResumeEventTriggered started.');
262 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 239 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
263 .then(function(stream) { 240 .then(function(stream) {
264 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 241 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
265 }) 242 })
266 .then(function(recorder) { 243 .then(function(recorder) {
267 theRecorder = recorder; 244 theRecorder = recorder;
268 theRecorder.pause(); 245 theRecorder.pause();
269 }) 246 })
270 .then(function() { 247 .then(function() {
271 theRecorder.onresume = function(event) { 248 theRecorder.onresume = function(event) {
272 resumeEventReceived = true; 249 resumeEventReceived = true;
273 } 250 }
274 theRecorder.resume(); 251 theRecorder.resume();
275 }) 252 })
276 .then(function() { 253 .then(function() {
277 return waitFor('Making sure the resume event has been received', 254 return waitFor('Making sure the resume event has been received',
278 function() { 255 function() {
279 return resumeEventReceived == true; 256 return resumeEventReceived == true;
280 }); 257 });
281 }) 258 })
282 .catch(function(err) { 259 .catch(function(err) {
283 return failTest(err.toString()); 260 return failTest(err.toString());
284 }) 261 })
285 .then(function() { 262 .then(function() {
286 reportTestSuccess(); 263 reportTestSuccess();
287 }); 264 });
288 } 265 }
289 266
290 function testNoResumeWhileRecorderInactive() { 267 function testNoResumeWhileRecorderInactive() {
291 console.log('testNoResumeWhileRecorderInactive started.');
292 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 268 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
293 .then(function(stream) { 269 .then(function(stream) {
294 return createMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 270 return createMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
295 }) 271 })
296 .then(function(recorder) { 272 .then(function(recorder) {
297 recorder.resume(); 273 recorder.resume();
298 }) 274 })
275 .then(function() {
276 return failTest('Recorder resumed recording from inactive state.');
277 })
299 .catch(function(err) { 278 .catch(function(err) {
300 reportTestSuccess(); 279 reportTestSuccess();
301 })
302 .then(function() {
303 return failTest('Recorder resumed recording from inactive state.');
304 }); 280 });
305 } 281 }
306 282
307 function testResumeAndDataAvailable() { 283 function testResumeAndDataAvailable() {
308 console.log('testResumeAndDataAvailable started.');
309 var theRecorder; 284 var theRecorder;
310 var videoSize = 0; 285 var videoSize = 0;
311 var emptyBlobs = 0; 286 var emptyBlobs = 0;
312 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 287 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
313 .then(function(stream) { 288 .then(function(stream) {
314 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 289 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
315 }) 290 })
316 .then(function(recorder) { 291 .then(function(recorder) {
317 theRecorder = recorder; 292 theRecorder = recorder;
318 theRecorder.pause(); 293 theRecorder.pause();
(...skipping 23 matching lines...) Expand all
342 ' empty blobs, there should be no such empty blobs.'); 317 ' empty blobs, there should be no such empty blobs.');
343 }) 318 })
344 .catch(function(err) { 319 .catch(function(err) {
345 return failTest(err.toString()); 320 return failTest(err.toString());
346 }) 321 })
347 .then(function() { 322 .then(function() {
348 reportTestSuccess(); 323 reportTestSuccess();
349 }); 324 });
350 } 325 }
351 326
327 function testPauseAndRecorderState() {
328 var theRecorder;
329 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
330 .then(function(stream) {
331 return createAndStartMediaRecorder(stream,
332 DEFAULT_RECORDER_MIME_TYPE);
mcasas 2015/12/14 23:48:50 nit: fits in one line, here and elsewhere.
cpaulin (no longer in chrome) 2015/12/15 22:44:19 Acknowledged.
333 })
334 .then(function(recorder) {
335 theRecorder = recorder;
336 theRecorder.pause();
337 })
338 .then(function() {
339 assertEquals('paused', theRecorder.state);
340 })
341 .catch(function(err) {
342 return failTest(err.toString());
343 })
344 .then(function() {
345 reportTestSuccess();
346 });
347 }
348
349 function testPauseStopAndRecorderState() {
350 var theRecorder;
351 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
352 .then(function(stream) {
353 return createAndStartMediaRecorder(stream,
354 DEFAULT_RECORDER_MIME_TYPE);
355 })
356 .then(function(recorder) {
357 theRecorder = recorder;
358 theRecorder.pause();
359 })
360 .then(function() {
361 theRecorder.stop();
362 })
363 .then(function() {
364 assertEquals('inactive', theRecorder.state);
365 })
366 .catch(function(err) {
367 return failTest(err.toString());
368 })
369 .then(function() {
370 reportTestSuccess();
371 });
372 }
373
374 function testPauseAndPauseEventTriggered() {
375 var pauseEventReceived = false;
376 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
377 .then(function(stream) {
378 return createAndStartMediaRecorder(stream,
379 DEFAULT_RECORDER_MIME_TYPE);
380 })
381 .then(function(recorder) {
382 recorder.onpause = function(event) {
383 pauseEventReceived = true;
384 }
385 recorder.pause();
mcasas 2015/12/14 23:48:49 I would just bundle here the checking assertEqual
cpaulin (no longer in chrome) 2015/12/15 22:44:19 Acknowledged.
386 })
387 .then(function() {
388 return waitFor('Making sure the pause event has been received',
389 function() {
390 return pauseEventReceived == true;
391 });
392 })
393 .catch(function(err) {
394 return failTest(err.toString());
395 })
396 .then(function() {
397 reportTestSuccess();
398 });
399 }
400
401 function testPauseAndNoDataAvailable() {
402 var theRecorder;
403 var videoSize = 0;
404 var emptyBlobs = 0;
405 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
406 .then(function(stream) {
407 return createAndStartMediaRecorder(stream,
408 DEFAULT_RECORDER_MIME_TYPE);
409 })
410 .then(function(recorder) {
411 theRecorder = recorder;
412 theRecorder.pause();
413 })
414 .then(function() {
415 theRecorder.ondataavailable = function(event) {
416 failTest("Received unexpected data after pause!");
417 };
418 })
419 .then(function() {
420 return waitDuration(2000);
421 })
422 .catch(function(err) {
423 return failTest(err.toString());
424 })
425 .then(function() {
426 reportTestSuccess();
427 });
428 }
429
430 function testNoPauseWhileRecorderInactive() {
mcasas 2015/12/14 23:48:50 It'd be great to have a one liner description per
cpaulin (no longer in chrome) 2015/12/15 22:44:19 I will address it in: crbug.com/570074
431 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
432 .then(function(stream) {
433 return createMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
434 })
435 .then(function(recorder) {
436 recorder.pause();
mcasas 2015/12/14 23:48:49 This test is a great candidate for // Verify tha
cpaulin (no longer in chrome) 2015/12/15 22:44:19 I will address this in crbug/570074
437 })
438 .then(function() {
439 return failTest('Recorder paused recording from inactive state.');
440 })
441 .catch(function(err) {
442 reportTestSuccess();
443 });
444 }
445
352 </script> 446 </script>
353 </body> 447 </body>
354 </html> 448 </html>
OLDNEW
« content/browser/media/webrtc_media_recorder_browsertest.cc ('K') | « content/browser/media/webrtc_media_recorder_browsertest.cc ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698