Skip to content

Commit

Permalink
Bug 1670561 - Use a utils library for creating media streams in Media…
Browse files Browse the repository at this point in the history 
…Recorder wpt. r=jib

Differential Revision: https://phabricator.services.mozilla.com/D94044
  • Loading branch information
@Pehrsons
Pehrsons committed Nov 6, 2020
1 parent cfebcf9 commit 81190fe
Show file tree
Hide file tree
Showing 8 changed files with 140 additions and 161 deletions.
10 changes: 5 additions & 5 deletions testing/web-platform/tests/mediacapture-record/MediaRecorder-destroy-script-execution.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
var testForAllTrackEnded = async_test('MediaRecorder will not fire the stop event when all tracks are ended and the script execution context is going away');

iframeForCallingStop.onload = function(e) {
subFrameStop.window.prepareForTest();
subFrameStop.window.prepareForTest(testForCallingStop);
const recorder = subFrameStop.window.recorder;
recorder.ondataavailable = testForCallingStop.step_func(blobEvent => {
iframeForCallingStop.remove();
Expand All @@ -24,12 +24,12 @@
recorder.onstop = testForCallingStop.unreached_func('Unexpected stop event');
recorder.start();
assert_equals(recorder.state, 'recording', 'MediaRecorder has been started successfully');
subFrameStop.window.drawSomethingOnCanvas();
subFrameStop.window.control.addVideoFrame();
recorder.stop();
};

iframeForAllTrackEnded.onload = function(e) {
subFrameAllTrackEnded.window.prepareForTest();
subFrameAllTrackEnded.window.prepareForTest(testForAllTrackEnded);
const recorder = subFrameAllTrackEnded.window.recorder;
recorder.ondataavailable = testForAllTrackEnded.step_func(blobEvent => {
iframeForAllTrackEnded.remove();
Expand All @@ -38,10 +38,10 @@
recorder.onstop = testForAllTrackEnded.unreached_func('Unexpected stop event');
recorder.start();
assert_equals(recorder.state, 'recording', 'MediaRecorder has been started successfully');
subFrameAllTrackEnded.window.drawSomethingOnCanvas();
subFrameAllTrackEnded.window.control.addVideoFrame();
subFrameAllTrackEnded.window.video.getVideoTracks()[0].stop();
};

</script>
</body>
</html>
</html>
43 changes: 10 additions & 33 deletions testing/web-platform/tests/mediacapture-record/MediaRecorder-error.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,37 +5,14 @@
<link rel="help" href="https://w3c.github.io/mediacapture-record/MediaRecorder.html#mediarecorder">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="utils/sources.js"></script>
</head>
<body>
<canvas id="canvas" width="320" height="320">
</canvas>
<script>
function createAudioStream() {
let ac = new AudioContext();
let osc = ac.createOscillator();
let dest = ac.createMediaStreamDestination();
osc.connect(dest);
return dest.stream;
}

function createVideoStream() {
let canvas = document.getElementById("canvas");
canvas.getContext('2d').lineTo(10, 10);
return canvas.captureStream();
}

function drawSomethingOnCanvas() {
let canvas = document.getElementById("canvas");
// Drawing something on the canvas generates a frame in its captured stream.
let context = canvas.getContext("2d");
context.fillStyle = "red";
context.fillRect(0, 0, 10, 10);
}

async_test(t => {
let video = createVideoStream();
let audio = createAudioStream();
let recorder = new MediaRecorder(video);
const {stream: video, control} = createVideoStream(t);
const {stream: audio} = createAudioStream(t);
const recorder = new MediaRecorder(video);
recorder.onerror = t.step_func(mediaRecorderErrorEvent => {
assert_true(mediaRecorderErrorEvent instanceof MediaRecorderErrorEvent, 'the type of event should be MediaRecorderErrorEvent');
assert_equals(mediaRecorderErrorEvent.error.name, 'InvalidModificationError', 'the type of error should be InvalidModificationError when track has been added or removed');
Expand All @@ -46,15 +23,15 @@
recorder.start();
assert_equals(recorder.state, "recording", "MediaRecorder has been started successfully");
video.addTrack(audio.getAudioTracks()[0]);
drawSomethingOnCanvas();
control.addVideoFrame();
t.step_timeout(() => {
assert_unreached("error event is not fired after 2 seconds");
}, 2000);
}, "MediaRecorder will stop recording when any of track is added and error event will be fired");

async_test(t => {
let video = createVideoStream();
let recorder = new MediaRecorder(video);
const {stream: video, control} = createVideoStream(t);
const recorder = new MediaRecorder(video);
recorder.onerror = t.step_func(mediaRecorderErrorEvent => {
assert_true(mediaRecorderErrorEvent instanceof MediaRecorderErrorEvent, 'the type of event should be MediaRecorderErrorEvent');
assert_equals(mediaRecorderErrorEvent.error.name, 'InvalidModificationError', 'the type of error should be InvalidModificationError when track has been added or removed');
Expand All @@ -65,15 +42,15 @@
recorder.start();
assert_equals(recorder.state, "recording", "MediaRecorder has been started successfully");
video.removeTrack(video.getVideoTracks()[0]);
drawSomethingOnCanvas();
control.addVideoFrame();
t.step_timeout(() => {
assert_unreached("error event is not fired after 2 seconds");
}, 2000);
}, "MediaRecorder will stop recording when any of track is removed and error event will be fired");

test(t => {
let video = createVideoStream();
let recorder = new MediaRecorder(video);
const {stream: video} = createVideoStream(t);
const recorder = new MediaRecorder(video);
recorder.start();
assert_equals(recorder.state, "recording", "MediaRecorder has been started successfully");
assert_throws_dom("InvalidStateError", function() {
Expand Down
24 changes: 5 additions & 19 deletions testing/web-platform/tests/mediacapture-record/MediaRecorder-events-and-exceptions.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,30 +5,16 @@
<link rel="help" href="https://w3c.github.io/mediacapture-record/MediaRecorder.html#mediarecorder">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="utils/sources.js"></script>
</head>
<body>
<canvas id="canvas" width="320" height="320"></canvas>
<script>

// This test exercises the MediaRecorder API event sequence:
// onStart -> onPause -> onResume -> onDataAvailable -> onStop
// verifying the |state| and a few exceptions that are supposed to be thrown
// when doing the wrong thing.

function createVideoStream() {
let canvas = document.getElementById("canvas");
canvas.getContext('2d').lineTo(10, 10);
return canvas.captureStream();
}

function drawSomethingOnCanvas() {
let canvas = document.getElementById("canvas");
// Drawing something on the canvas generates a frame in its captured stream.
let context = canvas.getContext("2d");
context.fillStyle = "red";
context.fillRect(0, 0, 10, 10);
}

async_test(test => {

recorderOnUnexpectedEvent = test.step_func(() => {
Expand Down Expand Up @@ -75,18 +61,18 @@
recorder.pause();
});

let stream = createVideoStream();
const {stream, control} = createVideoStream(test);
assert_equals(stream.getAudioTracks().length, 0);
assert_equals(stream.getVideoTracks().length, 1);
assert_equals(stream.getVideoTracks()[0].readyState, 'live');

assert_throws_dom("NotSupportedError",
function() {
recorder = new MediaRecorder(
new MediaRecorder(
new MediaStream(), {mimeType : "video/invalid"});
},
"recorder should throw() with unsupported mimeType");
let recorder = new MediaRecorder(new MediaStream());
const recorder = new MediaRecorder(new MediaStream());
assert_equals(recorder.state, "inactive");

recorder.stop();
Expand All @@ -106,7 +92,7 @@

recorder.stream.addTrack(stream.getTracks()[0]);

drawSomethingOnCanvas();
control.addVideoFrame();

recorder.onstop = recorderOnUnexpectedEvent;
recorder.onpause = recorderOnUnexpectedEvent;
Expand Down
68 changes: 16 additions & 52 deletions testing/web-platform/tests/mediacapture-record/MediaRecorder-mimetype.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,60 +5,24 @@
<link rel="help" href="https://w3c.github.io/mediacapture-record/MediaRecorder.html#dom-mediarecorder-mimeType">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="utils/sources.js"></script>
</head>
<body>
<canvas id="canvas" width="200" height="200">
</canvas>
<script>
function createAudioStream(t) {
const ac = new AudioContext();
const dest = ac.createMediaStreamDestination();
const osc = ac.createOscillator();
osc.connect(dest);
osc.start();
const [track] = dest.stream.getTracks();
t.add_cleanup(() => track.stop());
return dest.stream;
}

function createVideoStream(t) {
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext('2d');
const stream = canvas.captureStream();
const [track] = stream.getTracks();
t.add_cleanup(() => track.stop());
ctx.fillStyle = 'green';
requestAnimationFrame(function draw() {
ctx.fillRect(0, 0, canvas.width, canvas.height);
if (track.readyState == "live") {
requestAnimationFrame(draw);
}
});
return stream;
}

function createAudioVideoStream(t) {
return new MediaStream([
...createAudioStream(t).getTracks(),
...createVideoStream(t).getTracks(),
]);
}

test(t => {
const recorder = new MediaRecorder(createAudioStream(t));
const recorder = new MediaRecorder(createAudioStream(t).stream);
assert_equals(recorder.mimeType, "",
"MediaRecorder has no default mimeType");
}, "MediaRecorder sets no default mimeType in the constructor for audio");

test(t => {
const recorder = new MediaRecorder(createVideoStream(t));
const recorder = new MediaRecorder(createVideoStream(t).stream);
assert_equals(recorder.mimeType, "",
"MediaRecorder has no default mimeType");
}, "MediaRecorder sets no default mimeType in the constructor for video");

test(t => {
const stream = createAudioVideoStream(t);
const recorder = new MediaRecorder(stream);
const recorder = new MediaRecorder(createAudioVideoStream(t).stream);
assert_equals(recorder.mimeType, "",
"MediaRecorder has no default mimeType");
}, "MediaRecorder sets no default mimeType in the constructor for audio/video");
Expand Down Expand Up @@ -115,46 +79,46 @@
}

promise_test(async t => {
const recorder = new MediaRecorder(createAudioStream(t));
const recorder = new MediaRecorder(createFlowingAudioStream(t).stream);
recorder.start();
await new Promise(r => recorder.onstart = r);
assert_not_equals(recorder.mimeType, "");
}, "MediaRecorder sets a nonempty mimeType on 'onstart' for audio");

promise_test(async t => {
const recorder = new MediaRecorder(createVideoStream(t));
const recorder = new MediaRecorder(createFlowingVideoStream(t).stream);
recorder.start();
await new Promise(r => recorder.onstart = r);
assert_not_equals(recorder.mimeType, "");
}, "MediaRecorder sets a nonempty mimeType on 'onstart' for video");

promise_test(async t => {
const recorder = new MediaRecorder(createAudioVideoStream(t));
const recorder = new MediaRecorder(createFlowingAudioVideoStream(t).stream);
recorder.start();
await new Promise(r => recorder.onstart = r);
assert_not_equals(recorder.mimeType, "");
}, "MediaRecorder sets a nonempty mimeType on 'onstart' for audio/video");

promise_test(async t => {
const recorder = new MediaRecorder(createAudioStream(t));
const recorder = new MediaRecorder(createFlowingAudioStream(t).stream);
recorder.start();
assert_equals(recorder.mimeType, "");
}, "MediaRecorder mimeType is not set before 'onstart' for audio");

promise_test(async t => {
const recorder = new MediaRecorder(createVideoStream(t));
const recorder = new MediaRecorder(createFlowingVideoStream(t).stream);
recorder.start();
assert_equals(recorder.mimeType, "");
}, "MediaRecorder mimeType is not set before 'onstart' for video");

promise_test(async t => {
const recorder = new MediaRecorder(createAudioVideoStream(t));
const recorder = new MediaRecorder(createFlowingAudioVideoStream(t).stream);
recorder.start();
assert_equals(recorder.mimeType, "");
}, "MediaRecorder mimeType is not set before 'onstart' for audio/video");

promise_test(async t => {
const recorder = new MediaRecorder(createAudioStream(t));
const recorder = new MediaRecorder(createFlowingAudioStream(t).stream);
const onstartPromise = new Promise(resolve => {
recorder.onstart = () => {
recorder.onstart = () => t.step_func(() => {
Expand All @@ -169,7 +133,7 @@
}, "MediaRecorder doesn't fire 'onstart' multiple times for audio");

promise_test(async t => {
const recorder = new MediaRecorder(createVideoStream(t));
const recorder = new MediaRecorder(createFlowingVideoStream(t).stream);
const onstartPromise = new Promise(resolve => {
recorder.onstart = () => {
recorder.onstart = () => t.step_func(() => {
Expand All @@ -184,7 +148,7 @@
}, "MediaRecorder doesn't fire 'onstart' multiple times for video");

promise_test(async t => {
const recorder = new MediaRecorder(createAudioVideoStream(t));
const recorder = new MediaRecorder(createFlowingAudioVideoStream(t).stream);
const onstartPromise = new Promise(resolve => {
recorder.onstart = () => {
recorder.onstart = () => t.step_func(() => {
Expand All @@ -199,7 +163,7 @@
}, "MediaRecorder doesn't fire 'onstart' multiple times for audio/video");

promise_test(async t => {
const recorder = new MediaRecorder(createAudioStream(t));
const recorder = new MediaRecorder(createFlowingAudioStream(t).stream);
recorder.start();
await new Promise(r => recorder.onstart = r);
assert_regexp_match(recorder.mimeType, /^audio\//,
Expand All @@ -212,7 +176,7 @@
}, "MediaRecorder formats mimeType well after 'start' for audio");

promise_test(async t => {
const recorder = new MediaRecorder(createVideoStream(t));
const recorder = new MediaRecorder(createFlowingVideoStream(t).stream);
recorder.start();
await new Promise(r => recorder.onstart = r);
assert_regexp_match(recorder.mimeType, /^video\//,
Expand All @@ -225,7 +189,7 @@
}, "MediaRecorder formats mimeType well after 'start' for video");

promise_test(async t => {
const recorder = new MediaRecorder(createAudioVideoStream(t));
const recorder = new MediaRecorder(createFlowingAudioVideoStream(t).stream);
recorder.start();
await new Promise(r => recorder.onstart = r);
assert_regexp_match(recorder.mimeType, /^video\//,
Expand Down
20 changes: 6 additions & 14 deletions testing/web-platform/tests/mediacapture-record/MediaRecorder-pause-resume.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,19 +5,10 @@
<link rel="help" href="https://w3c.github.io/mediacapture-record/MediaRecorder.html#mediarecorder">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="utils/sources.js"></script>
</head>
<body>
<canvas id="canvas" width="200" height="200">
</canvas>
<script>
function createVideoStream() {
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext('2d');
ctx.fillStyle = 'green';
ctx.fillRect(0, 0, canvas.width, canvas.height);
return canvas.captureStream();
}

function recordEvents(target, events) {
let arr = [];
for (let ev of events) {
Expand All @@ -26,10 +17,11 @@
return arr;
}

promise_test(async () => {
let video = createVideoStream();
let recorder = new MediaRecorder(video);
let events = recordEvents(recorder,
promise_test(async t => {
const {stream: video, control} = createVideoStream(t);
control.addVideoFrame();
const recorder = new MediaRecorder(video);
const events = recordEvents(recorder,
["start", "stop", "dataavailable", "pause", "resume", "error"]);

recorder.start();
Expand Down
Loading

0 comments on commit 81190fe

Please sign in to comment.