image-srcset-change-dynamically-src-first-2x.html

<!DOCTYPE html>
<script src="resources/srcset-helper.js"></script>
<script src="../../resources/js-test.js"></script>
<script>
    function updateSrc() {
        var img = document.getElementById("foo");
        // The below should not trigger the load of the blue image according to the spec.
        img.src = "resources/blue-100-px-square.png"
        img.srcset = "resources/blue-100-px-square.png 1x, resources/green-400-px-square.png 2x";
    }
    addEventListener("DOMContentLoaded", function() {
        if (window.testRunner && sessionStorage.pageReloaded) {
            // Have to make sure to only load the src after the reload.
            // Otherwise, we'd request and cache the 1x URL while the
            // scale factor is 1, and after we reload we find the URL
            // in the cache and reuse it, leading us to dump two requests.
            updateSrc();
        } else if (!window.testRunner) {
            // This else exists purely to allow running the test manually.
            updateSrc();
        }
    }, false);
    addEventListener("load", function() {
        shouldBeTrue('document.getElementById("foo").clientWidth==200');
    }, false);
</script>
<div>This test passes if this img tag below is a green square when the scale factor is 2.
    It ensures that attributes can be changed dynamically from javascript, and that only the correct resource is loaded.</div>
<img id="foo">
chromium/third_party/blink/web_tests/fast/hidpi/image-srcset-change-dynamically-src-first-2x.html
