Search code examples
macososx-yosemitewkwebview

How can the context menu in WKWebView on the Mac be modified or overridden?


I'm using a WKWebView in a Mac OS X application. I want to override the contextual menu that appears when the user Control + clicks or right clicks in the WKWebView, but I cannot find a way to accomplish this.

It should be noted that the context menu changes depending on the state of the WKWebView and what element is under the mouse when the context menu is invoked. For example, the context menu only has a single "Reload" item when the mouse is over an "empty" part of the content, whereas right clicking a link presents the options "Open Link", "Open Link In New Window", and so on. It would be helpful to have granular control over these different menus if possible.

The older WebUIDelegate provides the - webView:contextMenuItemsForElement:defaultMenuItems: method that allows you to customize the context menu for WebView instances; I'm essentially looking for the analog to this method for WKWebView, or any way to duplicate the functionality.


Solution

  • You can do this by intercepting the contextmenu event in your javascript, reporting the event back to your OSX container through a scriptMessageHandler, then popping up a menu from OSX. You can pass context back through the body field of the script message to show an appropriate menu, or use a different handler for each one.

    Setting up callback handler in Objective C:

    WKUserContentController *contentController = [[WKUserContentController alloc]init];
    [contentController addScriptMessageHandler:self name:@"callbackHandler"];
    config.userContentController = contentController;
    self.mainWebView = [[WKWebView alloc] initWithFrame:self.view.frame configuration:config];
    

    Javascript code using jquery:

    $(nodeId).on("contextmenu", function (evt) {
       window.webkit.messageHandlers.callbackHandler.postMessage({body: "..."});
       evt.preventDefault();
    });
    

    Responding to it from Objective C:

    -(void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message
    {
        if ([message.name isEqualToString:@"callbackHandler"]) {
          [self popupMenu:message.body];
        }
    }
    
    -(void)popupMenu:(NSString *)context {
        NSMenu *theMenu = [[NSMenu alloc] initWithTitle:@"Context Menu"];
        [theMenu insertItemWithTitle:@"Beep" action:@selector(beep:) keyEquivalent:@"" atIndex:0];
        [theMenu insertItemWithTitle:@"Honk" action:@selector(honk:) keyEquivalent:@"" atIndex:1];
        [theMenu popUpMenuPositioningItem:theMenu.itemArray[0] atLocation:NSPointFromCGPoint(CGPointMake(0,0)) inView:self.view];
    }
    
    -(void)beep:(id)val {
        NSLog(@"got beep %@", val);
    }
    
    -(void)honk:(id)val {
        NSLog(@"got honk %@", val);
    }