Impossible to update the menu

[Makio64]

Problem Description

On recent electron version, changing the menu using the example or other methods didnt work and the menu in the title bar simply disappear.

Steps to Reproduce

	// in the main
	const menu = new Menu()
	menu.append(
		new MenuItem({
			label: 'File',
			submenu: [
				{
					label: 'Import gltf/glb',
					click: () => {
						console.log('Open File')
					},
				},
				{
					type: 'separator',
				},
				{
					label: 'Close',
					click: () => {
						win.close()
					},
				},
			],
		}),
	)
	Menu.setApplicationMenu(menu)

Expected Behavior

The title bar is updated with the new menu

Current Behavior

the menu disappear

Additional Information

• windows 11
• node v20.5.0
• electron 27.0.2 / also didn't work on ^26.0.0

Note: Labels - bug

[AlexTorresDev]

You should use titlebar.refreshMenu(), an asynchronous method that refreshes the menu with what is in Menu.getApplicationMenu(), after updating the menu with the sample code you showed above.

[hello112334]

I update all menu like this:

// main.ts
import { app, BrowserWindow, Menu } from "electron";
import registerListeners from "./helpers/ipc/listeners-register";
import path from "path";

const inDevelopment = process.env.NODE_ENV === "development";

if (require("electron-squirrel-startup")) {
    app.quit();
}

import { setupTitlebar, attachTitlebarToWindow } from "custom-electron-titlebar/main";
import { MenuItem, MenuItemConstructorOptions } from "electron";

// setup the titlebar main process
setupTitlebar();

function createWindow() {
    const preload = path.join(__dirname, "preload.js");
    const mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
            sandbox: false,
            devTools: inDevelopment,
            contextIsolation: true,
            nodeIntegration: true,
            nodeIntegrationInSubFrames: false,
            preload: preload,
        },
        titleBarStyle: "hidden",
        frame: false, // Add this line
    });
    registerListeners(mainWindow);

    if (MAIN_WINDOW_VITE_DEV_SERVER_URL) {
        mainWindow.loadURL(MAIN_WINDOW_VITE_DEV_SERVER_URL);
    } else {
        mainWindow.loadFile(
            path.join(__dirname, `../renderer/${MAIN_WINDOW_VITE_NAME}/index.html`)
        );
    }

    if (inDevelopment) {
        mainWindow.webContents.openDevTools();
    }

    // Create menu template
    // Define the menu template
    const isMac = process.platform === "darwin";
    const template: (MenuItemConstructorOptions | MenuItem)[] = [
        ...(isMac
            ? [
                  {
                      label: app.name,
                      submenu: [
                          { role: "about" as const },
                          { type: "separator" as const },
                          { role: "services" as const },
                          { type: "separator" as const },
                          { role: "hide" as const },
                          { role: "hideOthers" as const },
                          { role: "unhide" as const },
                          { type: "separator" as const },
                          { role: "quit" as const },
                      ],
                  },
              ]
            : []),
        {
            label: "File",
            submenu: [isMac ? { role: "close" as const } : { role: "quit" as const }],
        },
        {
            label: "Edit",
            submenu: [
                { role: "undo" as const },
                { role: "redo" as const },
                { type: "separator" as const },
                { role: "cut" as const },
                { role: "copy" as const },
                { role: "paste" as const },
                ...(isMac
                    ? [
                          { role: "pasteAndMatchStyle" as const },
                          { role: "delete" as const },
                          { role: "selectAll" as const },
                          { type: "separator" as const },
                          {
                              label: "Speech",
                              submenu: [
                                  { role: "startSpeaking" as const },
                                  { role: "stopSpeaking" as const },
                              ],
                          },
                      ]
                    : [
                          { role: "delete" as const },
                          { type: "separator" as const },
                          { role: "selectAll" as const },
                      ]),
            ],
        },
        {
            label: "View",
            submenu: [
                { role: "reload" as const },
                { role: "forceReload" as const },
                { role: "toggleDevTools" as const },
                { type: "separator" as const },
                { role: "resetZoom" as const },
                { role: "zoomIn" as const },
                { role: "zoomOut" as const },
                { type: "separator" as const },
                { role: "togglefullscreen" as const },
            ],
        },
        {
            label: "Window",
            submenu: [
                { role: "minimize" as const },
                { role: "zoom" as const },
                ...(isMac
                    ? [
                          { type: "separator" as const },
                          { role: "front" as const },
                          { type: "separator" as const },
                          { role: "window" as const },
                      ]
                    : [{ role: "close" as const }]),
            ],
        },
        {
            role: "help",
            submenu: [
                {
                    label: "Learn More",
                    click: async () => {
                        const { shell } = require("electron");
                        await shell.openExternal("https://electronjs.org");
                    },
                },
            ],
        },
    ];

    const menu = Menu.buildFromTemplate(template);
    Menu.setApplicationMenu(menu);

    // attach fullScreen(f11 and not 'maximized') && focus listeners
    attachTitlebarToWindow(mainWindow);
}

// app.whenReady().then(createWindow);
app.whenReady().then(createWindow);

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

app.on("activate", () => {
    if (BrowserWindow.getAllWindows().length === 0) {
        createWindow();
    }
});
// osX only ends

refer

https://www.electronjs.org/docs/latest/api/menu#examples