third_party/WebKit/LayoutTests/fast/hidpi/image-srcset-change-dynamically-src-first-2x.html

   1 <html>
   2 <head>
   3 <script>
   4 </script>
   5 <script src="resources/srcset-helper.js"></script>
   6 <script src="../../resources/js-test.js"></script>
   7 <script>
   8     function updateSrc() {
   9         var img = document.getElementById("foo");
  10         // The below should not trigger the load of the blue image according to the spec.
  11         img.src = "resources/blue-100-px-square.png"
  12         img.srcset = "resources/blue-100-px-square.png 1x, resources/green-400-px-square.png 2x";
  13     }
  14
  15     addEventListener("DOMContentLoaded", function() {
  16         if (window.testRunner && sessionStorage.pageReloaded) {
  17             // Have to make sure to only load the src after the reload.
  18             // Otherwise, we'd request and cache the 1x URL while the
  19             // scale factor is 1, and after we reload we find the URL
  20             // in the cache and reuse it, leading us to dump two requests.
  21             updateSrc();
  22         } else if (!window.testRunner) {
  23             // This else exists purely to allow running the test manually.
  24             updateSrc();
  25         }
  26     }, false);
  27     addEventListener("load", function() {
  28         shouldBeTrue('document.getElementById("foo").clientWidth==200');
  29     }, false);
  30 </script>
  31 </head>
  32
  33 <body id="body">
  34     <div>This test passes if this img tag below is a green square when the scale factor is 2.
  35       It ensures that attributes can be changed dynamically from javascript, and that only the correct resource is loaded.</div>
  36     <img id="foo">
  37 </body>
  38 </html>