| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <script> | 2 <script> |
| 3 if (window.internals) { | 3 if (window.internals) { |
| 4 window.internals.settings.setViewportEnabled(true); | 4 window.internals.settings.setViewportEnabled(true); |
| 5 window.internals.settings.setViewportMetaEnabled(true); | 5 window.internals.settings.setViewportMetaEnabled(true); |
| 6 } | 6 } |
| 7 </script> | 7 </script> |
| 8 <meta name="viewport" content="width=400"> | 8 <meta name="viewport" content="width=160"> |
| 9 <script src="../../../resources/testharness.js"></script> | 9 <script src="../../../resources/testharness.js"></script> |
| 10 <script src="../../../resources/testharnessreport.js"></script> | 10 <script src="../../../resources/testharnessreport.js"></script> |
| 11 <script src="resources/currentSrcHelper.js"></script> | 11 <script src="resources/currentSrcHelper.js"></script> |
| 12 <script> | 12 <script> |
| 13 addEventListener("load", function() { | 13 addEventListener("load", function() { |
| 14 test(function() { | 14 test(function() { |
| 15 assert_equals(document.getElementById("simple").currentSrc.indexOf("
file://"), 0); | 15 assert_equals(document.getElementById("simple").currentSrc.indexOf("
file://"), 0); |
| 16 assert_equals(document.getElementById("simple").clientWidth, 800); | 16 assert_equals(document.getElementById("simple").clientWidth, 160); |
| 17 assert_equals(currentSrcFileNameNoParams("simple"), "image-set-2x.pn
g"); | 17 assert_equals(currentSrcFileNameNoParams("simple"), "image-set-1x.pn
g"); |
| 18 assert_equals(document.getElementById("small_sizes").clientWidth, 30
0); | 18 if (window.internals) { |
| 19 assert_equals(currentSrcFileNameNoParams("small_sizes"), "image-set-
1x.png"); | 19 assert_true(internals.isLoadingFromMemoryCache("../../hidpi/reso
urces/image-set-1x.png?3453459")); |
| 20 assert_equals(document.getElementById("sizes_x_descriptors").clientW
idth, 400); | 20 assert_false(internals.isLoadingFromMemoryCache("../../hidpi/res
ources/image-set-2x.png?3453459")); |
| 21 assert_equals(currentSrcFileNameNoParams("sizes_x_descriptors"), "im
age-set-1x.png"); | 21 } |
| 22 assert_equals(document.getElementById("sizes_src").clientWidth, 400)
; | |
| 23 assert_equals(currentSrcFileNameNoParams("sizes_src"), "image-set-1x
.png"); | |
| 24 assert_equals(document.getElementById("default_sizes").clientWidth,
400); | |
| 25 assert_equals(currentSrcFileNameNoParams("default_sizes"), "image-se
t-2x.png"); | |
| 26 assert_equals(document.getElementById("invalid_length").clientWidth,
400); | |
| 27 assert_equals(currentSrcFileNameNoParams("invalid_length"), "image-s
et-2x.png"); | |
| 28 assert_approx_equals(document.getElementById("src_and_w").clientWidt
h, 700, 1/64); | |
| 29 assert_equals(currentSrcFileNameNoParams("src_and_w"), "image-set-4x
.png"); | |
| 30 assert_approx_equals(document.getElementById("src_and_w2").clientWid
th, 700, 1/64); | |
| 31 assert_equals(currentSrcFileNameNoParams("src_and_w2"), "image-set-1
x.png"); | |
| 32 assert_approx_equals(document.getElementById("x_and_w").clientWidth,
700, 1/64); | |
| 33 assert_equals(currentSrcFileNameNoParams("x_and_w"), "image-set-4x.p
ng"); | |
| 34 assert_equals(document.getElementById("x_and_w2").clientWidth, 400); | |
| 35 assert_equals(currentSrcFileNameNoParams("x_and_w2"), "image-set-2x.
png"); | |
| 36 assert_equals(document.getElementById("x_and_w3").clientWidth, 400); | |
| 37 assert_equals(currentSrcFileNameNoParams("x_and_w3"), "image-set-2x.
png"); | |
| 38 assert_equals(document.getElementById("half_size").clientWidth, 200)
; | |
| 39 assert_equals(currentSrcFileNameNoParams("half_size"), "image-set-2x
.png"); | |
| 40 assert_equals(document.getElementById("infitisimal_sizes").clientWid
th, 4); | |
| 41 assert_equals(currentSrcFileNameNoParams("infitisimal_sizes"), "imag
e-set-2x.png"); | |
| 42 assert_equals(currentSrcFileNameNoParams("fraction"), "data:,a"); | |
| 43 assert_equals(document.getElementById("seen_lowest_before").clientWi
dth, 1600); | |
| 44 assert_equals(currentSrcFileNameNoParams("seen_lowest_before"), "ima
ge-set-4x.png"); | |
| 45 assert_equals(document.getElementById("seen_highest_before").clientW
idth, 800); | |
| 46 assert_equals(currentSrcFileNameNoParams("seen_highest_before"), "im
age-set-4x.png"); | |
| 47 }, "Test srcset and sizes with a meta viewport"); | 22 }, "Test srcset and sizes with a meta viewport"); |
| 48 }, false); | 23 }, false); |
| 49 </script> | 24 </script> |
| 50 <img id="simple" src="" sizes="(max-width: 300px) 400px, 800px" srcset="../../hi
dpi/resources/image-set-1x.png?1 400w, ../../hidpi/resources/image-set-2x.png?1
800w"> | 25 <img id="simple" src="" sizes="(max-width: 300px) 100vw, 800px" srcset="../../hi
dpi/resources/image-set-1x.png?3453459 400w, ../../hidpi/resources/image-set-2x.
png?3453459 800w"> |
| 51 <img id="small_sizes" src="" sizes="300px" srcset="../../hidpi/resources/image-s
et-1x.png?2 400w, ../../hidpi/resources/image-set-2x.png?2 800w"> | |
| 52 <!-- 'sizes' has no impact on 'x' or 'src' resources --> | |
| 53 <img id="sizes_x_descriptors" src="" sizes="50vw" srcset="../../hidpi/resources/
image-set-1x.png?3 1x, ../../hidpi/resources/image-set-2x.png?3 2x"> | |
| 54 <img id="sizes_src" src="../../hidpi/resources/image-set-1x.png?4" sizes="50vw"> | |
| 55 <!-- Missing sizes or an invalid one, give a source size of 100vw --> | |
| 56 <img id="default_sizes" src="" srcset="../../hidpi/resources/image-set-1x.png?5
400w, ../../hidpi/resources/image-set-2x.png?5 800w, resources/image-set-4x.png?
5 1600w"> | |
| 57 <img id="invalid_length" src="" sizes="(max-width: 300px) 400w, 800w" srcset="..
/../hidpi/resources/image-set-1x.png?6 400w, ../../hidpi/resources/image-set-2x.
png?6 800w"> | |
| 58 <!-- Make sure that the img src is not picked when 'w' is present --> | |
| 59 <img id="src_and_w" src="../../hidpi/resources/image-set-1x.png?7" sizes="700px"
srcset="resources/image-set-4x.png?7 1600w"> | |
| 60 <img id="src_and_w2" src="../../hidpi/resources/image-set-2x.png?8" sizes="700px
" srcset="../../hidpi/resources/image-set-1x.png?8 400w"> | |
| 61 <img id="x_and_w" sizes="700px" srcset="../../hidpi/resources/image-set-1x.png?9
0.4x, resources/image-set-4x.png?9 1600w"> | |
| 62 <!-- The 'x' resource should be picked, and 'sizes' have no impact on its intris
ic size --> | |
| 63 <img id="x_and_w2" sizes="700px" srcset="../../hidpi/resources/image-set-2x.png?
10 2x, resources/image-set-4x.png?10 16000w"> | |
| 64 <img id="x_and_w3" sizes="700px" srcset="resources/image-set-4x.png?11 16000w, .
./../hidpi/resources/image-set-2x.png?11 2x"> | |
| 65 <!-- The intrinsic size should be identical to the 'sizes' value --> | |
| 66 <img id="half_size" sizes="50vw" srcset="../../hidpi/resources/image-set-2x.png?
12 800w, resources/image-set-4x.png?12 16000w"> | |
| 67 <img id="infitisimal_sizes" sizes="1vw" srcset="../../hidpi/resources/image-set-
2x.png?13 800w, resources/image-set-4x.png?13 16000w"> | |
| 68 <img id="fraction" sizes="0.5px" srcset="data:,a 1w, data:,b 2x"> | |
| 69 <!-- Testing with cached resources. If a higher resolution cached resource is av
ailable, it should be picked --> | |
| 70 <img id="seen_lowest_before" sizes="1600px" srcset="../../hidpi/resources/image-
set-2x.png?1 800w, resources/image-set-4x.png?1 1600w"> | |
| 71 <img id="seen_highest_before" sizes="800px" srcset="../../hidpi/resources/image-
set-2x.png?7 800w, resources/image-set-4x.png?7 1600w"> | |
| OLD | NEW |