title: React window unload event doesn't fire
body: <p>I need to use <code>navigator.sendBeacon()</code> on window unload in order to let my server know the client has closed his window. I have searched everywhere and it just doesn't work for me.</p>
  
  <p>For reference, the solution in <a href="https://stackoverflow.com/questions/52448909/onbeforeunload-not-working-inside-react-component">this post</a> didn't work either.</p>
  
  <p>I have an App component that wraps my entire project. I am trying to set the unload event on it's <code>componentDidMount()</code> lifecycle method, and it just won't fire.</p>
  
  <pre><code>componentDidMount() {
    window.addEventListener("beforeunload", this.unload);
  }
  
  componentWillUnmount() {
    window.addEventListener("beforeunload", this.unload);
  }
  
  unload(e) {
    e.preventDefault();
    e.returnValue = 'test';
    navigator.sendBeacon(`http://localhost:8080/window-closed/${this.props.username}`);
    return 'test';
  }
  </code></pre>
  
  <p>I expect the server to get the AJAX call, and the window to prompt the user 'test' before the window is closed. What actually happens is the window just closes as usual.</p>
  
  <p>NOTE: the <code>return 'test'</code> &amp; <code>e.returnValue = ''</code> statements are purely for testing. I'm only interested in the AJAX request.</p>
  
  <p>Any help would be much appreciated.</p>