element-img-environment-change.sub.html (2429B)
1 <!DOCTYPE html> 2 <!-- 3 [%provenance%] 4 --> 5 <html lang="en"> 6 <meta charset="utf-8"> 7 <title>HTTP headers on image request triggered by change to environment</title> 8 <script src="/resources/testharness.js"></script> 9 <script src="/resources/testharnessreport.js"></script> 10 <script src="/fetch/metadata/resources/helper.sub.js"></script> 11 <body> 12 <script> 13 'use strict'; 14 15 // The response to the request under test must describe a valid image 16 // resource in order for the `load` event to be fired. 17 const params = { 18 body: ` 19 <svg xmlns="http://www.w3.org/2000/svg" width="123" height="123"> 20 <rect fill="lime" width="123" height="123"/> 21 </svg> 22 `, 23 mime: 'image/svg+xml' 24 }; 25 26 function induceRequest(t, url, attributes) { 27 const iframe = document.createElement('iframe'); 28 iframe.style.width = '50px'; 29 document.body.appendChild(iframe); 30 t.add_cleanup(() => iframe.remove()); 31 iframe.contentDocument.open(); 32 iframe.contentDocument.close(); 33 34 const image = iframe.contentDocument.createElement('img'); 35 for (const [ name, value ] of Object.entries(attributes)) { 36 image.setAttribute(name, value); 37 } 38 iframe.contentDocument.body.appendChild(image); 39 40 image.setAttribute('srcset', `${url} 100w, /media/1x1-green.png 1w`); 41 image.setAttribute('sizes', '(max-width: 100px) 1px, (min-width: 150px) 123px'); 42 43 return new Promise((resolve) => { 44 image.onload = image.onerror = resolve; 45 }) 46 .then(() => { 47 48 iframe.style.width = '200px'; 49 50 return new Promise((resolve) => image.onload = resolve); 51 }); 52 } 53 54 {%- for subtest in subtests %} 55 56 promise_test((t) => { 57 const key = '{{uuid()}}'; 58 59 return induceRequest( 60 t, 61 makeRequestURL(key, [% subtest.origins %], params), 62 [%subtest.elementAttrs | default({}) | tojson%] 63 ) 64 .then(() => retrieve(key)) 65 .then((headers) => { 66 {%- if subtest.expected == none %} 67 assert_not_own_property(headers, '[%subtest.headerName%]'); 68 {%- else %} 69 assert_own_property(headers, '[%subtest.headerName%]'); 70 assert_array_equals(headers['[%subtest.headerName%]'], ['[%subtest.expected%]']); 71 {%- endif %} 72 }); 73 }, '[%subtest.headerName%] - [%subtest.description | pad("end", ", ")%][%subtest.elementAttrs | collection("attributes")%]'); 74 75 {%- endfor %} 76 </script> 77 </body> 78 </html>