From 79cf87be8633fdb57c54029e78b3a50538506a35 Mon Sep 17 00:00:00 2001 From: Gheorghe Pinzaru Date: Wed, 8 Jul 2020 17:28:54 +0300 Subject: [PATCH] Ens view list items Remove extra fn's Long press animation cancel Make select primary ens accessible Add accessibility to controls components Update e2e tests Signed-off-by: Gheorghe Pinzaru --- src/quo/animated.cljs | 14 ++--- src/quo/components/animated/pressable.cljs | 6 +- src/quo/components/controls/view.cljs | 12 +++- src/status_im/ui/screens/ens/views.cljs | 68 ++++++++++++---------- test/appium/views/dapps_view.py | 8 +-- test/appium/views/wallet_view.py | 2 +- 6 files changed, 58 insertions(+), 52 deletions(-) diff --git a/src/quo/animated.cljs b/src/quo/animated.cljs index 31a3f83df6..910b84a703 100644 --- a/src/quo/animated.cljs +++ b/src/quo/animated.cljs @@ -103,13 +103,13 @@ else-node)))) (defn block [opts] - (.block ^js animated (clj->js opts))) + (.block ^js animated (to-array opts))) (defn interpolate [anim-value config] (.interpolate ^js animated anim-value (clj->js config))) (defn call* [args callback] - (.call ^js animated (clj->js args) callback)) + (.call ^js animated (to-array args) callback)) (defn timing [clock-value opts config] (.timing ^js animated @@ -126,6 +126,7 @@ ;; utilities (def clamp (oget redash "clamp")) +(def diff-clamp (.-diffClamp ^js redash)) (defn with-spring [config] (ocall redash "withSpring" (clj->js config))) @@ -136,9 +137,6 @@ (defn with-offset [config] (.withOffset ^js redash (clj->js config))) -(defn diff-clamp [node min max] - (.diffClamp ^js redash node min max)) - (defn with-spring-transition [val config] (.withSpringTransition ^js redash val (clj->js config))) @@ -165,11 +163,9 @@ {:onHandlerStateChange gesture-event :onGestureEvent gesture-event})) -(defn mix [anim-value a b] - (.mix ^js redash anim-value a b)) +(def mix (.-mix ^js redash)) -(defn mix-color [anim-value a b] - (.mixColor ^js redash anim-value a b)) +(def mix-color (.-mixColor ^js redash)) (defn loop* [opts] (ocall redash "loop" (clj->js opts))) diff --git a/src/quo/components/animated/pressable.cljs b/src/quo/components/animated/pressable.cljs index 25756e0d22..e1dea47b28 100644 --- a/src/quo/components/animated/pressable.cljs +++ b/src/quo/components/animated/pressable.cljs @@ -86,12 +86,12 @@ handle-press (fn [] (when on-press (on-press))) long-gesture-handler (react/callback (fn [^js evt] - (let [state (-> evt .-nativeEvent .-state)] + (let [gesture-state (-> evt .-nativeEvent .-state)] (when (and on-press-start - (= state (:began gesture-handler/states))) + (= gesture-state (:began gesture-handler/states))) (on-press-start)) (when (and on-long-press - (= state (:active gesture-handler/states))) + (= gesture-state (:active gesture-handler/states))) (on-long-press) (animated/set-value state (:undetermined gesture-handler/states))))) [on-long-press on-press-start])] diff --git a/src/quo/components/controls/view.cljs b/src/quo/components/controls/view.cljs index c1c8c90e5e..f7d8378c13 100644 --- a/src/quo/components/controls/view.cljs +++ b/src/quo/components/controls/view.cljs @@ -54,15 +54,21 @@ :hold hold}]]])))) (defn switch-view [{:keys [transition hold]}] - [animated/view {:style (styles/switch-style transition)} + [animated/view {:style (styles/switch-style transition) + :accessibility-label :switch + :accessibility-role :switch} [animated/view {:style (styles/switch-bullet-style transition hold)}]]) (defn radio-view [{:keys [transition hold]}] - [animated/view {:style (styles/radio-style transition)} + [animated/view {:style (styles/radio-style transition) + :accessibility-label :radio + :accessibility-role :radio} [animated/view {:style (styles/radio-bullet-style transition hold)}]]) (defn checkbox-view [{:keys [transition hold]}] - [animated/view {:style (styles/checkbox-style transition)} + [animated/view {:style (styles/checkbox-style transition) + :accessibility-label :checkbox + :accessibility-role :checkbox} [animated/view {:style (styles/check-icon-style transition hold)} [icons/tiny-icon :tiny-icons/tiny-check {:color colors/white}]]]) diff --git a/src/status_im/ui/screens/ens/views.cljs b/src/status_im/ui/screens/ens/views.cljs index fbf13263bf..832c278cf4 100644 --- a/src/status_im/ui/screens/ens/views.cljs +++ b/src/status_im/ui/screens/ens/views.cljs @@ -13,7 +13,6 @@ [status-im.ui.components.colors :as colors] [status-im.ui.components.common.common :as components.common] [status-im.ui.components.icons.vector-icons :as vector-icons] - [status-im.ui.components.radio :as radio] [status-im.ui.components.react :as react] [status-im.ui.components.topbar :as topbar] [status-im.ui.screens.chat.utils :as chat.utils] @@ -580,12 +579,13 @@ (let [stateofus-username (stateofus/username name) s (or stateofus-username name)] [quo/list-item - {:title s - :subtitle (if subtitle - subtitle - (when stateofus-username stateofus/domain)) - :on-press action - :icon :main-icons/username}])) + (merge {:title s + :subtitle (if subtitle + subtitle + (when stateofus-username stateofus/domain)) + :icon :main-icons/username} + (when action + {:on-press action}))])) (defn- name-list [names preferred-name] [react/view {:style {:flex 1 :margin-top 16}} @@ -596,29 +596,34 @@ [{:style {:color colors/black :text-align :center}} (str "\n@" preferred-name)]]] [react/view {:style {:flex 1 :margin-top 8}} - [react/scroll-view {:style {:flex 1}} - [react/view {:style {:flex 1}} - (for [name names] - (let [action #(do (re-frame/dispatch [::ens/save-preferred-name name]) - (re-frame/dispatch [:bottom-sheet/hide]))] - ^{:key name} - [react/touchable-highlight {:on-press action} - [react/view {:style {:flex 1 :flex-direction :row :align-items :center :justify-content :center :margin-right 16}} - [react/view {:style {:flex 1}} - [name-item {:name name :hide-chevron? true :action action}]] - [radio/radio (= name preferred-name)]]]))]]]]) + (for [name names] + (let [action #(do (re-frame/dispatch [::ens/save-preferred-name name]) + (re-frame/dispatch [:bottom-sheet/hide])) + stateofus-username (stateofus/username name) + s (or stateofus-username name)] + ^{:key name} + [quo/list-item + {:accessibility-label (if (= name preferred-name) + :primary-username + :not-primary-username) + :title s + :subtitle (when stateofus-username stateofus/domain) + :icon :main-icons/username + :on-press action + :accessory :radio + :active (= name preferred-name)}]))]]) (views/defview in-progress-registrations [registrations] [react/view {:style {:margin-top 8}} (for [[hash {:keys [state username]}] registrations - :when (or (= state :submitted) (= state :failure))] + :when (or (= state :submitted) (= state :failure))] ^{:key hash} - [name-item {:name username - :action (when-not (= state :submitted) - #(re-frame/dispatch [:clear-ens-registration hash])) + [name-item {:name username + :action (when-not (= state :submitted) + #(re-frame/dispatch [:clear-ens-registration hash])) :subtitle (case state :submitted (i18n/label :t/ens-registration-in-progress) - :failure (i18n/label :t/ens-registration-failure) + :failure (i18n/label :t/ens-registration-failure) nil)}])]) (views/defview my-name [] @@ -644,8 +649,9 @@ [react/view {:style {:margin-top 8}} (for [name names] ^{:key name} - [name-item {:name name :action #(re-frame/dispatch [::ens/navigate-to-name name])}])] - [react/text {:style {:color colors/gray :font-size 15 + [name-item {:name name + :action #(re-frame/dispatch [::ens/navigate-to-name name])}])] + [react/text {:style {:color colors/gray :font-size 15 :margin-horizontal 16}} (i18n/label :t/ens-no-usernames)])] [react/view {:style {:padding-vertical 22 :border-color colors/gray-lighter :border-top-width 1}} @@ -658,13 +664,11 @@ :value preferred-name :action-fn #(re-frame/dispatch [:bottom-sheet/show-sheet {:content - (fn [] (name-list names preferred-name)) - :content-height - (+ 72 (* (min 4 (count names)) 64))}])}]])] - (let [message {:content {:parsed-text - [{:type "paragraph" - :children [{:literal (i18n/label :t/ens-test-message)}]}]} - :content-type constants/content-type-text + (fn [] (name-list names preferred-name))}])}]])] + (let [message {:content {:parsed-text + [{:type "paragraph" + :children [{:literal (i18n/label :t/ens-test-message)}]}]} + :content-type constants/content-type-text :timestamp-str "9:41 AM"}] [react/view [react/view {:padding-left 72} diff --git a/test/appium/views/dapps_view.py b/test/appium/views/dapps_view.py index 308f4c8814..f712d906f3 100644 --- a/test/appium/views/dapps_view.py +++ b/test/appium/views/dapps_view.py @@ -73,10 +73,9 @@ class SelectAccountRadioButton(BaseButton): self.locator = self.Locator.xpath_selector("//*[@text='%s']/../../android.view.ViewGroup/android.view.ViewGroup[2]" % account_name) class SetPrimaryUsername(BaseButton): - def __init__(self, driver, ens_name): + def __init__(self, driver): super(SetPrimaryUsername, self).__init__(driver) - self.locator = self.Locator.xpath_selector( - "(//android.widget.ScrollView//*[@text='%s'])[2]/../../../android.view.ViewGroup[2]" % ens_name) + self.locator = self.Locator.accessibility_id('not-primary-username') class AlwaysAllowRadioButton(BaseButton): @@ -144,4 +143,5 @@ class DappsView(BaseView): return SelectAccountRadioButton(self.driver, account_name) def set_primary_ens_username(self, ens_name): - return SetPrimaryUsername(self.driver, ens_name) + self.driver.info("Set {} as primary ENS name".format(ens_name)) + return SetPrimaryUsername(self.driver) diff --git a/test/appium/views/wallet_view.py b/test/appium/views/wallet_view.py index 6ea7ae1e1a..b71fa4c9ea 100644 --- a/test/appium/views/wallet_view.py +++ b/test/appium/views/wallet_view.py @@ -50,7 +50,7 @@ class AssetText(BaseText): class AssetFullNameInAssets(BaseText): def __init__(self, driver): super(AssetFullNameInAssets, self).__init__(driver) - self.locator = self.Locator.xpath_selector('//*[@content-desc="checkbox"]/../android.widget.TextView[1]') + self.locator = self.Locator.xpath_selector('//*[@content-desc="checkbox"]/../../android.widget.TextView[1]') class AssetSymbolInAssets(BaseText):