Merge pull request #8919 from penpot/alotor-fix-change-font-grow-text

🐛 Fix problem when changing font and grow text

frontend/src/app/main/data/workspace/texts.cljs

@@ -400,7 +400,11 @@
             shape-ids (cond (cfh/text-shape? shape)  [id]
                             (cfh/group-shape? shape) (cfh/get-children-ids objects id))]
 
-        (rx/of (dwsh/update-shapes shape-ids update-fn))))))
+        (rx/concat
+         (rx/of (dwsh/update-shapes shape-ids update-fn))
+         (if (features/active-feature? state "render-wasm/v1")
+           (dwwt/resize-wasm-text-debounce id)
+           (rx/empty)))))))
 
 (defn update-root-attrs
   [{:keys [id attrs]}]
@@ -786,11 +790,18 @@
              (rx/of (update-position-data id position-data))))
           (rx/empty))))))
 
+(defn font-loaded-event?
+  [font-id]
+  (fn [event]
+    (and
+     (= :font-loaded (ptk/type event))
+     (= (:font-id (deref event)) font-id))))
+
 (defn update-attrs
   [id attrs]
   (ptk/reify ::update-attrs
     ptk/WatchEvent
-    (watch [_ state _]
+    (watch [_ state stream]
       (let [text-editor-instance (:workspace-editor state)]
         (if (and (features/active-feature? state "text-editor/v2")
                  (some? text-editor-instance))
@@ -828,9 +839,13 @@
                                   (:shape-id result) (:content result)
                                   :update-name? true))))))))
               ;; Resize (with delay for font-id changes)
-              (cond->> (rx/of (dwwt/resize-wasm-text id))
-                (contains? attrs :font-id)
-                (rx/delay 200))))))))
+              (if (contains? attrs :font-id)
+                (->> stream
+                     (rx/filter (font-loaded-event? (:font-id attrs)))
+                     (rx/take 1)
+                     (rx/observe-on :async)
+                     (rx/map #(dwwt/resize-wasm-text id)))
+                (rx/of (dwwt/resize-wasm-text id)))))))))
 
     ptk/EffectEvent
     (effect [_ state _]

frontend/src/app/main/data/workspace/wasm_text.cljs

@@ -23,6 +23,8 @@
    [beicon.v2.core :as rx]
    [potok.v2.core :as ptk]))
 
+(def debounce-resize-text-time 40)
+
 (defn get-wasm-text-new-size
   "Computes the new {width, height} for a text shape from WASM text layout.
   For :fixed grow-type, updates WASM content and returns current dimensions (no resize)."
@@ -144,7 +146,7 @@
               (rx/merge
                (->> stream
                     (rx/filter (ptk/type? ::resize-wasm-text-debounce-inner))
-                    (rx/debounce 40)
+                    (rx/debounce debounce-resize-text-time)
                     (rx/take 1)
                     (rx/map (fn [evt]
                               (resize-wasm-text-debounce-commit

frontend/src/app/plugins/text.cljs

@@ -15,6 +15,8 @@
    [app.common.types.text :as txt]
    [app.main.data.workspace.shapes :as dwsh]
    [app.main.data.workspace.texts :as dwt]
+   [app.main.data.workspace.wasm-text :as dwwt]
+   [app.main.features :as features]
    [app.main.fonts :as fonts]
    [app.main.store :as st]
    [app.plugins.format :as format]
@@ -417,8 +419,10 @@
             (st/emit! (dwt/update-editor-state shape editor)))
 
           :else
-          (st/emit! (dwsh/update-shapes [id]
-                                        #(update % :content txt/change-text value))))))}
+          (do
+            (st/emit! (dwsh/update-shapes [id] #(update % :content txt/change-text value)))
+            (when (features/active-feature? @st/state "render-wasm/v1")
+              (st/emit! (dwwt/resize-wasm-text-debounce id)))))))}
 
    {:name "growType"
     :get #(-> % u/proxy->shape :grow-type d/name)
@@ -434,7 +438,10 @@
           (u/not-valid plugin-id :growType "Plugin doesn't have 'content:write' permission")
 
           :else
-          (st/emit! (dwsh/update-shapes [id] #(assoc % :grow-type value))))))}
+          (st/emit!
+           (dwsh/update-shapes [id] #(assoc % :grow-type value))
+           (when (features/active-feature? @st/state "render-wasm/v1")
+             (st/emit! (dwwt/resize-wasm-text-debounce id)))))))}
 
    {:name "fontId"
     :get #(-> % u/proxy->shape text-props :font-id format/format-mixed)

frontend/src/app/render_wasm/api.cljs

@@ -1120,11 +1120,13 @@
     (if (or (seq pending-thumbnails) (seq pending-full))
       (->> (rx/concat
             (->> (rx/from (vals pending-thumbnails))
-                 (rx/merge-map (fn [callback] (callback)))
-                 (rx/reduce conj []))
+                 (rx/merge-map (fn [callback] (if (fn? callback) (callback) (rx/empty))))
+                 (rx/reduce conj [])
+                 (rx/catch #(rx/empty)))
             (->> (rx/from (vals pending-full))
-                 (rx/mapcat (fn [callback] (callback)))
-                 (rx/reduce conj [])))
+                 (rx/mapcat (fn [callback] (if (fn? callback) (callback) (rx/empty))))
+                 (rx/reduce conj [])
+                 (rx/catch #(rx/empty))))
            (rx/subs!
             (fn [_]
               ;; Fonts are now loaded — recompute text layouts so Skia
@@ -1134,7 +1136,7 @@
                   (update-text-layouts text-ids)))
               (request-render "images-loaded"))
             noop-fn
-            (fn [] (when on-complete (on-complete)))))
+            (fn [] (when (fn? on-complete) (on-complete)))))
       ;; No pending images — complete immediately.
       (when on-complete (on-complete)))))
 

frontend/src/app/render_wasm/api/fonts.cljs

@@ -21,7 +21,8 @@
    [cuerdas.core :as str]
    [goog.object :as gobj]
    [lambdaisland.uri :as u]
-   [okulary.core :as l]))
+   [okulary.core :as l]
+   [potok.v2.core :as ptk]))
 
 (def ^:private fonts
   (l/derived :fonts st/state))
@@ -127,6 +128,7 @@
         mem  (js/Uint8Array. (.-buffer heap) ptr size)]
 
     (.set mem (js/Uint8Array. font-array-buffer))
+    (st/emit! (ptk/data-event :font-loaded {:font-id (:font-id font-data)}))
     (h/call wasm/internal-module "_store_font"
             (aget font-id-buffer 0)
             (aget font-id-buffer 1)
@@ -208,7 +210,8 @@
           id-buffer (uuid/get-u32 (:wasm-id font-data))
           font-data (assoc font-data :family-id-buffer id-buffer)
           font-stored? (font-stored? font-data emoji?)]
-      (when-not font-stored?
+      (if font-stored?
+        (st/async-emit! (ptk/data-event :font-loaded {:font-id (:font-id font-data)}))
         (fetch-font font-data uri emoji? fallback?)))))
 
 (defn serialize-font-style