<dialog>
  <p> How do I close this? </p>
  <button id="closeBtn" type="button">
    Close
  </button>
</dialog>
<script>
  let dialogEl = document.querySelector('dialog');
  let closeBtn = document.getElementById('closeBtn');

  dialogEl.addEventListener('close', (e) => {
    console.log('Dialog was closed', e);
  });
  
  closeBtn.addEventListener('click', () => {
    dialogEl.close();
  });
</script>