Attachment 440054 Details for Bug 231167 – iframe unload notification test case

iframe unload notification test case

test.html (text/html), 1.24 KB, created by Robert Knight on 2021-10-04 05:16:21 PDT

(hide)

Description:

Filename:

MIME Type:

Creator: Robert Knight

Created: 2021-10-04 05:16:21 PDT

Size: 1.24 KB

patch

obsolete

><!DOCTYPE html>
><html>
>  <body>
>    <button class="js-remove-btn">Remove iframe</button>
>
>    <iframe class="js-frame"></iframe>
>
>    <script type="module">
>      const removeBtn = document.querySelector(".js-remove-btn");
>      const frame = document.querySelector(".js-frame");
>
>      removeBtn.onclick = () => frame.remove();
>
>      frame.contentWindow.addEventListener("message", (e) => {
>        const framePort = e.data.port;
>
>        for (let event of ["unload", "pagehide", "visibilitychange"]) {
>          frame.contentWindow.addEventListener(event, () => {
>            console.log(`iframe received "${event}" event`);
>            framePort.postMessage({ trigger: event });
>            window.parent.postMessage({ trigger: event });
>          });
>        }
>      });
>
>      const channel = new MessageChannel();
>      frame.contentWindow.postMessage(
>        {
>          port: channel.port1,
>        },
>        frame.contentWindow.origin,
>        [channel.port1]
>      );
>      channel.port2.onmessage = (e) => {
>        console.log("MessagePort in parent frame received message", e.data);
>      };
>
>      window.addEventListener("message", (e) => {
>        console.log('Parent frame received "message" event', e.data);
>      });
>    </script>
>  </body>
></html>

<!DOCTYPE html>
<html>
  <body>
    <button class="js-remove-btn">Remove iframe</button>

    <iframe class="js-frame"></iframe>

    <script type="module">
      const removeBtn = document.querySelector(".js-remove-btn");
      const frame = document.querySelector(".js-frame");

      removeBtn.onclick = () => frame.remove();

      frame.contentWindow.addEventListener("message", (e) => {
        const framePort = e.data.port;

        for (let event of ["unload", "pagehide", "visibilitychange"]) {
          frame.contentWindow.addEventListener(event, () => {
            console.log(`iframe received "${event}" event`);
            framePort.postMessage({ trigger: event });
            window.parent.postMessage({ trigger: event });
          });
        }
      });

      const channel = new MessageChannel();
      frame.contentWindow.postMessage(
        {
          port: channel.port1,
        },
        frame.contentWindow.origin,
        [channel.port1]
      );
      channel.port2.onmessage = (e) => {
        console.log("MessagePort in parent frame received message", e.data);
      };

      window.addEventListener("message", (e) => {
        console.log('Parent frame received "message" event', e.data);
      });
    </script>
  </body>
</html>

Actions: View

Attachments on bug 231167: 440054 | 440964 | 441083