<!DOCTYPE html>
<html>
<head>
<script src="../resources/js-test-pre.js"></script>
<script src="media-file.js"></script>
</head>
<body onload="start()">
<div id="parentA">
    <div id="childToReplace"></div>
</div>
<div id="parentB">
    <video id="vid"></video>
</div>

<script>
description("Test that a video element does not get paused when moved using replaceChild().");
jsTestIsAsync = true;

var video = document.getElementsByTagName('video')[0];

function paused()
{
    testFailed("Video was paused");
}

video.addEventListener("pause", paused);

function playing()
{
    debug("EVENT(playing)");
    shouldBeFalse("video.paused");
    parentA = document.getElementById("parentA");
    childToReplace = document.getElementById("childToReplace");
    evalAndLog("parentA.replaceChild(video, childToReplace)");
    shouldBeFalse("video.paused");
    setTimeout(function() {
        shouldBeFalse("video.paused");
        finishJSTest();
    }, 0);
}

function canplay()
{
    debug("EVENT(canplay)");
    video.addEventListener("playing", playing);
    evalAndLog("video.play()");
}

function start()
{
    video.addEventListener("canplay", canplay);
    video.src = findMediaFile("video", "content/test");
}
</script>
<script src="../resources/js-test-post.js"></script>
</body>
</html>