loaf-onmessage.html (1966B)
1 <!DOCTYPE HTML> 2 <meta charset=utf-8> 3 <title>Long Animation Frame Timing: basic</title> 4 <meta name="timeout" content="long"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script src="resources/utils.js"></script> 8 <script src="/common/get-host-info.sub.js"></script> 9 10 <body> 11 <h1>Long Animation Frame: onmessage</h1> 12 <div id="log"></div> 13 <script> 14 15 for (const origin of ["ORIGIN", "REMOTE_ORIGIN", "HTTP_NOTSAMESITE_ORIGIN"]) { 16 test_self_event_listener(async (t, busy_wait) => { 17 const iframe = document.createElement("iframe"); 18 iframe.src = `${get_host_info()[origin]}/long-animation-frame/resources/postMessage.html`; 19 const promise = new Promise(resolve => window.addEventListener("message", e => { 20 if (e.data === "NEXT") { 21 busy_wait(); 22 resolve(); 23 } 24 }, {once: true})); 25 document.body.append(iframe); 26 t.add_cleanup(() => iframe.remove()); 27 await promise; 28 }, "DOMWindow.onmessage", `onmessage from iframe - ${origin}`); 29 30 test_self_event_listener(async (t, busy_wait) => { 31 const iframe = document.createElement("iframe"); 32 iframe.src = `${get_host_info()[origin]}/long-animation-frame/resources/postMessage-from-port.html`; 33 const channel = new MessageChannel(); 34 const promise = new Promise(resolve => channel.port1.addEventListener("message", e => { 35 if (e.data === "NEXT") { 36 busy_wait(); 37 resolve(); 38 } 39 }, {once: true})); 40 channel.port1.start(); 41 iframe.onload = () => { 42 iframe.contentWindow.postMessage("START", {transfer: [channel.port2], targetOrigin: "*"}); 43 } 44 document.body.append(iframe); 45 t.add_cleanup(() => iframe.remove()); 46 await promise; 47 }, "MessagePort.onmessage", `onmessage from channel - ${origin}`); 48 } 49 </script> 50 </body>