From 92254a175eee021f98d29759d5ca0417a828788b Mon Sep 17 00:00:00 2001
From: Andrey Antukh <niwi@niwi.nz>
Date: Mon, 15 Mar 2021 15:56:38 +0100
Subject: [PATCH] :bug: Handle properly pointer capture on text edition shape.

---
 .../main/ui/workspace/shapes/text/editor.cljs | 26 ++++++++++++++-----
 .../src/app/main/ui/workspace/viewport.cljs   |  7 ++---
 2 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs b/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs
index 35e211c811..9c879aa7e7 100644
--- a/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs
+++ b/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs
@@ -142,16 +142,30 @@
          (fn [event state]
            (st/emit! (dwt/update-editor-state shape (ted/editor-split-block state)))
            "handled"))
+
+        on-pointer-down
+        (mf/use-callback
+         (fn [event]
+           (let [target  (dom/get-target event)
+                 closest (.closest ^js target "foreignObject")]
+             ;; Capture mouse pointer to detect the movements even if cursor
+             ;; leaves the viewport or the browser itself
+             ;; https://developer.mozilla.org/en-US/docs/Web/API/Element/setPointerCapture
+             (when closest
+               (dom/stop-propagation event)
+               (.setPointerCapture closest (.-pointerId event))))))
         ]
 
     (mf/use-layout-effect on-mount)
 
-    [:div.text-editor {:ref self-ref
-                       :style {:cursor cur/text}
-                       :class (dom/classnames
-                               :align-top    (= (:vertical-align content "top") "top")
-                               :align-center (= (:vertical-align content) "center")
-                               :align-bottom (= (:vertical-align content) "bottom"))}
+    [:div.text-editor
+     {:ref self-ref
+      :style {:cursor cur/text}
+      :on-pointer-down on-pointer-down
+      :class (dom/classnames
+              :align-top    (= (:vertical-align content "top") "top")
+              :align-center (= (:vertical-align content) "center")
+              :align-bottom (= (:vertical-align content) "bottom"))}
      [:> draft/Editor
       {:on-change on-change
        :on-blur on-blur
diff --git a/frontend/src/app/main/ui/workspace/viewport.cljs b/frontend/src/app/main/ui/workspace/viewport.cljs
index a9aeca2bed..3a3b4de040 100644
--- a/frontend/src/app/main/ui/workspace/viewport.cljs
+++ b/frontend/src/app/main/ui/workspace/viewport.cljs
@@ -434,14 +434,11 @@
         on-pointer-down
         (mf/use-callback
          (fn [event]
-           (let [target  (dom/get-target event)
-                 closest (.closest target "foreignObject")]
+           (let [target  (dom/get-target event)]
              ;; Capture mouse pointer to detect the movements even if cursor
              ;; leaves the viewport or the browser itself
              ;; https://developer.mozilla.org/en-US/docs/Web/API/Element/setPointerCapture
-             (if closest
-               (.setPointerCapture closest (.-pointerId event))
-               (.setPointerCapture target (.-pointerId event))))))
+             (.setPointerCapture target (.-pointerId event)))))
 
         on-pointer-up
         (mf/use-callback