JSFiddle - React, Tailwind, and code Playground

by thvinic

HTML

<html>
<head><title>MAIN WINDOW/TAB</title></head>
<body>
  <h1>MAIN WINDOW/TAB</h1>
  <div class='status'><h2>Events:</h2></div>
  <hr/>
  <button class='check-child-window'>Check child window status</button>
</body>
</html>

JavaScript

var win =   window.open("https://www.w3schools.com", "nome", "width='320', height='230', scrollbars='no', location=no, directories=no, status=no, menubar=no, toolbar=no, resizable=no");
win.document.write(`<html><a href="http://www.google.com" target="_self">Click Here</a>
</html>`);
win.addEventListener('load',() => {
		document.querySelector('.status').innerHTML += '<p>Child was loaded!</p>';
});
win.addEventListener('unload',() => {
		document.querySelector('.status').innerHTML += '<p>Child was unloaded!</p>';
    setTimeout(()=>{
    	document.querySelector('.status').innerHTML +=  getChildWindowStatus();
    },1000);
});
win.document.close()
document.querySelector('.check-child-window').onclick = ()=> {
	alert(getChildWindowStatus());
}
function getChildWindowStatus() {
  if (win.closed) { 
      return 'Child window has been closed!';
  } else {
      return 'Child window has not been closed!';
  }
}