Electron menu not showing

a solution for you

if (process.platform == 'darwin') {
    mainMenuTemplate.unshift({label: ''});
}

this may make some wrong

if (process.platform == 'darwin'){
    mainMenuTemplate.unshift({});
}

I think it's just skipping your menus because they lack submenus, here is a modified version of your example that seems to work on my Mac:

const { app, BrowserWindow, Menu } = require("electron");
const url = require("url");
const path = require("path");

const mainWindowUrl = url.format({
    pathname: path.join(__dirname, "html", "main.html"),
    protocol: "file:",
    slashes: true
});
const menuTemplate = [
    {
        label: "File",
        submenu: [{role: 'TODO'}]
    },
    {
        label: "Menu1",
        submenu: [{role: 'TODO'}]
    },
    {
        label: "Menu2",
        submenu: [{role: 'TODO'}]
    }
];

const onAppReady = () => {
    const mainWindow = new BrowserWindow({});
    mainWindow.loadURL(mainWindowUrl);

    const menu = Menu.buildFromTemplate(menuTemplate);
    Menu.setApplicationMenu(menu);
};

app.on("ready", onAppReady);

I don't know if it's an OSX specific thing but it appears that at least Electron doesn't like menus that directly trigger roles instead they must reveal submenus that can then trigger some action.


I noticed that on OS X the first menu item in your menu Template which is 'File' in your case is found under the default Electron Menu hence you might want to add an empty item in your array

const mainMenuTemplate = [
    {},
    {
        label: 'File',
        submenu: [
            {
                label: 'Add Item'
            },
            {
                label: 'Clear items'
            },
            {
                label: 'Quit',
                click(){
                    app.quit();
                }
            }
        ]
    }
 ];