Remove 'context menu' items (not CSS)

[vingeek-dev]

How can we remove items from the context menu? Is there a native mode supported by Monaco?

monaco-editor version: 0.17.1 (latest)
Browser: Google Chrome 76
OS: Windows 10

[toolgood]

function removeMenu(menuId){
	for (var key in menus) {
		if (menus[key]==undefined) { continue; }
		var menu = menus[key];
		for (let index = 0; index < menu.length; index++) {
			var m = menu[index];
			if(m.command.id==menuId){
				menu.splice(index,1);
				return;
			}
		}
	}
}

[toolgood]

	window.menus= require('vs/platform/actions/common/actions').MenuRegistry._menuItems;

[KevinWuWon]

+1. The context menu has items like "Go to definition", "Peek definition", etc., which don't work. I'd like to remove them.

[KyleMit]

You can remove menu items from the context menu like this:

import * as actions from "monaco-editor/esm/vs/platform/actions/common/actions";

let menus = actions.MenuRegistry._menuItems;
let contextMenuEntry = [...menus].find(entry => entry[0]._debugName == "EditorContext");
let contextMenuLinks = contextMenuEntry[1];

let removableIds = ["editor.action.goToTypeDefinition"];

let removeById = (list, ids) => {
  let node = list._first;
  do {
    let shouldRemove = ids.includes(node.element?.command?.id);
    if (shouldRemove) { list._remove(node)  }
  } while ((node = node.next));
};

removeById(contextMenuLinks, removableIds);

Further Reading

• Check out my answer on how to disable Cut and Copy in context menu in Monaco editor for full write up
• Dupe of How can I customize context menu? I want to delete 'Go to definition' #1280

[codebykat]

@KyleMit You just saved me so many hours of aggravation, thank you for that walkthrough ❤️

[qsc-jhndnn]

Did something change in later versions that would have affected the solution by @KyleMit? I'm using 0.27.0 and actions.MenuRegistry._menuItems; is returning a map with 0 entries in it.

[Obapelumi]

Having the same issue too

[SwatDoge]

Same issue persists

[SwatDoge]

This is the current fix for this issue: https://stackoverflow.com/a/73858820/11121992

A hack for sure

[jseparovic]

This worked for me to remove everything (Peek submenu too)

import * as actions from "monaco-editor/esm/vs/platform/actions/common/actions";
let menus = actions.MenuRegistry._menuItems
let contextMenuEntry = [...menus].find(entry => entry[0]._debugName == "EditorContext")
let contextMenuLinks = contextMenuEntry[1]
let removableIds = [
    "editor.action.clipboardCutAction",
    "editor.action.clipboardCopyAction",
    "editor.action.clipboardPasteAction",
    "editor.action.refactor",
    "editor.action.sourceAction",
    "editor.action.revealDefinition",
    "editor.action.revealDeclaration",
    "editor.action.goToTypeDefinition",
    "editor.action.goToImplementation",
    "editor.action.goToReferences",
    "editor.action.formatDocument",
    "editor.action.formatSelection",
    "editor.action.changeAll",
    "editor.action.rename",
    "editor.action.quickOutline",
    "editor.action.quickCommand",
    "Peek",
]
let removeById = (list: any, ids: any) => {
    let node = list._first
    do {
        let shouldRemove = ids.includes(node.element?.command?.id) || ids.includes(node.element?.title)
        if (shouldRemove) { list._remove(node) }
    } while ((node = node.next))
}
removeById(contextMenuLinks, removableIds)

[SwatDoge]

This worked for me to remove everything (Peek submenu too)

import * as actions from "monaco-editor/esm/vs/platform/actions/common/actions";
let menus = actions.MenuRegistry._menuItems
let contextMenuEntry = [...menus].find(entry => entry[0]._debugName == "EditorContext")
let contextMenuLinks = contextMenuEntry[1]
let removableIds = [
    "editor.action.clipboardCutAction",
    "editor.action.clipboardCopyAction",
    "editor.action.clipboardPasteAction",
    "editor.action.refactor",
    "editor.action.sourceAction",
    "editor.action.revealDefinition",
    "editor.action.revealDeclaration",
    "editor.action.goToTypeDefinition",
    "editor.action.goToImplementation",
    "editor.action.goToReferences",
    "editor.action.formatDocument",
    "editor.action.formatSelection",
    "editor.action.changeAll",
    "editor.action.rename",
    "editor.action.quickOutline",
    "editor.action.quickCommand",
    "Peek",
]
let removeById = (list: any, ids: any) => {
    let node = list._first
    do {
        let shouldRemove = ids.includes(node.element?.command?.id) || ids.includes(node.element?.title)
        if (shouldRemove) { list._remove(node) }
    } while ((node = node.next))
}
removeById(contextMenuLinks, removableIds)

actions.MenuRegistry._menuItems gives an empty map on newer versions like mentioned here: #1567 (comment)

[chriswnewman]

This is the current fix for this issue: https://stackoverflow.com/a/73858820/11121992

A hack for sure

This approach got me most of the way there, I ended up posting my modified solution. https://stackoverflow.com/a/75149195/4325849

[lennybakkalian]

@kylewith solution no longer works in the newer Monaco versions. An updated version would be:

let menus = actions.MenuRegistry._menuItems as Map<any, any>
const contextMenuEntry = Array.from(menus, ([key, value]) => ({key, value})).find(entry => entry.key.id == 'EditorContext')

let removableIds = ["editor.action.clipboardCopyAction", "editor.action.clipboardPasteAction"]
let removeById = (list, ids) => {
  let node = list._first
  do {
    let shouldRemove = ids.includes(node.element?.command?.id)
    if (shouldRemove) {
      list._remove(node)
    }
  } while ((node = node.next))
}
removeById(contextMenuEntry.value, removableIds)

[baiyuxiong]

I got this import error:

[hediet]

Duplicate of #1280