diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs index d3c6eb1320..8334acbebb 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs @@ -48,7 +48,12 @@ :selrect :points :show-content - :hide-in-viewer]) + :hide-in-viewer + + ;; Needed to disable/enable width/height + ;; otherwise the memo will not detect changes + :layout-item-h-sizing + :layout-item-v-sizing]) (def ^:private generic-options #{:size :position :rotation}) @@ -130,7 +135,7 @@ acc)))) acc))))) -(defn- check-measures-menu-props +(defn check-measures-menu-props [old-props new-props] (let [o-values (unchecked-get old-props "values") n-values (unchecked-get new-props "values")] @@ -150,10 +155,12 @@ (get n-values :hide-in-viewer)) (identical? (get o-values :width) (get n-values :width)) - (identical? (get o-values :width) - (get n-values :width)) (identical? (get o-values :height) (get n-values :height)) + (identical? (get o-values :layout-item-h-sizing) + (get n-values :layout-item-h-sizing)) + (identical? (get o-values :layout-item-v-sizing) + (get n-values :layout-item-v-sizing)) (identical? (get o-values :points) (get n-values :points)) (identical? (get o-values :selrect) diff --git a/frontend/test/frontend_tests/runner.cljs b/frontend/test/frontend_tests/runner.cljs index cbe7af9ebf..4dc39abc18 100644 --- a/frontend/test/frontend_tests/runner.cljs +++ b/frontend/test/frontend_tests/runner.cljs @@ -45,6 +45,7 @@ [frontend-tests.tokens.token-errors-test] [frontend-tests.tokens.workspace-tokens-remap-test] [frontend-tests.ui.ds-controls-numeric-input-test] + [frontend-tests.ui.measures-menu-props-test] [frontend-tests.util-object-test] [frontend-tests.util-range-tree-test] [frontend-tests.util-simple-math-test] @@ -104,6 +105,7 @@ 'frontend-tests.tokens.token-errors-test 'frontend-tests.tokens.workspace-tokens-remap-test 'frontend-tests.ui.ds-controls-numeric-input-test + 'frontend-tests.ui.measures-menu-props-test 'frontend-tests.render-wasm.process-objects-test 'frontend-tests.util-object-test 'frontend-tests.util-range-tree-test diff --git a/frontend/test/frontend_tests/ui/measures_menu_props_test.cljs b/frontend/test/frontend_tests/ui/measures_menu_props_test.cljs new file mode 100644 index 0000000000..8214572f59 --- /dev/null +++ b/frontend/test/frontend_tests/ui/measures_menu_props_test.cljs @@ -0,0 +1,51 @@ +;; This Source Code Form is subject to the terms of the Mozilla Public +;; License, v. 2.0. If a copy of the MPL was not distributed with this +;; file, You can obtain one at http://mozilla.org/MPL/2.0/. +;; +;; Copyright (c) KALEIDOS INC Sucursal en EspaƱa SL + +(ns frontend-tests.ui.measures-menu-props-test + (:require + [app.main.ui.workspace.sidebar.options.menus.measures :refer [check-measures-menu-props]] + [cljs.test :as t :include-macros true])) + +;; Shared, identical-by-reference props so the comparator only reacts to the +;; `values` differences we are testing. +(def ^:private ids #js ["id-1"]) +(def ^:private shape-type :rect) +(def ^:private tokens #js {}) + +(defn- props + [values] + #js {"ids" ids "type" shape-type "appliedTokens" tokens "values" values}) + +(def ^:private base-values + {:width 100 + :height 200 + :layout-item-h-sizing :fix + :layout-item-v-sizing :fix}) + +(t/deftest test-check-measures-menu-props + (t/testing "skips re-render when nothing relevant changed" + ;; Different map instances with identical scalar content must be treated + ;; as equal (returns true => memoized, no re-render). + (t/is (true? (check-measures-menu-props + (props base-values) + (props (into {} base-values)))))) + + (t/testing "re-renders when horizontal sizing changes but width does not" + ;; Regression test: toggling fix <-> auto without changing the width value + ;; must force a re-render so the width input enabled/disabled state updates. + (t/is (false? (check-measures-menu-props + (props base-values) + (props (assoc base-values :layout-item-h-sizing :auto)))))) + + (t/testing "re-renders when vertical sizing changes but height does not" + (t/is (false? (check-measures-menu-props + (props base-values) + (props (assoc base-values :layout-item-v-sizing :auto)))))) + + (t/testing "re-renders when width changes" + (t/is (false? (check-measures-menu-props + (props base-values) + (props (assoc base-values :width 150)))))))