[Bug]: Can't prevent default on "blank:contextmenu" event

[phamngocduy98]

What happened?

I want to add context menu event on paper but I don't want to see the default browser context menu.
I tried like this but it's not working:

_paper.on("blank:contextmenu", (_evt, x, y) => {
      _evt.preventDefault();
 });

In the jointjs source code (/src/dia/Paper.mjs), the original event seems to be overwriten and there is no option to prevent default this event.

 if (isContextMenu) {
            this.contextMenuFired = true;
            const contextmenuEvt = $.Event(evt.originalEvent, { type: 'contextmenu', data: evt.data });
            this.contextMenuTrigger(contextmenuEvt);
}

Version

3.7.5

What browsers are you seeing the problem on?

Chrome

What operating system are you seeing the problem on?

Windows

[kumilingus]

The browser context menu is disabled by default. To enable it, you must set paper.options.preventContextMenu = false.

Do you have this option set to true?

[phamngocduy98]

Thanks for your response.
I found the problem is because I wrapped the paper inside a div and it's triggering the browser context menu.
Browser context menu of this div can be prevented by adding onContextMenu like bellow:

<div
  id={props.htmlPaperId}
  ref={paperElRef}
  style={{ display: "inline-block" }}
  onContextMenu={(e) => {
    e.preventDefault();  // <============= add this
  }}
/>

I am using reactjs.

const _graph = new dia.Graph({...});
const _paper = new dia.Paper({...});
paperElRef.current?.appendChild(_paper.el);

Hope anyone can resolve the problem by my method.