<!DOCTYPE html>
<html>
<head>
    <script src="../../resources/js-test-pre.js"></script>
</head>
<body>
    <img src="resources/animated-red-green-blue.gif" onload="imageLoaded()">
    <script>
        description("Ensure the image stops animating if it is removed from the document before finishing decoding the current frame.");
        jsTestIsAsync = true;

        internals.clearMemoryCache();

        var image = document.getElementsByTagName("img")[0];
        var loopCount = 0;
        var frameIndex;

        function imageLoaded()
        {
            if (!window.internals)
                return;
            internals.setImageFrameDecodingDuration(image, 0.040);
            imageRemove();
        }

        function imageRemove()
        {
            setTimeout(function() {
                frameIndex = internals.imageFrameIndex(image);
                image.remove();
                setTimeout(function() {
                    shouldBe("internals.imageFrameIndex(image)", "frameIndex");
                    finishJSTest();
                }, 50);
             }, 50);
        }
    </script>
    <script src="../../resources/js-test-post.js"></script>
</body>
</html>