Confirm dialog not working on Firefox Quantum

oneno — Sat, 08 Jan 2022 09:52:09 +0000

Want to implement a comfirm dialog that appears before user changes tabs or closes the browser window.

The code below (ch5.8 of book React Quickly) worked to display a confirmation dialog on old browsers but not on Firefox Quantum browser - can someone help:

index.html:

<!DOCTYPE html>
<html>

  <head>
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
    <script src="js/react.js"></script>
    <script src="js/react-dom.js"></script>
  </head>

  <body>
    <div>
      <div id="content"></div>
      <script src="js/note.js"></script>
      <script src="js/script.js"></script>
    </div>
  </body>

</html>

script.jsx:

let secondsLeft = 5
let seconds = secondsLeft.valueOf()

let interval = setInterval(()=>{
  if (secondsLeft == 0) {
    ReactDOM.render(
      <div>
        Note (object) was removed after {seconds} seconds.
      </div>,
      document.getElementById('content')
    )
    clearInterval(interval)
  } else {
    ReactDOM.render(
      <div>
        <Note secondsLeft={secondsLeft}/>
      </div>,
      document.getElementById('content')
    )
  }
  secondsLeft--
}, 1000)

note.jsx:

class Note extends React.Component {
  confirmLeave(e) {
    let confirmationMessage = 'Do you really want to close?'
    e.returnValue = confirmationMessage     // Gecko, Trident, Chrome 34+
    return confirmationMessage              // Gecko, WebKit, Chrome <34
  }
  componentDidMount() {
    console.log('Attaching confirmLeave event listener for beforeunload')
    window.addEventListener('beforeunload', this.confirmLeave)
  }
  componentWillUnmount() {
    console.log('Removing confirmLeave event listener for beforeunload')
    window.removeEventListener('beforeunload', this.confirmLeave)
  }
  render() {
    console.log('Render')
    return <div>Here will be our input field for notes 
      (parent will remove in {this.props.secondsLeft} seconds)</div>
  }
}

DEV Community: oneno

Confirm dialog not working on Firefox Quantum