fullscreen/api/document-exit-fullscreen-nested-in-iframe-manual.html

<!DOCTYPE html>
<title>Document#exitFullscreen() for nested fullscreen inside an iframe</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../trusted-click.js"></script>
<iframe allowfullscreen></iframe>
<script>
window.t = async_test();
t.step(() => {
  const iframe = document.querySelector("iframe");
  iframe.srcdoc = "<div><div></div></div>";
  iframe.onload = t.step_func(() => {
    const doc = iframe.contentDocument;
    const outer = doc.querySelector("div");
    const inner = outer.firstChild;

    // First request fullscreen for the outer element.
    trusted_request(t, outer);
    doc.onfullscreenchange = t.step_func(() => {
      assert_equals(document.fullscreenElement, iframe);
      assert_equals(doc.fullscreenElement, outer);

      // Then request fullscreen for the inner element.
      trusted_request(t, inner);
      doc.onfullscreenchange = t.step_func(() => {
        assert_equals(document.fullscreenElement, iframe);
        assert_equals(doc.fullscreenElement, inner);

        // Now exit fullscreen for the iframe's content document.
        doc.exitFullscreen();
        doc.onfullscreenchange = t.step_func_done(() => {
          assert_equals(document.fullscreenElement, iframe);
          assert_equals(doc.fullscreenElement, outer);
        });
      });
    });
    doc.onfullscreenerror = t.unreached_func("fullscreenerror event");
  });
});
</script>