Prompt to save / quit before closing window

Question

• I am making a writing application. Users can open the app, write some text, save their work, etc.
• I am trying to make it so that clicking the window close button will prompt the user to (a) save their work (if necessary) or (b) just quit.
• I am trying to use window.beforeunload to achieve this, but find I am getting stuck in a loop, where trying to "quit" makes the same prompt appear ad infinitum.

Here's some code:

windowCloseCheck() {
window.onbeforeunload = function(e) {
  e.returnValue = false;
// window.alert('try to close me');    
if(file.isUnsaved() || file.hasChanged()) {
  // prompt - save or just quit?
  file.fileWarning('You have unsaveeed work.', 'Save', 'Quit', function(){
    // OPTION A - save
    file.save();
  }, function() {
    // OPTION B: Quit.
    ipcRenderer.send('quitter')
  })
} 

else {
  // file is saved and no new work has been done:
  ipcRenderer.send('quitter')
}

windowCloseCheck is invoked when the application is setup, initiating an event listener for closing the window. My conditional is checking if the file is unsaved or has changed from the original.

fileWarning is a function that just wraps the electron dialog box, making a pop up appear with two choices and respective functions to call for each choice.

The rest of the code is available if I'm (probably) leaving out necessary information. Would be happy to clarify if I'm not being very clear.

Answer 1

Please add following block inside the function where you have defined browser window(In my case it's createWindow() function declared in main.js)

  // Create the browser window.
  mainWindow = new BrowserWindow({width: 400, height: 400})


  mainWindow.on('close', function(e){
    var choice = require('electron').dialog.showMessageBox(this,
        {
          type: 'question',
          buttons: ['Yes', 'No'],
          title: 'Confirm',
          message: 'Are you sure you want to quit?'
       });
       if(choice == 1){
         e.preventDefault();
       }
    });

Answer 2

Answer for Electron 7+

The following is a working solution for latest Electron, based on awijeet's answer and Sergio Mazzoleni's comment.

At the bottom of createWindow(), below your win = new BrowserWindow(...), use:

win.on('close', function(e) {
  const choice = require('electron').dialog.showMessageBoxSync(this,
    {
      type: 'question',
      buttons: ['Yes', 'No'],
      title: 'Confirm',
      message: 'Are you sure you want to quit?'
    });
  if (choice === 1) {
    e.preventDefault();
  }
});

Answer 3

I ended up going with using window.destroy() to smash the render process to bits (from the main process):

ipcMain.on('quitter', (e) => {
  mainWindow.destroy(); // necessary to bypass the repeat-quit-check in the render process.
  app.quit()
})

Not really sure if this is recommended as there seem to be better ways to properly quit an electron app. Still happy to get any feedback if you know a better answer!

/shrug!