25. Choose your poison
Renders in virtual DOM Renders in a real browser
Faster (~30sec) Slower (~100sec)
No virtual display req. Needs virtual display
Snapshot support No snapshot support
27. Testing Redux
Abstraction.
Connects props to store
via selectors
Abstraction.
Connects props to actions
(potentially thunks)
Abstraction.
Checks auth in store, uses
router
Problem
28. Testing Redux
Our abstraction for testing
connected components
Middleware
Fake props w. spies
Actual mounting of
component w. middleware,
props, and store
Solution
29. Testing Redux
Mount component w.
specific "store" values
Ensure deeply nested
component is rendered
Check prop value
Mini redux store
Solution
30. Testing Redux
Passes in mocked store
A sprinkle of Formsy
Creates wrappers for
enzyme methods and
injects the above
concoction
Some localisation "magic"
A bit more router "magic",
for good measure
Solution
33. Acceptance tests
* Actual browser launched
* Can test entire workflows
* Naturally slow
* Flakey tests; data inconsistency
* Currently non-maintained
* Very important to have
40. Later instalments
* Testing connected components vs. reducers & actions
independently
* Working w. spies, mocks, stubs (Sinon, Jest)
* Working w. Faker for generating random data
* Making snapshots of connected components
TBD
* Faking timers and promises w. Sinon & Jest
41. Further reading
Testing in Spacestation
https://github.com/WeConnect/spacestation-v2/blob/master/TESTING.md
Getting started with Jest
https://facebook.github.io/jest/docs/en/getting-started.html
Puppeteer
https://github.com/GoogleChrome/puppeteer
Cypress
https://github.com/cypress-io/cypress
Unit testing redux connected components
https://hackernoon.com/unit-testing-redux-connected-components-692fa3c4441c
Sinon (mocks, stubs, spies)
https://github.com/sinonjs/sinon
Enzyme
http://airbnb.io/enzyme/
