7a4b12acf4
This commit makes the test-helpers.component namespace loadable in the REPL,
plus other changes that allow for a reasonably enjoyable RDD (REPL-Driven
Development) workflow.
Why? I want to be able to get instant feedback when I render a component with
the RN Testing Library (RNTL), and only once I'm satisfied with my findings is
when I proceed to write/update the tests. This nearly instant feedback loop is
only feasible using the ClojureScript REPL, and I'd rather not endure long
recompilation cycles.
Note that by REPL I mean connecting to the CLJS REPL of the Shadow-CLJS :mobile
target.
Essentially, this is what this commit does:
- [x] Allow the test-helpers.component namespace to be evaluated in the REPL.
This is now possible because I changed all functions that assumed js/jest
existed with a guard clause using the CLJS macro exists?. Without the
guard clauses, evaluating the namespace explodes due to stuff like
js/jest.useFakeTimers that fail in compile time (it's a syntax sugar
macro).
- [x] Change the family of functions to get the translation by text to either
translate using i18n/label or translate with the dummy prefix tx:,
depending if the code is running inside the Jest runtime or not.
- [x] Wrap remaining RNTL query functions, except for the find-* ones, since
they don't work at all outside the Jest runtime.
- [x] All wrapped functions support the original arguments supported by RNTL.
Arguments are always converted with clj->js.
- [x] All wrapped functions can optionally take a node (ReactTestInstance) as
their first argument, otherwise the global screen object will be used.
This is very important! See the explanation on section Doesn't RNTL
recommend using the screen object?
- [x] Update Shadow-CLJS preloads, so that (in development) you can fire off the
REPL and always be ready to call component test helpers. This is critical!
What else would be possible? Just an idea, but now that we can easily render
components using the same machinery provided by RNTL in the tests, we can
roughly implement Storybook's Play function
https://storybook.js.org/docs/react/writing-stories/play-function
Lesson learned: In the REPL, you may need to call
(re-frame.core/clear-subscription-cache!), otherwise you will experience
subscriptions returning the same value if their arguments are the same. For
example, I faced this while playing with the namespace
status-im2.contexts.communities.menus.community-options.component-spec. There
are better ways to solve this particular problem in the context of tests if we
use the tooling provided by day8.re-frame.test.
Doesn't RNTL recommend using the screen object? Indeed, it is recommended to use
the screen object instead of destructuring the results of RNTL render. It's just
easier and less error prone, but this only works reliably within the Jest
runtime, since it automatically cleans up rendered state after each test. When
using the REPL this is no longer the case, and I faced some errors, like Unable
to find node on an unmounted component, where RNTL would refuse to re-render
components, even if I explicitly unmounted them or called cleanup.
The only reliable solution I found was to store the result of render (a node)
and pass it to every subsequent call. This is not a workaround, it's officially
supported, but it's a tad less convenient. You can also not pass the node
reference and it should work most of the time.
Practical examples
Workflow suggestion: write your local experiments in the same namespace as the
component spec and within the comment macro. This way, you can have the Jest
watcher running and a REPL connected to :mobile, and they won't step on each
other. For the test watcher, I usually change quo2-core-spec or
status-im2.core-spec to only require what I'm interested, otherwise Jest
consumes way too many resources.
```clojure
;; Namespace quo2.components.colors.color-picker.component-spec
(h/test "color picker color changed"
(let [selected (reagent/atom nil)]
(h/render [color-picker/view {:on-change #(reset! selected %)}])
(h/fire-event :press (get (h/get-all-by-label-text :color-picker-item) 0))
(-> (h/expect @selected)
(.toStrictEqual :blue))))
(comment
(def selected (atom nil))
(def c (h/render [color-picker/view {:on-change #(reset! selected %)}]))
(h/fire-event :press (get (h/get-all-by-label-text c :color-picker-item) 0))
;; Options are passed down converted to JS types.
(h/debug c {:message "Rendering header"})
@selected ; => :blue
)
```
```clojure
;; Namespace quo2.components.tags.--tests--.status-tags-component-spec
(h/test "renders status tag with pending type"
(render-status-tag {:status {:type :pending}
:label "Pending"
:size :small})
(-> (h/expect (h/get-all-by-label-text :status-tag-pending))
(.toBeTruthy))
(-> (h/expect (h/get-by-text "Pending"))
(.toBeTruthy)))
(comment
(def c (render-status-tag {:status {:type :pending}
:label "Pending"
:size :small}))
(h/get-all-by-label-text c :status-tag-pending))
```
```clojure
;; Namespace status-im2.contexts.communities.menus.community-options.component-spec
(h/test "joined and muted community"
(setup-subs {:communities/my-pending-request-to-join nil
:communities/community {:joined true
:muted true
:token-gated? true}})
(h/render [options/community-options-bottom-sheet {:id "test"}])
(-> (h/expect (h/get-by-translation-text :unmute-community))
(.toBeTruthy)))
(comment
(setup-subs {:communities/my-pending-request-to-join nil
:communities/community {:joined true
:muted true
:token-gated? true}})
(def c (h/render [options/community-options-bottom-sheet {:id "test"}]))
(some? (h/get-by-translation-text c :invite-people-from-contacts)) ; => true
)
```
|
||
|---|---|---|
| .clj-kondo | ||
| .dependabot | ||
| .github | ||
| android | ||
| ci | ||
| doc | ||
| fastlane | ||
| ios | ||
| modules/react-native-status | ||
| nix | ||
| resources | ||
| scripts | ||
| src | ||
| test | ||
| test-resources | ||
| translations | ||
| visual-test | ||
| .buckconfig | ||
| .carve_ignore | ||
| .detoxrc.js | ||
| .dockerignore | ||
| .env | ||
| .env.e2e | ||
| .env.jenkins | ||
| .env.nightly | ||
| .env.release | ||
| .envrc | ||
| .eslintrc.js | ||
| .flowconfig | ||
| .gitattributes | ||
| .gitignore | ||
| .mailmap | ||
| .nycrc | ||
| .prettierrc.js | ||
| .watchmanconfig | ||
| .zprintrc | ||
| LICENSE.md | ||
| Makefile | ||
| README.md | ||
| RELEASES.md | ||
| VERSION | ||
| app.json | ||
| babel.config.js | ||
| binding.gyp | ||
| default.nix | ||
| index.js | ||
| metro.config.js | ||
| package.json | ||
| react-native.config.js | ||
| shadow-cljs.edn | ||
| shell.nix | ||
| status-go-version.json | ||
| supervisord.conf | ||
| yarn.lock | ||
README.md
Status - a Mobile Ethereum Operating System
Join us in creating a browser, messenger, and gateway to a decentralized world. Status is a free (libre) open source mobile client targeting Android & iOS built entirely on Ethereum technologies. That's right, no middle men and go-ethereum running directly on your device.
Why?
We believe in a medium of pure free trade, economies with fair, permission-less access and a world without intermediaries. We want to create policies that can exist between friends or scale globally, we want to communicate securely and be uninhibited by legacy systems.
We want to take responsibility for our data, the way we conduct ourselves privately and promote this way of life to a mass audience.
We want deep insights into our own economies so we can make informed, data-driven decisions on how to make our lives better. The Ethereum blockchain, Smart Contracts, Swarm and Whisper provides us a path forward.
If this interests you, help us make Status a reality - anyone can contribute and we need everyone at any skill level to participate.
How to Contribute?
Go straight to the docs or join our chat and choose what interests you:
-
Developer Developers are the heart of software and to keep Status beating we need all the help we can get! If you're looking to code in ClojureScript or Golang then Status is the project for you! We use React Native and there is even some Java/Objective-C too! Want to learn more about it? Start by reading our Developer Introduction which guides you through the technology stack and start browsing beginner issues. Then you can read how to Build Status, which talks about managing project dependencies, coding guidelines and testing procedures. The doc/ directory also has valuable information for contributors.
-
Community Management Metcalfe's law states that the value of a network is proportional to the square of the number of connected users of the system - without community Status is meaningless. We're looking to create a positive, fun environment to explore new ideas, experiment and grow the Status community. Building a community takes a lot of work but the people you'll meet and long lasting relationships you form will be well worth it, check out our Mission and Community Principles
-
Specification / Documentation John Dewey once said "Education is not preparation for life; education is life itself ". Developers & Designers need guidance and it all starts from documentation and specifications. Our software is only as good as its documentation, head over to our docs and see how you can improve what we have.
-
Blog Writing Content is King, keeping our blog up to date and informing the community of news helps keep everyone on the same page. Jump into our chat and discuss with the team how you can contribute!
-
Testers It's bug hunting season! Status is currently under active development and there is sure to be a bunch of learning, build status from scratch or if an android user check out our nightly builds. You can shake your phone to submit bug reports, or start browsing our Github Issues. Every bug you find brings Status closer to stable, usable software for everyone to enjoy!
-
Security Status is a visual interface to make permanent changes on the Blockchain, it handles crypto-tokens that have real value and allows 3rd party code execution. Security is paramount to its success. You are given permission to break Status as hard as you can, as long as you share your findings with the community!
-
Evangelism Help us spread the word! Tell a friend right now, in fact tell everyone - yell from a mountain if you have to, every person counts! If you've got a great story to tell or have some interesting way you've spread the word about Status let us know about it in our chat
Status API
View our API Docs and learn how to integrate your DApp into Status. You can read more about how to add your DApp to Status here.
Give me Binaries!
You can get our Beta builds for both Android and iOS on our website, through our nightly builds or by building it yourself.
Core Contributors
Special thanks to @adrian-tiberius. Without the dedication of these outstanding individuals, Status would not exist.
Contact us
Feel free to email us at support@status.im or better yet, join our chat.
License
Licensed under the Mozilla Public License v2.0
Testing Supported by
