Electron tray disappearing even i putting the declaration of the tray in a global variable

Question

I created a project with electron forge (setup with webpack, react and typescript), and the first thing i did was trying to add a tray in the app. But when the app initializes, after about 3 seconds, the tray disappears. I read some threads about this bug and everyone says that put the tray in a global variable is the solution, but with me this did not work and the tray is still disappearing

import { app, BrowserWindow, Menu, Tray } from 'electron';

declare const MAIN_WINDOW_WEBPACK_ENTRY: string;

let icon = null

if (require('electron-squirrel-startup')) { // eslint-disable-line global-require
  app.quit();
}

const createWindow = (): void => {
  // Create the browser window.
  const mainWindow = new BrowserWindow({
    height: 600,
    width: 800,
  });

 
  mainWindow.loadURL(MAIN_WINDOW_WEBPACK_ENTRY);

  
  mainWindow.webContents.openDevTools();
  icon = new Tray('')

  const contextMenu = Menu.buildFromTemplate([
    {
      label: 'teste', click: () => console.log('hello world')
    }
  ])
  icon.setContextMenu(contextMenu)
};


app.on('ready', createWindow);


app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit();
  }
});

app.on('activate', () => {
  // 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 (BrowserWindow.getAllWindows().length === 0) {
    createWindow();
  }
});

Answer 1

the error is in the line

icon = new Tray('')

passing an invalid url does not make an blank icon as i thought, it crashes the app and the tray disappear, so i need to put a valid icon url