This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2021-02-06
Channels
- # announcements (1)
- # babashka (117)
- # bangalore-clj (4)
- # beginners (52)
- # calva (3)
- # cider (1)
- # circleci (1)
- # cljsrn (1)
- # clojure (5)
- # clojure-italy (1)
- # clojurescript (5)
- # conjure (23)
- # datahike (32)
- # datomic (12)
- # fulcro (5)
- # graalvm (6)
- # jobs (1)
- # joker (2)
- # kaocha (1)
- # livestream (1)
- # malli (5)
- # meander (4)
- # off-topic (14)
- # pathom (6)
- # re-frame (7)
- # releases (3)
- # reveal (15)
- # sci (1)
- # shadow-cljs (22)
- # spacemacs (7)
Thank you guys for your answers. I am still learning and trying to understandthe better way to write tests. What should I do in the case I want to test a login page for instance? For example. I have a login component containing email, password and a login button. So far I am able to test If the components are present, the click on the login without values and when I want to change the input, set some specific value and call the onchange event it simply does not work. So I have found this library in order to simulate clicks and events in JS, however, it i a nightmare to add it to a clojure script project. What do you normally do to write tests like that? I will just paste the test here to see if someone could guide me to the right direction,
["@testing-library/react" :as tlr]
[reagent.core :as r]
(defn with-mounted-component [comp f]
(let [mounted-component (tlr/render (r/as-element comp))]
(try
(f mounted-component)
(finally
(.unmount mounted-component)
(r/flush)))))
(defn change-event [input, value]
(.change tlr/fireEvent input value )
(r/flush)
)
(deftest test-login-component
(testing "Check login page fields, try to login with and without values"
(with-mounted-component
[l/login-component]
(fn [component]
(is
(= "email"
(-> component
(.getByPlaceholderText "Your e-mail")
(.-type)
) ))
(is
(= "password"
(-> component
(.getByPlaceholderText "Your password")
(.-type))))
(is
(= "submit"
(-> component
(.getByText "Login")
(.-type))))
(click-element
(.getByText component "Login"))
(is
(= "email is required"
(-> component
(.getByText "email is required")
(.-innerHTML))))
There is the part which I have no idea how to test, because it does not work:
(let [cp (.getByRole component "email") ]
(set! (.-value cp ) "" )
(change-event cp "{target: {value: { 'aaa'}}") ;; => change event is not triggered, it works if I do the same using pure react
(click-element (.getByText cp "Login")) )
Yes, I have tried with different values as well click works fine and onchange does not, But I am trying to find simpler ways of doing it
that's a page and a half with lots of newlines and lots of commented out code. i don't think many will read through it. probably better to clean it up and create a snippet. this allows it to be collapsible and have syntax highlighting
It is because there is a logic behind it and I wanted to show that. I will try to simplify, thanks