Prevent default right-clicking event

[njbirth]

I wondered if it is possible to prevent the default action when clicking the right mouse button. When I compile in debug mode, I get the default context menu (with "Inspect element" and other stuff), and in release mode I get a popup saying that I tried to open the context menu. I want to execute a custom action on right-clicking and already found out that I can do this, for example, by using the oncontextmenu event. However, the aforementioned default actions always get in the way. I experimented a bit with prevent_default and cancel_bubble on several events, but so far I have not been successful.

[jkelleyrtp]

I wondered if it is possible to prevent the default action when clicking the right mouse button. When I compile in debug mode, I get the default context menu (with "Inspect element" and other stuff), and in release mode I get a popup saying that I tried to open the context menu. I want to execute a custom action on right-clicking and already found out that I can do this, for example, by using the oncontextmenu event. However, the aforementioned default actions always get in the way. I experimented a bit with prevent_default and cancel_bubble on several events, but so far I have not been successful.

I think Dioxus desktop should provide a custom handler or listener for this so it's easier to implement a real right-click menu.

Anyways, you can manually override the code that interrupts the context menu with the cfg builder attached to the Dioxus launch_cfg function.

From there, you can inject your own scripts with the <script> tag that hooks everything up. An "eval" method is coming in #318 so script elements won't be necessary.

For reference, this is the code that runs when disable_context_menu is false:

                if cfg.disable_context_menu {
                    // in release mode, we don't want to show the dev tool or reload menus
                    webview = webview.with_initialization_script(
                        r#"
                        if (document.addEventListener) {
                        document.addEventListener('contextmenu', function(e) {
                            alert("You've tried to open context menu");
                            e.preventDefault();
                        }, false);
                        } else {
                        document.attachEvent('oncontextmenu', function() {
                            alert("You've tried to open context menu");
                            window.event.returnValue = false;
                        });
                        }
                    "#,
                    )
                } else {
                    // in debug, we are okay with the reload menu showing and dev tool
                    webview = webview.with_dev_tool(true);
                }

[njbirth]

Thanks for the quick reply. But as far as I can see, the cfg builder only allows me to set the disable_context_menu variable of the DesktopConfig. What happens in either case seems to be hardcoded into the launch_cfg function, which means if I want neither the dev tools nor the "You've tried to open context menu" alert I have to fork Dioxus and change the source code of launch_cfg. Or am I missing anything?

(I just started using Dioxus yesterday. So it's perfectly possible that I'm in fact missing something.)

[njbirth]

I forked the repository and removed the alert(...) lines in launch_cfg and now it does exactly what I want (namely nothing). This way I can use the oncontextmenu event to show some custom context menu.