Bug 1272371 - Add mochitest to test looped playback of mediarecorder recordings. r=pehrsons

MozReview-Commit-ID: L9kbgrUYKmt

--HG--
extra : rebase_source : 573fa02f7697d88ad6a0bd0635abef1bffbb88d8
This commit is contained in:
Bryce Van Dyk 2017-05-25 13:37:05 +12:00
parent b129f08d7f
commit 7f7533c13f
2 changed files with 103 additions and 0 deletions

View File

@ -804,6 +804,8 @@ skip-if = android_version == '17' # android(bug 1232305)
tags=msg
[test_mediarecorder_pause_resume_video.html]
skip-if = toolkit == 'android' # android(bug 1232305)
[test_mediarecorder_playback_can_repeat.html]
skip-if = android_version == '17' # android(bug 1232305)
tags=msg
[test_mediarecorder_principals.html]
skip-if = (os == 'linux' && bits == 64) || toolkit == 'android' # See bug 1266345, android(bug 1232305)

View File

@ -0,0 +1,101 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Test MediaRecorder Recording creates videos that can playback more than once</title>
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
<script src="/tests/dom/canvas/test/captureStream_common.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<pre id="test">
<div id="content">
<canvas id="video-src-canvas"></canvas>
<video id="recorded-video" loop></video>
</div>
<script class="testbody" type="text/javascript">
function startTest() {
let canvas = document.getElementById("video-src-canvas");
let canvas_size = 100;
canvas.width = canvas.height = canvas_size;
let helper = new CaptureStreamTestHelper2D(canvas_size, canvas_size);
helper.drawColor(canvas, helper.red);
let stream = canvas.captureStream();
let numVideoPlayingEvents = 0;
let blob;
let mediaRecorder = new MediaRecorder(stream);
is(mediaRecorder.stream, stream,
"Media recorder stream = canvas stream at the beginning of recording");
// Not expected events.
mediaRecorder.onwarning = () => ok(false, "MediaRecorder: onwarning unexpectedly fired");
mediaRecorder.onerror = err => {
ok(false, "MediaRecorder: onerror unexpectedly fired. Code " + err.name);
SimpleTest.finish();
};
// When recorder is stopped get recorded data.
mediaRecorder.ondataavailable = ev => {
info("Got 'dataavailable' event");
is(blob, undefined, "On dataavailable event blob is undefined");
blob = ev.data;
};
mediaRecorder.onstart = () => {
info('onstart fired successfully');
// Feed some more data into the recorder so the output has a non trivial duration.
// This avoids the case where we have only 1 frame in the output, which breaks
// looping (this is expected as a WebM with 1 video frame has no duration).
let counter = 0;
let draw = () => {
counter++;
helper.drawColor(canvas, helper.blue);
if(counter > 2) {
mediaRecorder.stop();
return;
}
requestAnimationFrame(draw);
};
requestAnimationFrame(draw);
};
mediaRecorder.onstop = () => {
info("Got 'stop' event");
ok(blob, "Should have gotten a data blob");
let video = document.getElementById("recorded-video");
video.src = URL.createObjectURL(blob);
video.onerror = err => {
ok(false, "Should be able to play the recording. Got error. code=" + video.error.code);
SimpleTest.finish();
};
video.onplaying = () => {
// We get a playing event when the video starts (including loop induced starts)
info("Got 'onplaying' event");
if(++numVideoPlayingEvents == 2) {
// We've looped the video
video.pause();
SimpleTest.finish();
}
};
video.play();
};
mediaRecorder.start();
}
SimpleTest.waitForExplicitFinish();
startTest();
</script>
</pre>
</body>
</html>