From 43725a4abe08fdc796d0299760c4b36efeb92955 Mon Sep 17 00:00:00 2001 From: Pablo Alba Date: Mon, 16 Feb 2026 10:49:51 +0100 Subject: [PATCH] :bug: Fix unable to finish the create account form using keyboard (#8273) * :bug: Fix unable to finish the create account form using keyboard * :paperclip: Prefer dom/click over dom/click! --------- Co-authored-by: Andrey Antukh --- CHANGES.md | 1 + .../src/app/main/ui/components/dropdown_menu.cljs | 2 +- frontend/src/app/main/ui/components/forms.cljs | 13 +++++++++++-- .../src/app/main/ui/dashboard/project_menu.cljs | 2 +- frontend/src/app/main/ui/dashboard/sidebar.cljs | 6 +++--- frontend/src/app/util/dom.cljs | 8 +------- 6 files changed, 18 insertions(+), 14 deletions(-) diff --git a/CHANGES.md b/CHANGES.md index e15dd094f7..259a2b68c6 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -36,6 +36,7 @@ - Fix boolean operators in menu for boards [Taiga #13174](https://tree.taiga.io/project/penpot/issue/13174) - Fix viewer can update library [Taiga #13186](https://tree.taiga.io/project/penpot/issue/13186) - Fix remove fill affects different element than selected [Taiga #13128](https://tree.taiga.io/project/penpot/issue/13128) +- Fix unable to finish the create account form using keyboard [Taiga #11333](https://tree.taiga.io/project/penpot/issue/11333) ## 2.13.2 diff --git a/frontend/src/app/main/ui/components/dropdown_menu.cljs b/frontend/src/app/main/ui/components/dropdown_menu.cljs index 3ccf804f6b..ecefac1db5 100644 --- a/frontend/src/app/main/ui/components/dropdown_menu.cljs +++ b/frontend/src/app/main/ui/components/dropdown_menu.cljs @@ -78,7 +78,7 @@ (kbd/enter? event) (let [selected (dom/get-active)] (dom/prevent-default event) - (dom/click! selected)) + (dom/click selected)) (kbd/tab? event) (on-close)))))] diff --git a/frontend/src/app/main/ui/components/forms.cljs b/frontend/src/app/main/ui/components/forms.cljs index a4428e2aa5..e2bb4cd5cf 100644 --- a/frontend/src/app/main/ui/components/forms.cljs +++ b/frontend/src/app/main/ui/components/forms.cljs @@ -32,6 +32,7 @@ input-name (get props :name) more-classes (get props :class) auto-focus? (get props :auto-focus? false) + input-ref (mf/use-ref nil) data-testid (d/nilv data-testid input-name) @@ -82,7 +83,6 @@ (swap! form assoc-in [:touched input-name] true) (fm/on-input-change form input-name value trim) (on-change-value name value))) - on-blur (fn [_] (reset! focus? false)) @@ -92,9 +92,18 @@ (when-not (get-in @form [:touched input-name]) (swap! form assoc-in [:touched input-name] true))) + on-key-press + (mf/use-fn + (mf/deps input-ref) + (fn [e] + (dom/prevent-default e) + (when (kbd/space? e) + (dom/click (mf/ref-val input-ref))))) + props (-> props (dissoc :help-icon :form :trim :children :show-success? :auto-focus? :label) (assoc :id (name input-name) + :ref input-ref :value value :auto-focus auto-focus? :on-click (when (or is-radio? is-checkbox?) on-click) @@ -131,7 +140,7 @@ :for (name input-name)} label (when is-checkbox? - [:span {:class (stl/css-case :global/checked checked?)} (when checked? deprecated-icon/status-tick)]) + [:span {:class (stl/css-case :global/checked checked?) :tab-index "0" :on-key-press on-key-press} (when checked? deprecated-icon/status-tick)]) (if is-checkbox? [:> :input props] diff --git a/frontend/src/app/main/ui/dashboard/project_menu.cljs b/frontend/src/app/main/ui/dashboard/project_menu.cljs index 4c2d34b7e7..ceda649822 100644 --- a/frontend/src/app/main/ui/dashboard/project_menu.cljs +++ b/frontend/src/app/main/ui/dashboard/project_menu.cljs @@ -77,7 +77,7 @@ (mf/use-ref nil) on-import-files - (fn [] (dom/click! (mf/ref-val file-input))) + (fn [] (dom/click (mf/ref-val file-input))) on-finish-import (mf/use-fn diff --git a/frontend/src/app/main/ui/dashboard/sidebar.cljs b/frontend/src/app/main/ui/dashboard/sidebar.cljs index 0ca0a3514d..3f5300e7ef 100644 --- a/frontend/src/app/main/ui/dashboard/sidebar.cljs +++ b/frontend/src/app/main/ui/dashboard/sidebar.cljs @@ -530,7 +530,7 @@ (dom/prevent-default event) (dom/stop-propagation event) (some-> (dom/get-current-target event) - (dom/click!))))) + (dom/click))))) close-teams-menu (mf/use-fn #(reset! show-teams-menu* false))] @@ -601,7 +601,7 @@ (dom/prevent-default event) (dom/stop-propagation event) (some-> (dom/get-current-target event) - (dom/click!))))) + (dom/click))))) close-team-options-menu (mf/use-fn #(reset! show-team-options-menu* false)) @@ -621,7 +621,7 @@ (dom/stop-propagation event) (some-> (dom/get-current-target event) - (dom/click!))))) + (dom/click))))) close-teams-menu (mf/use-fn #(reset! show-teams-menu* false))] diff --git a/frontend/src/app/util/dom.cljs b/frontend/src/app/util/dom.cljs index 5638b7bd94..a5e35afb92 100644 --- a/frontend/src/app/util/dom.cljs +++ b/frontend/src/app/util/dom.cljs @@ -230,12 +230,6 @@ (def get-target-scroll (comp get-scroll-position get-target)) -(defn click - "Click a node" - [^js node] - (when (some? node) - (.click node))) - (defn get-files "Extract the files from dom node." [^js node] @@ -476,7 +470,7 @@ (when (some? node) (.focus node))) -(defn click! +(defn click [^js node] (when (some? node) (.click node)))