<style>
    div {
        width: 100px;
        height: 100px;
    }
    img {
        max-width: 100%;
        max-height: 100%;
    }
</style>
<body>
    <p>This tests calling decode() for a static image which is also an element in the DOM tree.</p>
    <div></div>
    <script>
        if (window.internals && window.testRunner) {
            internals.clearMemoryCache();
            internals.settings.setWebkitImageReadyEventEnabled(true);
            internals.settings.setLargeImageAsyncDecodingEnabled(true);
            testRunner.waitUntilDone();
        }

        var image = new Image;
        var parent = document.querySelector("div");
        parent.appendChild(image);

        image.onload = (() => {
            if (window.internals && window.testRunner) {
                // Force async image decoding for this image.
                internals.setAsyncDecodingEnabledForTesting(image, true);

                // Force layout and display so the image gets drawn.
                document.body.offsetHeight;
                testRunner.display();

                // testRunner.display() requests an async image decoding. Wait till it finishes.
                image.addEventListener("webkitImageFrameReady", function() {
                    // Execute this code in the next loop run.
                    setTimeout(function() {
                        testRunner.display();
                        // The image frame was decoded for the renderer which is (100x100). This
                        // decode() will request a new decoding with the native size which is (400x400).
                        image.decode().then(() => {
                            parent.style.width = "200px";
                            parent.style.height = "200px";
                            // No extra decoding is required to display the image after changing its size.
                            // The image frame was decoded with the native size which is the maximum size
                            // that an image can be decoded with.
                            testRunner.notifyDone();
                        });
                    }, 0);
                });
            }
        });
        image.src = "resources/green-400x400.png";
    </script>
</body>
