Nsryjdtyk

I'm trying to make my electron app auto-updatable, and after searching on google I found nice guide that works. The only problem is that I want to create a button for when update is downloaded so that the user can decide when he wants to update and restart the app. So far I was able to put this code together

renderer.js

const electron = require('electron')

const ipcRenderer = electron.ipcRenderer



let lastMsgId = 0



window.quitAndInstall = function () {

  electron.remote.autoUpdater.quitAndInstall()

}



ipcRenderer.on('console', (event, consoleMsg) => {

  console.log(consoleMsg)

})



ipcRenderer.on('message', (event, data) => {

  showMessage(data.msg, data.hide, data.replaceAll)

})



function showMessage(message, hide = true, replaceAll = false) {

  const messagesContainer = document.querySelector('.messages-container')

  const msgId = lastMsgId++ + 1

  const msgTemplate = `<div id="${msgId}" class="alert alert-info alert-info-message animated fadeIn">${message}</div>`



  if (replaceAll) {

    messagesContainer.innerHTML = msgTemplate

  } else {

    messagesContainer.insertAdjacentHTML('afterbegin', msgTemplate)

  }



  if (hide) {

    setTimeout(() => {

      const msgEl = document.getElementById(msgId)

      msgEl.classList.remove('fadeIn')

      msgEl.classList.add('fadeOut')

    }, 4000)

  }

}

and this is my index.js where messages are storred

const electron = require('electron');

const {autoUpdater} = require('electron-updater');

const log = require('electron-log');

const appVersion = require('./package.json').version



// configure logging

autoUpdater.logger = log;

autoUpdater.logger.transports.file.level = 'info';

log.info('App starting...');



const app = electron.app;

const BrowserWindow = electron.BrowserWindow;



let mainWindow;



function createWindow() {

  mainWindow = new BrowserWindow({

    width: 1020,

    height: 800,

  });

  mainWindow.loadURL('file://' +__dirname + '/public/index.html');



  // Open the DevTools.

  //mainWindow.webContents.openDevTools();



  mainWindow.on('closed', function() {

    mainWindow = null;

  });

}



app.on('ready', createWindow);



// Quit when all windows are closed.

app.on('window-all-closed', function() {

    app.quit();

});



app.on('activate', function() {

  // On OS X it's common to re-create a window in the app when the

  // dock icon is clicked and there are no other windows open.

  if (mainWindow === null) {

    createWindow();

  }

});



//-------------------------------------------------------------------

// Auto updates

//-------------------------------------------------------------------

const sendStatusToWindow = (text) => {

  log.info(text);

  if (mainWindow) {

    mainWindow.webContents.send('console', `App version: ${appVersion}`)

    mainWindow.webContents.send('message', { msg: `App version: ${appVersion}` })

  }

};



autoUpdater.on('error', (ev, err) => {

  mainWindow.webContents.send('message', { msg: `Error: ${err}` })

})



autoUpdater.once('checking-for-update', (ev, err) => {

  mainWindow.webContents.send('message', { msg: 'Checking for updates' })

})



autoUpdater.once('update-available', (ev, err) => {

  mainWindow.webContents.send('message', { msg: 'Update available. Downloading ⌛️', hide: false })

})



autoUpdater.once('update-not-available', (ev, err) => {

  mainWindow.webContents.send('message', { msg: 'Update not available' })

})



autoUpdater.once('update-downloaded', (ev, err) => {

  const msg = 'Update downloaded - <button onclick="quitAndInstall()">Restart</button>'

  mainWindow.webContents.send('message', { msg, hide: false, replaceAll: true })

})



autoUpdater.checkForUpdates()

As you can see I added a button to call for function but it doesnt work. When I press the button nothing happens. If I remove button and just say auto.updater.quitAndInstall() it works. It auto close window and install new version. What am I missing?

I think it's that electron.remote.autoUpdater.quitAndInstall() doesn't work when run in the renderer.

In the docs it doesn't say anything against running it in the renderer process but I think sending a message back to the main process to run the quitAndInstall function would work.

Inside of the quitAndInstall function put this instead:

ipcRenderer.send('asynchronous-message', 'quitAndInstall');

Then in the main process put:

electron.ipcMain.on('asynchronous-message', function (evt, message) {

    if (message == 'quitAndInstall') {

        autoUpdater.quitAndInstall();

    }

});