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

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: Disable android for now and address comments 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
« no previous file with comments | « 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) {
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 assertTrue(emptyBlobs == 0, 'Recording has ' + emptyBlobs + 144 assertTrue(emptyBlobs == 0, 'Recording has ' + emptyBlobs +
158 ' empty blobs, there should be no such empty blobs.'); 145 ' empty blobs, there should be no such empty blobs.');
159 }) 146 })
160 .catch(function(err) { 147 .catch(function(err) {
161 return failTest(err.toString()); 148 return failTest(err.toString());
162 }) 149 })
163 .then(function() { 150 .then(function() {
164 reportTestSuccess(); 151 reportTestSuccess();
165 }); 152 });
166 } 153 }
167 154
168 function testStartAndStartEventTriggered() { 155 function testStartAndStartEventTriggered() {
169 console.log('testStartAndStartEventTriggered started.');
170 var theRecorder; 156 var theRecorder;
171 var startEventReceived = false; 157 var startEventReceived = false;
172 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 158 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
173 .then(function(stream) { 159 .then(function(stream) {
174 return createMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 160 return createMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
175 }) 161 })
176 .then(function(recorder) { 162 .then(function(recorder) {
177 theRecorder = recorder; 163 theRecorder = recorder;
178 theRecorder.onstart = function(event) { 164 theRecorder.onstart = function(event) {
179 startEventReceived = true; 165 startEventReceived = true;
(...skipping 10 matching lines...) Expand all
190 }) 176 })
191 .catch(function(err) { 177 .catch(function(err) {
192 return failTest(err.toString()); 178 return failTest(err.toString());
193 }) 179 })
194 .then(function() { 180 .then(function() {
195 reportTestSuccess(); 181 reportTestSuccess();
196 }); 182 });
197 } 183 }
198 184
199 function testStartStopAndStopEventTriggered() { 185 function testStartStopAndStopEventTriggered() {
200 console.log('testStartStopAndStopEventTriggered started.');
201 var theRecorder; 186 var theRecorder;
202 var stopEventReceived = false; 187 var stopEventReceived = false;
203 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 188 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
204 .then(function(stream) { 189 .then(function(stream) {
205 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 190 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
206 }) 191 })
207 .then(function(recorder) { 192 .then(function(recorder) {
208 recorder.onstop = function(event) { 193 recorder.onstop = function(event) {
209 stopEventReceived = true; 194 stopEventReceived = true;
210 }; 195 };
211 recorder.stop(); 196 recorder.stop();
212 }) 197 })
213 .then(function() { 198 .then(function() {
214 return waitFor('Make sure the stop event was received', 199 return waitFor('Make sure the stop event was received',
215 function() { 200 function() {
216 return stopEventReceived == true; 201 return stopEventReceived == true;
217 }); 202 });
218 }) 203 })
219 .catch(function(err) { 204 .catch(function(err) {
220 return failTest(err.toString()); 205 return failTest(err.toString());
221 }) 206 })
222 .then(function() { 207 .then(function() {
223 reportTestSuccess(); 208 reportTestSuccess();
224 }); 209 });
225 } 210 }
226 211
227 function testResumeAndRecorderState() { 212 function testResumeAndRecorderState() {
228 var theRecorder; 213 var theRecorder;
229 console.log('testResumeAndRecorderState started.');
230 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 214 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
231 .then(function(stream) { 215 .then(function(stream) {
232 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 216 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
233 }) 217 })
234 .then(function(recorder) { 218 .then(function(recorder) {
235 theRecorder = recorder; 219 theRecorder = recorder;
236 theRecorder.pause(); 220 theRecorder.pause();
237 }) 221 })
238 .then(function() { 222 .then(function() {
239 theRecorder.resume(); 223 theRecorder.resume();
240 }) 224 })
241 .then(function() { 225 .then(function() {
242 assertEquals('recording', theRecorder.state); 226 assertEquals('recording', theRecorder.state);
243 }) 227 })
244 .catch(function(err) { 228 .catch(function(err) {
245 return failTest(err.toString()); 229 return failTest(err.toString());
246 }) 230 })
247 .then(function() { 231 .then(function() {
248 reportTestSuccess(); 232 reportTestSuccess();
249 }); 233 });
250 } 234 }
251 235
252 function testResumeAndResumeEventTriggered() { 236 function testResumeAndResumeEventTriggered() {
253 var theRecorder; 237 var theRecorder;
254 var resumeEventReceived = false; 238 var resumeEventReceived = false;
255 console.log('testStartAndResumeEventTriggered started.');
256 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 239 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
257 .then(function(stream) { 240 .then(function(stream) {
258 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 241 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
259 }) 242 })
260 .then(function(recorder) { 243 .then(function(recorder) {
261 theRecorder = recorder; 244 theRecorder = recorder;
262 theRecorder.pause(); 245 theRecorder.pause();
263 }) 246 })
264 .then(function() { 247 .then(function() {
265 theRecorder.onresume = function(event) { 248 theRecorder.onresume = function(event) {
266 resumeEventReceived = true; 249 resumeEventReceived = true;
267 } 250 }
268 theRecorder.resume(); 251 theRecorder.resume();
269 }) 252 })
270 .then(function() { 253 .then(function() {
271 return waitFor('Making sure the resume event has been received', 254 return waitFor('Making sure the resume event has been received',
272 function() { 255 function() {
273 return resumeEventReceived == true; 256 return resumeEventReceived == true;
274 }); 257 });
275 }) 258 })
276 .catch(function(err) { 259 .catch(function(err) {
277 return failTest(err.toString()); 260 return failTest(err.toString());
278 }) 261 })
279 .then(function() { 262 .then(function() {
280 reportTestSuccess(); 263 reportTestSuccess();
281 }); 264 });
282 } 265 }
283 266
284 function testNoResumeWhileRecorderInactive() { 267 function testNoResumeWhileRecorderInactive() {
285 console.log('testNoResumeWhileRecorderInactive started.');
286 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 268 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
287 .then(function(stream) { 269 .then(function(stream) {
288 return createMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 270 return createMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
289 }) 271 })
290 .then(function(recorder) { 272 .then(function(recorder) {
291 recorder.resume(); 273 recorder.resume();
292 }) 274 })
275 .then(function() {
276 return failTest('Recorder resumed recording from inactive state.');
277 })
293 .catch(function(err) { 278 .catch(function(err) {
294 reportTestSuccess(); 279 reportTestSuccess();
295 })
296 .then(function() {
297 return failTest('Recorder resumed recording from inactive state.');
298 }); 280 });
299 } 281 }
300 282
301 function testResumeAndDataAvailable() { 283 function testResumeAndDataAvailable() {
302 console.log('testResumeAndDataAvailable started.');
303 var theRecorder; 284 var theRecorder;
304 var videoSize = 0; 285 var videoSize = 0;
305 var emptyBlobs = 0; 286 var emptyBlobs = 0;
306 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) 287 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
307 .then(function(stream) { 288 .then(function(stream) {
308 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); 289 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
309 }) 290 })
310 .then(function(recorder) { 291 .then(function(recorder) {
311 theRecorder = recorder; 292 theRecorder = recorder;
312 theRecorder.pause(); 293 theRecorder.pause();
(...skipping 23 matching lines...) Expand all
336 ' empty blobs, there should be no such empty blobs.'); 317 ' empty blobs, there should be no such empty blobs.');
337 }) 318 })
338 .catch(function(err) { 319 .catch(function(err) {
339 return failTest(err.toString()); 320 return failTest(err.toString());
340 }) 321 })
341 .then(function() { 322 .then(function() {
342 reportTestSuccess(); 323 reportTestSuccess();
343 }); 324 });
344 } 325 }
345 326
327 function testPauseAndRecorderState() {
328 var theRecorder;
329 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
330 .then(function(stream) {
331 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
332 })
333 .then(function(recorder) {
334 theRecorder = recorder;
335 theRecorder.pause();
336 })
337 .then(function() {
338 assertEquals('paused', theRecorder.state);
339 })
340 .catch(function(err) {
341 return failTest(err.toString());
342 })
343 .then(function() {
344 reportTestSuccess();
345 });
346 }
347
348 function testPauseStopAndRecorderState() {
349 var theRecorder;
350 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
351 .then(function(stream) {
352 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
353 })
354 .then(function(recorder) {
355 theRecorder = recorder;
356 theRecorder.pause();
357 })
358 .then(function() {
359 theRecorder.stop();
360 })
361 .then(function() {
362 assertEquals('inactive', theRecorder.state);
363 })
364 .catch(function(err) {
365 return failTest(err.toString());
366 })
367 .then(function() {
368 reportTestSuccess();
369 });
370 }
371
372 function testPauseAndPauseEventTriggered() {
373 var pauseEventReceived = false;
374 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
375 .then(function(stream) {
376 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
377 })
378 .then(function(recorder) {
379 recorder.onpause = function(event) {
380 pauseEventReceived = true;
381 }
382 recorder.pause();
383 })
384 .then(function() {
385 return waitFor('Making sure the pause event has been received',
386 function() {
387 return pauseEventReceived == true;
388 });
389 })
390 .catch(function(err) {
391 return failTest(err.toString());
392 })
393 .then(function() {
394 reportTestSuccess();
395 });
396 }
397
398 function testPauseAndNoDataAvailable() {
399 var theRecorder;
400 var videoSize = 0;
401 var emptyBlobs = 0;
402 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
403 .then(function(stream) {
404 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
405 })
406 .then(function(recorder) {
407 theRecorder = recorder;
408 theRecorder.pause();
409 })
410 .then(function() {
411 theRecorder.ondataavailable = function(event) {
412 failTest("Received unexpected data after pause!");
413 };
414 })
415 .then(function() {
416 return waitDuration(2000);
417 })
418 .catch(function(err) {
419 return failTest(err.toString());
420 })
421 .then(function() {
422 reportTestSuccess();
423 });
424 }
425
426 function testNoPauseWhileRecorderInactive() {
427 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS)
428 .then(function(stream) {
429 return createMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE);
430 })
431 .then(function(recorder) {
432 recorder.pause();
433 })
434 .then(function() {
435 return failTest('Recorder paused recording from inactive state.');
436 })
437 .catch(function(err) {
438 reportTestSuccess();
439 });
440 }
441
346 </script> 442 </script>
347 </body> 443 </body>
348 </html> 444 </html>
OLDNEW
« no previous file with comments | « 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