How to use Unit/e2e/shallow/snapshot in React Apps

2. React Testing
by Andrei Fidelman
@fidelman

3. Maslow’s hierarchy of needs
React testing

4. Cosmetic tests
errors do not violate the basic idea of code

5. Cosmetic tests Coding Style

6. Cosmetic tests Coding Style
ESLint
http://eslint.org/

7. Cosmetic tests Static Typization

8. Cosmetic tests Static Typization

9. Cosmetic tests Static Typization
Flow
http://flow.org/

10. Unit tests
test small piece of code

11. Unit tests Jest + Reducer = ❤️

12. Unit tests Jest + Reducer = ❤️

13. Unit tests Jest + Reducer = ❤️

14. Shallow and Snapshot test
test React components

15. Shallow and Snapshot tests Shallow Test

16. Shallow and Snapshot tests Snapshot Test

17. e2e
from the beginning to the end

18. e2e Chromedriver + Cabbie = 🤘

19. Resources
Chrome Driver
https://sites.google.com/a/chromium.org/chromedriver/
Cabbie
https://cabbiejs.org/
Enzyme
http://airbnb.io/enzyme/
React Shallow
https://facebook.github.io/react/docs/shallow-renderer.html
React Jest
http://facebook.github.io/jest/docs/tutorial-react.html
React Flow
https://flow.org/en/docs/frameworks/react/
React Cookbook egghead
https://egghead.io/lessons/react-testing-classname-with-shallow-rendering
Facebook Test exercises
https://github.com/ForbesLindesay/bulletproof-react-workshop/

20. “Tests are stories we tell the
next generation of programmers
on a project.”
– Roy Osherove

21. Q&A
React Testing
by Andrei Fidelman
@fidelman