<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Testing muting video</title>
        <script src="../resources/testharness.js"></script>
        <script src="../resources/testharnessreport.js"></script>
    </head>
    <body>
        <div>Video should be running, go to black and running.</div>
        <div>Following, should be a snapshot of the video, a black frame and a snapshot of the video.</div>
        <video id="video1" autoplay playsInline width="320" height="240"></video>
        <video id="video2" autoplay playsInline width="320" height="240"></video>
        <canvas id="canvas1" width="320" height="240"></canvas>
        <canvas id="canvas2" width="320" height="240"></canvas>
        <canvas id="canvas3" width="320" height="240"></canvas>
        <script src ="routines.js"></script>
        <script>
var track;
var remoteTrack;
var receivingConnection;
promise_test((test) => {
    return navigator.mediaDevices.getUserMedia({video: {width: 320, height: 240 }}).then((localStream) => {
        return new Promise((resolve, reject) => {
            track = localStream.getVideoTracks()[0];

            createConnections((firstConnection) => {
                firstConnection.addTrack(track, localStream);
                firstConnection.getTransceivers()[0].setCodecPreferences([{mimeType: "video/VP8", clockRate: 90000}]);
            }, (secondConnection) => {
                receivingConnection = secondConnection;
                secondConnection.ontrack = (trackEvent) => {
                    remoteTrack = trackEvent.track;
                    resolve(trackEvent.streams[0]);
                };
            });
            setTimeout(() => reject("Test timed out"), 5000);
        });
    }).then((remoteStream) => {
        video1.srcObject = remoteStream;
        return video1.play();
    });
}, "Setting video exchange with VP8");

promise_test(async () => {
    video2.srcObject = await new Promise((resolve, reject) => {
        createConnections((firstConnection) => {
            firstConnection.addTrack(video1.srcObject.getVideoTracks()[0], video1.srcObject);
        }, (secondConnection) => {
            receivingConnection = secondConnection;
            secondConnection.ontrack = (trackEvent) => {
                remoteTrack = trackEvent.track;
                resolve(trackEvent.streams[0]);
            };
        });
        setTimeout(() => reject("Test timed out"), 5000);
    });
    await video2.play();
}, "Setting exchange with H264 using VP8 decoded stream as input");
        </script>
    </body>
</html>
