third_party/WebKit/LayoutTests/http/tests/loading/preload-picture-invalid.html

   1 <html>
   2 <head>
   3 <script src="/js-test-resources/js-test.js"></script>
   4 <script src="http://127.0.0.1:8000/resources/slow-script.pl?delay=100"></script>
   5 <script src="resources/picture-preload-helper.js"></script>
   6 </head>
   7 <body>
   8 <script>
   9     if (window.testRunner)
  10         testRunner.dumpAsText();
  11     shouldBeTrue("internals.isPreloaded('resources/preload-test.jpg?0');");
  12     shouldBeTrue("internals.isPreloaded('resources/image2.png');");
  13     loadFromImg(1);
  14     loadFromImg(2);
  15     loadFromSource(3);
  16     loadFromSource(4);
  17     loadFromSource(5);
  18     loadFromImg(6);
  19     loadFromImg(7);
  20 </script>
  21 <!-- Control group -->
  22 <img src="resources/preload-test.jpg?0">
  23 <picture>
  24 <source srcset="resources/image2.png">
  25 <img></picture>
  26 <!-- Invalid nesting tests -->
  27 <!-- In the following tests, nesting messes up the selection algorithm -->
  28 <picture>
  29     <picture>
  30         <source sizes="400px" srcset="resources/base-image1.png?1 200w, resources/base-image3.png?1 400w, resources/base-image2.png?1 800w">
  31         <div>
  32             </picture>
  33         </div>
  34         <img src="resources/preload-test.jpg?1">
  35     </picture>
  36 </picture>
  37 <picture>
  38     <div>
  39         </picture>
  40         </picture>
  41         </picture>
  42     </div>
  43     <source sizes="400px" srcset="resources/base-image1.png?2 200w, resources/base-image3.png?2 400w, resources/base-image2.png?2 800w">
  44     <img src="resources/preload-test.jpg?2">
  45 </picture>
  46 <!-- Here we preload the correct resource, since document.write is not modifying the DOM -->
  47 <picture>
  48     <script>document.write("bla");</script>
  49     <source sizes="400px" srcset="resources/base-image1.png?3 200w, resources/base-image3.png?3 400w, resources/base-image2.png?3 800w">
  50     <img src="resources/preload-test.jpg?3">
  51 </picture>
  52 <!-- In the following tests, nesting messes up the selection algorithm, but we don't get it -->
  53 <picture>
  54     <div>
  55         <picture>
  56             <div>
  57                 <source sizes="400px" srcset="resources/base-image1.png?4 200w, resources/base-image3.png?4 400w, resources/base-image2.png?4 800w">
  58             </div>
  59             <img src="resources/preload-test.jpg?4">
  60         </picture>
  61     </div>
  62 </picture>
  63 <picture>
  64     <div>
  65         <picture>
  66             <div>
  67                 <source sizes="400px" srcset="resources/base-image1.png?5 200w, resources/base-image3.png?5 400w, resources/base-image2.png?5 800w">
  68                 <img src="resources/preload-test.jpg?5">
  69             </div>
  70         </picture>
  71     </div>
  72 </picture>
  73 <!-- We don't keep a checkpoint of the picture stack, so document.write inside picture
  74      *that modifies the DOM* will result in a false prediction -->
  75 <!-- In the following tests, we preload the wrong resource, because document.write is modifying the DOM -->
  76 <script>document.write('<picture>');</script>
  77     <source sizes="400px" srcset="resources/base-image1.png?6 200w, resources/base-image3.png?6 400w, resources/base-image2.png?6 800w">
  78     <img src="resources/preload-test.jpg?6">
  79 </picture>
  80 <picture>
  81     <script>document.write('<source sizes="400px" srcset="resources/base-image1.png?7 200w, resources/base-image3.png?7 400w, resources/base-image2.png?7 800w">');</script>
  82     <img src="resources/preload-test.jpg?7">
  83 </picture>
  84 </body>
  85 </html>