From b43d33a6de36d0af38933c6dae8bdd635294effd Mon Sep 17 00:00:00 2001
From: hikaru-y <hkrysg@gmail.com>
Date: Wed, 26 Apr 2023 21:48:06 +0900
Subject: [PATCH] Prevent MathJax editor from closing unexpectedly when
 selecting text

---
 ts/components/WithFloating.svelte             | 32 ++++++++++++++++++-
 .../mathjax-overlay/MathjaxOverlay.svelte     |  1 +
 2 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/ts/components/WithFloating.svelte b/ts/components/WithFloating.svelte
index 50773fb83..af66404aa 100644
--- a/ts/components/WithFloating.svelte
+++ b/ts/components/WithFloating.svelte
@@ -70,6 +70,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 
     export let closeOnInsideClick = false;
     export let keepOnKeyup = false;
+    export let keepOnTextSelection = false;
     export let hideArrow = false;
 
     export let reference: ReferenceElement | undefined = undefined;
@@ -165,6 +166,29 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 
     $: updateFloating(reference, floating, show);
 
+    /**
+     * Prevents the floating element from closing when the cursor is outside
+     * of it at the end of text selection. `stopPropagation()` has to be called
+     * in the capturing phase.
+     */
+    function preventClosingOnTextSelection(event: MouseEvent) {
+        if (event.button === 0) {
+            const floating = event.currentTarget as HTMLDivElement;
+            document.addEventListener(
+                "click",
+                (secondaryEvent: MouseEvent) => {
+                    if (
+                        secondaryEvent.target instanceof HTMLElement &&
+                        !floating.contains(secondaryEvent.target)
+                    ) {
+                        secondaryEvent.stopPropagation();
+                    }
+                },
+                { capture: true, once: true },
+            );
+        }
+    }
+
     onDestroy(() => cleanup?.());
 </script>
 
@@ -182,7 +206,13 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     {/if}
 {/if}
 
-<div bind:this={floating} class="floating" class:show use:portal={portalTarget}>
+<div
+    bind:this={floating}
+    class="floating"
+    class:show
+    on:mousedown={keepOnTextSelection ? preventClosingOnTextSelection : null}
+    use:portal={portalTarget}
+>
     {#if show}
         <slot name="floating" />
     {/if}
diff --git a/ts/editor/mathjax-overlay/MathjaxOverlay.svelte b/ts/editor/mathjax-overlay/MathjaxOverlay.svelte
index 04c72af5d..cb75b1a10 100644
--- a/ts/editor/mathjax-overlay/MathjaxOverlay.svelte
+++ b/ts/editor/mathjax-overlay/MathjaxOverlay.svelte
@@ -210,6 +210,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
                 reference={activeImage}
                 offset={20}
                 keepOnKeyup
+                keepOnTextSelection
                 portalTarget={document.body}
                 let:position={positionFloating}
                 on:close={resetHandle}