Electron prevent main window from closing

Question

I am writing an application in electron where if a user has a unsaved file open I want to prompt the user before saving it. I found this example code online:

window.onbeforeunload = (e) => {
      var answer = confirm('Do you really want to close the application?');
      e.returnValue = answer;  // this will *prevent* the closing no matter what value is passed
      if(answer) { mainWindow.destroy(); }  // this will close the app
    };

This code strangely works if the dialogs Yes, Cancel or X button is pressed within a few seconds of appearing but if you let the dialog rest on screen for a little and then click a button the application will close no matter what is pressed.

This code is located in the my main script file called by index.html

Answer 1

Really strange behavior! I cannot explain why it's happening, but can give you a workaround implemented in main process.

You can use electron's dialog module and create the same confirmation dialog with electron. This one works as expected.

main.js

const { app, BrowserWindow, dialog } = require('electron')
const path = require('path')

app.once('ready', () => {
  let win = new BrowserWindow()
  win.loadURL(path.resolve(__dirname, 'index.html'))
  win.on('close', e => {
    let choice = dialog.showMessageBox(
      win,
      {
        type: 'question',
        buttons: ['Yes', 'No'],
        title: 'Confirm',
        message: 'Do you really want to close the application?'
      }
    )
    if (choice === 1) e.preventDefault()
  })
})