| 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 <video id="remoteVideo" autoplay></video> | 9 <video id="remoteVideo" autoplay></video> |
| 10 </body> | 10 </body> |
| (...skipping 69 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 80 | 80 |
| 81 document.getElementById('video').src = URL.createObjectURL( | 81 document.getElementById('video').src = URL.createObjectURL( |
| 82 localStream); | 82 localStream); |
| 83 }); | 83 }); |
| 84 } | 84 } |
| 85 | 85 |
| 86 function createAndStartMediaRecorder(stream, mimeType, slice) { | 86 function createAndStartMediaRecorder(stream, mimeType, slice) { |
| 87 return new Promise(function(resolve, reject) { | 87 return new Promise(function(resolve, reject) { |
| 88 document.getElementById('video').src = URL.createObjectURL(stream); | 88 document.getElementById('video').src = URL.createObjectURL(stream); |
| 89 var recorder = new MediaRecorder(stream, {'mimeType' : mimeType}); | 89 var recorder = new MediaRecorder(stream, {'mimeType' : mimeType}); |
| 90 console.log('Recorder object created.'); | 90 console.log('Recorder object created, mimeType = ' + mimeType); |
| 91 if (slice != undefined) { | 91 if (slice != undefined) { |
| 92 recorder.start(slice); | 92 recorder.start(slice); |
| 93 console.log('Recorder started with time slice', slice); | 93 console.log('Recorder started with time slice', slice); |
| 94 } else { | 94 } else { |
| 95 recorder.start(); | 95 recorder.start(); |
| 96 } | 96 } |
| 97 resolve(recorder); | 97 resolve(recorder); |
| 98 }); | 98 }); |
| 99 } | 99 } |
| 100 | 100 |
| (...skipping 60 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 161 return failTest(err.toString()); | 161 return failTest(err.toString()); |
| 162 }) | 162 }) |
| 163 .then(function() { | 163 .then(function() { |
| 164 reportTestSuccess(); | 164 reportTestSuccess(); |
| 165 }); | 165 }); |
| 166 } | 166 } |
| 167 | 167 |
| 168 // Tests that when MediaRecorder's start() function is called, some data is | 168 // Tests that when MediaRecorder's start() function is called, some data is |
| 169 // made available by media recorder via dataavailable events, containing non | 169 // made available by media recorder via dataavailable events, containing non |
| 170 // empty blob data. | 170 // empty blob data. |
| 171 function testStartAndDataAvailable() { | 171 function testStartAndDataAvailable(codec) { |
| 172 var videoSize = 0; | 172 var videoSize = 0; |
| 173 var emptyBlobs = 0; | 173 var emptyBlobs = 0; |
| 174 var timeStamps = []; | 174 var timeStamps = []; |
| 175 const mimeType = codec ? "video/webm;codecs=" + String(codec) : ""; |
| 175 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 176 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) |
| 176 .then(function(stream) { | 177 .then(function(stream) { |
| 177 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); | 178 return createAndStartMediaRecorder(stream, mimeType); |
| 178 }) | 179 }) |
| 179 .then(function(recorder) { | 180 .then(function(recorder) { |
| 180 // Save history of Blobs received via dataavailable. | 181 // Save history of Blobs received via dataavailable. |
| 181 recorder.ondataavailable = function(event) { | 182 recorder.ondataavailable = function(event) { |
| 182 timeStamps.push(event.timeStamp); | 183 timeStamps.push(event.timeStamp); |
| 183 if (event.data.size > 0) | 184 if (event.data.size > 0) |
| 184 videoSize += event.data.size; | 185 videoSize += event.data.size; |
| 185 else | 186 else |
| 186 emptyBlobs += 1; | 187 emptyBlobs += 1; |
| 187 }; | 188 }; |
| (...skipping 11 matching lines...) Expand all Loading... |
| 199 .catch(function(err) { | 200 .catch(function(err) { |
| 200 return failTest(err.toString()); | 201 return failTest(err.toString()); |
| 201 }) | 202 }) |
| 202 .then(function() { | 203 .then(function() { |
| 203 reportTestSuccess(); | 204 reportTestSuccess(); |
| 204 }); | 205 }); |
| 205 } | 206 } |
| 206 | 207 |
| 207 // Tests that when MediaRecorder's start(timeSlice) is called, some data | 208 // Tests that when MediaRecorder's start(timeSlice) is called, some data |
| 208 // available events are fired containing non empty blob data. | 209 // available events are fired containing non empty blob data. |
| 209 function testStartWithTimeSlice() { | 210 function testStartWithTimeSlice(codec) { |
| 210 var videoSize = 0; | 211 var videoSize = 0; |
| 211 var emptyBlobs = 0; | 212 var emptyBlobs = 0; |
| 212 var timeStamps = []; | 213 var timeStamps = []; |
| 214 const mimeType = codec ? "video/webm;codecs=" + String(codec) : ""; |
| 213 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 215 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) |
| 214 .then(function(stream) { | 216 .then(function(stream) { |
| 215 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE, | 217 return createAndStartMediaRecorder(stream, mimeType,
DEFAULT_TIME_SLICE); |
| 216 DEFAULT_TIME_SLICE); | |
| 217 }) | 218 }) |
| 218 .then(function(recorder) { | 219 .then(function(recorder) { |
| 219 recorder.ondataavailable = function(event) { | 220 recorder.ondataavailable = function(event) { |
| 220 timeStamps.push(event.timeStamp); | 221 timeStamps.push(event.timeStamp); |
| 221 if (event.data.size > 0) | 222 if (event.data.size > 0) |
| 222 videoSize += event.data.size; | 223 videoSize += event.data.size; |
| 223 else | 224 else |
| 224 emptyBlobs += 1; | 225 emptyBlobs += 1; |
| 225 }; | 226 }; |
| 226 }) | 227 }) |
| 227 .then(function() { | 228 .then(function() { |
| 228 return waitFor('Making sure the recording has data', | 229 return waitFor('Making sure the recording has data', |
| 229 function() { | 230 function() { |
| 230 return videoSize > 0 && timeStamps.length > 10; | 231 return videoSize > 0 && timeStamps.length > 10; |
| 231 }); | 232 }); |
| 232 }) | 233 }) |
| 233 .then(function() { | 234 .then(function() { |
| 234 assertTrue(emptyBlobs == 0, 'Recording has ' + emptyBlobs + | 235 assertTrue(emptyBlobs == 0, 'Recording has ' + emptyBlobs + |
| 235 ' empty blobs, there should be no such empty blobs.'); | 236 ' empty blobs, there should be no such empty blobs.'); |
| 236 }) | 237 }) |
| 237 .catch(function(err) { | 238 .catch(function(err) { return failTest(err.toString()); }) |
| 238 return failTest(err.toString()); | 239 .then(function() { reportTestSuccess(); }); |
| 239 }) | |
| 240 .then(function() { | |
| 241 reportTestSuccess(); | |
| 242 }); | |
| 243 } | 240 } |
| 244 | 241 |
| 245 | 242 |
| 246 // Tests that when a MediaRecorder's resume() is called, the |state| is | 243 // Tests that when a MediaRecorder's resume() is called, the |state| is |
| 247 // 'recording' and a 'resume' event is fired. | 244 // 'recording' and a 'resume' event is fired. |
| 248 function testResumeAndRecorderState() { | 245 function testResumeAndRecorderState() { |
| 249 var theRecorder; | 246 var theRecorder; |
| 250 var resumeEventReceived = false; | 247 var resumeEventReceived = false; |
| 251 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 248 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) |
| 252 .then(function(stream) { | 249 .then(function(stream) { |
| (...skipping 30 matching lines...) Expand all Loading... |
| 283 .then(function(stream) { | 280 .then(function(stream) { |
| 284 return createMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); | 281 return createMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); |
| 285 }) | 282 }) |
| 286 .then(function(recorder) { | 283 .then(function(recorder) { |
| 287 assertThrows(function() {recorder.resume()}, 'Calling resume() in' + | 284 assertThrows(function() {recorder.resume()}, 'Calling resume() in' + |
| 288 ' inactive state should cause a DOM error'); | 285 ' inactive state should cause a DOM error'); |
| 289 }); | 286 }); |
| 290 } | 287 } |
| 291 | 288 |
| 292 // Tests that MediaRecorder sends data blobs when resume() is called. | 289 // Tests that MediaRecorder sends data blobs when resume() is called. |
| 293 function testResumeAndDataAvailable() { | 290 function testResumeAndDataAvailable(codec) { |
| 294 var videoSize = 0; | 291 var videoSize = 0; |
| 295 var emptyBlobs = 0; | 292 var emptyBlobs = 0; |
| 293 const mimeType = codec ? "video/webm;codecs=" + String(codec) : ""; |
| 296 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) | 294 navigator.mediaDevices.getUserMedia(DEFAULT_CONSTRAINTS) |
| 297 .then(function(stream) { | 295 .then(function(stream) { |
| 298 return createAndStartMediaRecorder(stream, DEFAULT_RECORDER_MIME_TYPE); | 296 return createAndStartMediaRecorder(stream, mimeType); |
| 299 }) | 297 }) |
| 300 .then(function(recorder) { | 298 .then(function(recorder) { |
| 301 recorder.pause(); | 299 recorder.pause(); |
| 302 recorder.ondataavailable = function(event) { | 300 recorder.ondataavailable = function(event) { |
| 303 if (event.data.size > 0) { | 301 if (event.data.size > 0) { |
| 304 videoSize += event.data.size; | 302 videoSize += event.data.size; |
| 305 } else { | 303 } else { |
| 306 console.log('This dataavailable event is empty', event); | 304 console.log('This dataavailable event is empty', event); |
| 307 emptyBlobs += 1; | 305 emptyBlobs += 1; |
| 308 } | 306 } |
| (...skipping 284 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 593 return failTest(err.toString()); | 591 return failTest(err.toString()); |
| 594 }) | 592 }) |
| 595 .then(function() { | 593 .then(function() { |
| 596 reportTestSuccess(); | 594 reportTestSuccess(); |
| 597 }); | 595 }); |
| 598 } | 596 } |
| 599 | 597 |
| 600 </script> | 598 </script> |
| 601 </body> | 599 </body> |
| 602 </html> | 600 </html> |
| OLD | NEW |