fixed right-drag marquee on webBox on Mac

3 files changed, 26 insertions, 26 deletions

diff --git a/src/client/views/ContextMenu.tsx b/src/client/views/ContextMenu.tsx
index 78564a11b..80ff16cf9 100644
--- a/src/client/views/ContextMenu.tsx
+++ b/src/client/views/ContextMenu.tsx
@@ -26,8 +26,7 @@ export class ContextMenu extends React.Component {
     @observable private _mouseX: number = -1;
     @observable private _mouseY: number = -1;
     @observable private _shouldDisplay: boolean = false;
-    @observable private _mouseDown: boolean = false;
-
+    private _ignoreUp = false;
     private _reactionDisposer?: IReactionDisposer;
 
     constructor(props: Readonly<{}>) {
@@ -36,17 +35,23 @@ export class ContextMenu extends React.Component {
         ContextMenu.Instance = this;
     }
 
+    public setIgnoreEvents(ignore: boolean) {
+        this._ignoreUp = ignore;
+    }
+
     @action
     onPointerDown = (e: PointerEvent) => {
-        this._mouseDown = true;
         this._mouseX = e.clientX;
         this._mouseY = e.clientY;
     }
     @action
     onPointerUp = (e: PointerEvent) => {
-        this._mouseDown = false;
         const curX = e.clientX;
         const curY = e.clientY;
+        if (this._ignoreUp) {
+            this._ignoreUp = false;
+            return;
+        }
         if (Math.abs(this._mouseX - curX) > 1 || Math.abs(this._mouseY - curY) > 1) {
             this._shouldDisplay = false;
         }
@@ -62,7 +67,7 @@ export class ContextMenu extends React.Component {
     componentWillUnmount() {
         document.removeEventListener("pointerdown", this.onPointerDown);
         document.removeEventListener("pointerup", this.onPointerUp);
-        this._reactionDisposer && this._reactionDisposer();
+        this._reactionDisposer?.();
     }
 
     @action
@@ -70,10 +75,6 @@ export class ContextMenu extends React.Component {
         document.addEventListener("pointerdown", this.onPointerDown);
         document.addEventListener("pointerup", this.onPointerUp);
 
-        this._reactionDisposer = reaction(
-            () => this._shouldDisplay,
-            () => this._shouldDisplay && !this._mouseDown && runInAction(() => this._display = true)
-        );
     }
 
     @action
@@ -156,6 +157,7 @@ export class ContextMenu extends React.Component {
         this._searchString = initSearch;
         this._shouldDisplay = true;
         this._onDisplay = onDisplay;
+        this._display = !onDisplay;
     }
 
     @action
diff --git a/src/client/views/MarqueeAnnotator.tsx b/src/client/views/MarqueeAnnotator.tsx
index 26e76090a..563261dec 100644
--- a/src/client/views/MarqueeAnnotator.tsx
+++ b/src/client/views/MarqueeAnnotator.tsx
@@ -31,7 +31,7 @@ export interface MarqueeAnnotatorProps {
     annotationLayer: HTMLDivElement;
     addDocument: (doc: Doc) => boolean;
     getPageFromScroll?: (top: number) => number;
-    finishMarquee: (x?: number, y?: number) => void;
+    finishMarquee: (x?: number, y?: number, PointerEvent?: PointerEvent) => void;
     anchorMenuClick?: () => undefined | ((anchor: Doc) => void);
 }
 @observer
@@ -222,10 +222,10 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
             if (AnchorMenu.Instance.Highlighting) {// when highlighter has been toggled when menu is pinned, we auto-highlight immediately on mouse up
                 this.highlight("rgba(245, 230, 95, 0.75)", false);  // yellowish highlight color for highlighted text (should match AnchorMenu's highlight color)
             }
-            this.props.finishMarquee();
+            this.props.finishMarquee(undefined, undefined, e);
         } else {
             runInAction(() => this._width = this._height = 0);
-            this.props.finishMarquee(cliX, cliY);
+            this.props.finishMarquee(cliX, cliY, e);
         }
     }
 
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index acccccfb4..9dafaadcb 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -247,20 +247,10 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
         }
 
         // bcz: hack - iframe grabs all events which messes up how we handle contextMenus.  So this super naively simulates the event stack to get the specific menu items and the doc view menu items.
-        if (e.button === 2) {
+        if (e.button === 2 || (e.button === 0 && e.ctrlKey)) {
             e.preventDefault();
             e.stopPropagation();
-            const where = this.props.ScreenToLocalTransform().inverse().transformPoint(e.pageX, e.pageY);
-            if (ContextMenu.Instance.getItems().length) {
-                ContextMenu.Instance.displayMenu(where[0], where[1]);
-            }
-            else {
-                ContextMenu.Instance.closeMenu();
-                this.specificContextMenu(e);
-                this.props.docViewPath().lastElement().docView?.onContextMenu(undefined, where[0], where[1]);
-            }
-        } else {
-            ContextMenu.Instance.closeMenu();
+            ContextMenu.Instance.setIgnoreEvents(true);
         }
     }
 
@@ -457,11 +447,19 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
             }), returnFalse, () => MarqueeAnnotator.clearAnnotations(this._savedAnnotations), false);
         }
     }
-    @action finishMarquee = (x?: number, y?: number) => {
+    @action finishMarquee = (x?: number, y?: number, e?: PointerEvent) => {
         this._marqueeing = undefined;
         this._isAnnotating = false;
         this._iframeClick = undefined;
-        x !== undefined && y !== undefined && this._setPreviewCursor?.(x, y, false, false);
+        if (x !== undefined && y !== undefined) {
+            this._setPreviewCursor?.(x, y, false, false);
+            ContextMenu.Instance.closeMenu();
+            ContextMenu.Instance.setIgnoreEvents(false);
+            if (e?.button === 2 || e?.ctrlKey) {
+                this.specificContextMenu(undefined as any);
+                this.props.docViewPath().lastElement().docView?.onContextMenu(undefined, x, y);
+            }
+        }
     }
 
     @computed get urlContent() {