<!DOCTYPE HTML>
<html>
<script>
// sends url of current window and onbeforeunloadMessage
// when we enter here test failed.
function beforeunload(){
  window.opener.postMessage({
    info: "before-unload",
    result: window.location.hash,
    button: false,
  }, "*");
}

// sends url of current window and then click on button
window.onload = function (){
  // get button by ID
  let button = window.document.getElementById("clickMeButton");
  // if getting button was successful, buttonExist = true
  let buttonExist = button !== null;
  // send loading message
  window.opener.postMessage({
    info: "onload",
    result: window.location.href,
    button: buttonExist,
  }, "*");
  // click button
  button.click();
}
// after button clicked and paged scrolled sends URL of current window
window.onscroll = function(){
  window.opener.postMessage({
    info: "scrolled-to-foo",
    result: window.location.href,
    button: true,
    documentURI: document.documentURI,
  }, "*");
 }


</script>
<body onbeforeunload="/*just to notify if we load a new page*/ beforeunload()";>
  <a id="clickMeButton" href="http://example.com/tests/dom/security/test/https-only/file_fragment.html#foo">Click me</a>
  <div style="height: 1000px; border: 1px solid black;"> space</div>
  <a name="foo" href="http://example.com/tests/dom/security/test/https-only/file_fragment.html">foo</a>
  <div style="height: 1000px; border: 1px solid black;">space</div>
</body>
</html>
