visual-studio-code - Monaco 编辑器：使用本机（系统）上下文菜单

Question

有没有办法让摩纳哥使用系统菜单作为上下文菜单？

我WKWebView在 macOS 上嵌入了 Monaco。上下文（右键单击）菜单在 Web 视图中呈现，而不是作为本机系统菜单。（但 VSCode确实显示了本机上下文菜单。）

我怎样才能使这项工作？

---

这就是我想要的：（我在 VS Code 中看到的）

但我明白了：（我在嵌入式 WKWebView 中得到了什么）

---

编辑2：

通过在包含窗口之外呈现的方式，您可以看到这实际上是一个系统菜单。截图：

Answer 1

所以在深入研究了所有这些之后。这个答案将为您指明如何实现这一目标。如果您ContextMenu在任何浏览器中查看 MonaEditor 渲染的内容，它总是被视口裁剪。

现在这是因为上下文菜单是基于 HTML 的，它受视口限制。

那么为什么 VSCode 能够在 ViewPort 之外显示菜单呢？

这是因为电子具有显示本地菜单的能力。VSCode 禁用 Monaco 自己的菜单并在右键单击时创建本机菜单。你可以在下面看到 npm 模块，它显示了如何

https://github.com/mixmaxhq/electron-editor-context-menu

现在当你使用 WKWebView 时，你不能使用电子特性，所以这意味着你需要在你的 Swift 代码中本地实现一个上下文处理程序。以下是一些 SO 线程，它们将为您指明正确的方向

Mac上的WKWebView中的上下文菜单如何修改或覆盖？

使用 Swift 在 iOS WKWebview 中捕获 Javascript 事件

我使用以下代码创建了一个 Cocoa 应用程序，以确保该方法有效

//
//  ViewController.swift
//  WebViewTEst
//
//  Created by Tarun Lalwani on 4/8/18.
//  Copyright © 2018 Tarun Lalwani. All rights reserved.
//

import Cocoa
import WebKit

class ViewController: NSViewController {

    @IBOutlet weak var webView: WKWebView!

    override func viewDidLoad() {
        super.viewDidLoad()


        let url = "https://microsoft.github.io/monaco-editor/"

        let prefs = self.webView.configuration.preferences
        prefs.javaScriptEnabled = true
        prefs.plugInsEnabled = true
        self.webView.customUserAgent = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"
        self.webView.configuration.preferences.setValue(true, forKey: "developerExtrasEnabled")
        self.webView.load(URLRequest(url: URL(string: url)!))


        // Do any additional setup after loading the view.
    }

    override var representedObject: Any? {
        didSet {
        // Update the view, if already loaded.
        }
    }


}

然后通过运行禁用摩纳哥默认上下文菜单editor.updateOptions({contextmenu: false})，之后编辑器上显示的上下文菜单是本机的。现在这是您现在需要从本机代码自定义的内容