vue.jselectronelectron-vue

How to bring window into foreground in electron-vue


I want to bring the main BrowserWindow into the foreground after a countdown finished. When calling electron.BrowserWindow.getFocusedWindow().show() in App.vue, i am getting the error

Uncaught TypeError: Cannot read property 'getFocusedWindow' of undefined

electron is being imported via const electron = window.require("electron"); in App.vue


Solution

  • In order to avoid doing this part on the renderer process all together, and do it in a cleaner way at the same time, you can try to move calling the getFocusedWindow().show() to the electron side. By doing something like this:

    App.vue

     let ipcRenderer = window.require("electron").ipcRenderer
     ipcRenderer.send("bring-to-foreground");
    

    electron.js

    ipcMain.on("bring-to-foreground", (e) => {
      electron.BrowserWindow.getFocusedWindow().show();
    }
    

    I also think that you should use keep your mainwindow so you don't use getFocusedWindow because according to the docs it might return null if the window is not focused in the first place. Like this:

    let mainWindow;
    const createWindow = () => {
        mainWindow = new BrowserWindow({...})
        //rest of the function goes here
    }
    

    so you can then simply do:

    mainwindow.show()