| OLD | NEW | 
|---|
| 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) { | 
| 23   return new Promise(function(resolve, reject) { | 23   return new Promise(function(resolve, reject) { | 
| 24     console.log('Starting MediaRecorder instance'); | 24     console.log('Starting MediaRecorder instance'); | 
| 25     document.getElementById("video").src = URL.createObjectURL(stream); | 25     document.getElementById("video").src = URL.createObjectURL(stream); | 
| 26     var recorder = new MediaRecorder(stream, mimeType); | 26     var recorder = new MediaRecorder(stream, {"mimeType" : mimeType}); | 
| 27     console.log('Recorder object created.'); | 27     console.log('Recorder object created.'); | 
| 28     recorder.start(); | 28     recorder.start(); | 
| 29     resolve(recorder); | 29     resolve(recorder); | 
| 30   }); | 30   }); | 
| 31 } | 31 } | 
| 32 | 32 | 
| 33 function createAndStartWithTimeSliceMediaRecorder(stream, mimeType, slice) { | 33 function createAndStartWithTimeSliceMediaRecorder(stream, mimeType, slice) { | 
| 34   return new Promise(function(resolve, reject) { | 34   return new Promise(function(resolve, reject) { | 
| 35     console.log('Starting MediaRecorder instance'); | 35     console.log('Starting MediaRecorder instance'); | 
| 36     document.getElementById("video").src = URL.createObjectURL(stream); | 36     document.getElementById("video").src = URL.createObjectURL(stream); | 
| 37     var recorder = new MediaRecorder(stream, mimeType); | 37     var recorder = new MediaRecorder(stream, {"mimeType" : mimeType}); | 
| 38     console.log('Recorder object created.'); | 38     console.log('Recorder object created.'); | 
| 39     recorder.start(slice); | 39     recorder.start(slice); | 
| 40     console.log('Recorder started with time slice', slice); | 40     console.log('Recorder started with time slice', slice); | 
| 41     resolve(recorder); | 41     resolve(recorder); | 
| 42   }); | 42   }); | 
| 43 } | 43 } | 
| 44 | 44 | 
| 45 function createMediaRecorder(stream, mimeType) { | 45 function createMediaRecorder(stream, mimeType) { | 
| 46   return new Promise(function(resolve, reject) { | 46   return new Promise(function(resolve, reject) { | 
| 47     console.log('Starting MediaRecorder instance'); | 47     console.log('Starting MediaRecorder instance'); | 
| 48     document.getElementById("video").src = URL.createObjectURL(stream); | 48     document.getElementById("video").src = URL.createObjectURL(stream); | 
| 49     var recorder = new MediaRecorder(stream, mimeType); | 49     var recorder = new MediaRecorder(stream, {"mimeType" : mimeType}); | 
| 50     console.log('Recorder object created.'); | 50     console.log('Recorder object created.'); | 
| 51     resolve(recorder); | 51     resolve(recorder); | 
| 52   }); | 52   }); | 
| 53 } | 53 } | 
| 54 | 54 | 
| 55 function testStartAndRecorderState() { | 55 function testStartAndRecorderState() { | 
| 56   console.log('testStartAndRecorderState started.'); | 56   console.log('testStartAndRecorderState started.'); | 
| 57   navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 57   navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 
| 58       .then(function(stream) { | 58       .then(function(stream) { | 
| 59         return createAndStartMediaRecorder(stream, | 59         return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); | 
| 60             DEFAULT_RECORDER_MIME_TYPE); |  | 
| 61       }) | 60       }) | 
| 62       .then(function(recorder) { | 61       .then(function(recorder) { | 
| 63         assertEquals('recording', recorder.state); | 62         assertEquals('recording', recorder.state); | 
| 64       }) | 63       }) | 
| 65       .catch(function(err) { | 64       .catch(function(err) { | 
| 66         return failTest(err.toString()); | 65         return failTest(err.toString()); | 
| 67       }) | 66       }) | 
| 68       .then(function() { | 67       .then(function() { | 
| 69         reportTestSuccess(); | 68         reportTestSuccess(); | 
| 70       }); | 69       }); | 
| 71 } | 70 } | 
| 72 | 71 | 
| 73 function testStartStopAndRecorderState() { | 72 function testStartStopAndRecorderState() { | 
| 74   console.log('testStartStopAndRecorderState started.'); | 73   console.log('testStartStopAndRecorderState started.'); | 
| 75   var theRecorder; | 74   var theRecorder; | 
| 76   navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 75   navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 
| 77       .then(function(stream) { | 76       .then(function(stream) { | 
| 78         return createAndStartMediaRecorder(stream, | 77         return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); | 
| 79             DEFAULT_RECORDER_MIME_TYPE); |  | 
| 80       }) | 78       }) | 
| 81       .then(function(recorder) { | 79       .then(function(recorder) { | 
| 82         theRecorder = recorder; | 80         theRecorder = recorder; | 
| 83         theRecorder.stop(); | 81         theRecorder.stop(); | 
| 84       }) | 82       }) | 
| 85       .then(function() { | 83       .then(function() { | 
| 86         assertEquals('inactive', theRecorder.state); | 84         assertEquals('inactive', theRecorder.state); | 
| 87       }) | 85       }) | 
| 88       .catch(function(err) { | 86       .catch(function(err) { | 
| 89         return failTest(err.toString()); | 87         return failTest(err.toString()); | 
| 90       }) | 88       }) | 
| 91       .then(function() { | 89       .then(function() { | 
| 92         reportTestSuccess(); | 90         reportTestSuccess(); | 
| 93       }); | 91       }); | 
| 94 } | 92 } | 
| 95 | 93 | 
| 96 function testStartAndDataAvailable() { | 94 function testStartAndDataAvailable() { | 
| 97   console.log('testStartAndDataAvailable started.'); | 95   console.log('testStartAndDataAvailable started.'); | 
| 98   var videoSize = 0; | 96   var videoSize = 0; | 
| 99   var emptyBlobs = 0; | 97   var emptyBlobs = 0; | 
| 100   var timeStamps = []; | 98   var timeStamps = []; | 
| 101   navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 99   navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 
| 102       .then(function(stream) { | 100       .then(function(stream) { | 
| 103         return createAndStartMediaRecorder(stream, | 101         return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); | 
| 104             DEFAULT_RECORDER_MIME_TYPE); |  | 
| 105       }) | 102       }) | 
| 106       .then(function(recorder) { | 103       .then(function(recorder) { | 
| 107         // Save history of Blobs received via dataavailable. | 104         // Save history of Blobs received via dataavailable. | 
| 108         recorder.ondataavailable = function(event) { | 105         recorder.ondataavailable = function(event) { | 
| 109           timeStamps.push(event.timeStamp); | 106           timeStamps.push(event.timeStamp); | 
| 110           if (event.data.size > 0) | 107           if (event.data.size > 0) | 
| 111             videoSize  += event.data.size; | 108             videoSize  += event.data.size; | 
| 112           else | 109           else | 
| 113             emptyBlobs += 1; | 110             emptyBlobs += 1; | 
| 114         }; | 111         }; | 
| (...skipping 116 matching lines...) Expand 10 before | Expand all | Expand 10 after  Loading... | 
| 231       .then(function() { | 228       .then(function() { | 
| 232         reportTestSuccess(); | 229         reportTestSuccess(); | 
| 233       }); | 230       }); | 
| 234 } | 231 } | 
| 235 | 232 | 
| 236 function testResumeAndRecorderState() { | 233 function testResumeAndRecorderState() { | 
| 237   var theRecorder; | 234   var theRecorder; | 
| 238   console.log('testResumeAndRecorderState started.'); | 235   console.log('testResumeAndRecorderState started.'); | 
| 239   navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 236   navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 
| 240       .then(function(stream) { | 237       .then(function(stream) { | 
| 241         return createAndStartMediaRecorder(stream, | 238         return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); | 
| 242             DEFAULT_RECORDER_MIME_TYPE); |  | 
| 243       }) | 239       }) | 
| 244       .then(function(recorder) { | 240       .then(function(recorder) { | 
| 245         theRecorder = recorder; | 241         theRecorder = recorder; | 
| 246         theRecorder.pause(); | 242         theRecorder.pause(); | 
| 247       }) | 243       }) | 
| 248       .then(function() { | 244       .then(function() { | 
| 249         theRecorder.resume(); | 245         theRecorder.resume(); | 
| 250       }) | 246       }) | 
| 251       .then(function() { | 247       .then(function() { | 
| 252         assertEquals('recording', theRecorder.state); | 248         assertEquals('recording', theRecorder.state); | 
| 253       }) | 249       }) | 
| 254       .catch(function(err) { | 250       .catch(function(err) { | 
| 255         return failTest(err.toString()); | 251         return failTest(err.toString()); | 
| 256       }) | 252       }) | 
| 257       .then(function() { | 253       .then(function() { | 
| 258         reportTestSuccess(); | 254         reportTestSuccess(); | 
| 259       }); | 255       }); | 
| 260 } | 256 } | 
| 261 | 257 | 
| 262 function testResumeAndResumeEventTriggered() { | 258 function testResumeAndResumeEventTriggered() { | 
| 263   var theRecorder; | 259   var theRecorder; | 
| 264   var resumeEventReceived = false; | 260   var resumeEventReceived = false; | 
| 265   console.log('testStartAndResumeEventTriggered started.'); | 261   console.log('testStartAndResumeEventTriggered started.'); | 
| 266   navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 262   navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 
| 267       .then(function(stream) { | 263       .then(function(stream) { | 
| 268         return createAndStartMediaRecorder(stream, | 264         return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); | 
| 269             DEFAULT_RECORDER_MIME_TYPE); |  | 
| 270       }) | 265       }) | 
| 271       .then(function(recorder) { | 266       .then(function(recorder) { | 
| 272         theRecorder = recorder; | 267         theRecorder = recorder; | 
| 273         theRecorder.pause(); | 268         theRecorder.pause(); | 
| 274       }) | 269       }) | 
| 275       .then(function() { | 270       .then(function() { | 
| 276         theRecorder.onresume = function(event) { | 271         theRecorder.onresume = function(event) { | 
| 277           resumeEventReceived = true; | 272           resumeEventReceived = true; | 
| 278         } | 273         } | 
| 279         theRecorder.resume(); | 274         theRecorder.resume(); | 
| (...skipping 29 matching lines...) Expand all  Loading... | 
| 309       }); | 304       }); | 
| 310 } | 305 } | 
| 311 | 306 | 
| 312 function testResumeAndDataAvailable() { | 307 function testResumeAndDataAvailable() { | 
| 313   console.log('testResumeAndDataAvailable started.'); | 308   console.log('testResumeAndDataAvailable started.'); | 
| 314   var theRecorder; | 309   var theRecorder; | 
| 315   var videoSize = 0; | 310   var videoSize = 0; | 
| 316   var emptyBlobs = 0; | 311   var emptyBlobs = 0; | 
| 317   navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 312   navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 
| 318       .then(function(stream) { | 313       .then(function(stream) { | 
| 319         return createAndStartMediaRecorder(stream, | 314         return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); | 
| 320             DEFAULT_RECORDER_MIME_TYPE); |  | 
| 321       }) | 315       }) | 
| 322       .then(function(recorder) { | 316       .then(function(recorder) { | 
| 323         theRecorder = recorder; | 317         theRecorder = recorder; | 
| 324         theRecorder.pause(); | 318         theRecorder.pause(); | 
| 325       }) | 319       }) | 
| 326       .then(function() { | 320       .then(function() { | 
| 327         theRecorder.ondataavailable = function(event) { | 321         theRecorder.ondataavailable = function(event) { | 
| 328           if (event.data.size > 0) { | 322           if (event.data.size > 0) { | 
| 329             videoSize  += event.data.size; | 323             videoSize  += event.data.size; | 
| 330           } else { | 324           } else { | 
| (...skipping 17 matching lines...) Expand all  Loading... | 
| 348             ' empty blobs, there should be no such empty blobs.'); | 342             ' empty blobs, there should be no such empty blobs.'); | 
| 349       }) | 343       }) | 
| 350       .catch(function(err) { | 344       .catch(function(err) { | 
| 351         return failTest(err.toString()); | 345         return failTest(err.toString()); | 
| 352       }) | 346       }) | 
| 353       .then(function() { | 347       .then(function() { | 
| 354         reportTestSuccess(); | 348         reportTestSuccess(); | 
| 355       }); | 349       }); | 
| 356 } | 350 } | 
| 357 | 351 | 
| 358 |  | 
| 359 </script> | 352 </script> | 
| 360 </body> | 353 </body> | 
| 361 </html> | 354 </html> | 
| OLD | NEW | 
|---|