Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Painless UI Testing With Jest

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Yoan Pratama Putra Yoan Pratama Putra
April 19, 2017
Programming
160
0

Painless UI Testing With Jest

This is slides from my talk at F8 Meetup Malang on 19 April 2017

Avatar for Yoan Pratama Putra

Yoan Pratama Putra

April 19, 2017

More Decks by Yoan Pratama Putra

See All by Yoan Pratama Putra
Testing React Using Jest
Avatar for Yoan Pratama Putra oshimayoan
1
130

Other Decks in Programming

See All in Programming
The ROI of Quarkus for Spring Boot Applications
Avatar for Holly Cummins hollycummins
0
110
CSC307 Lecture 17
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
320
DynamoDBには集計系のクエリがないけどなんとかしたい
Avatar for 村上優稀 musan
1
130
ADKを使って簡単にAIエージェントを作ってみよう
Avatar for K1mu21 k1mu21
0
250
AutonomyとControlのあいだ：Graflowで記述するAIエージェント協調
Avatar for Makoto Yui myui
0
120
Observability in Practice：Grafana 與 Edge Device SRE 的那些事
Avatar for Blueswen blueswen
0
160
LLM Plugin for Node-REDの利用方法と開発について
Avatar for 404background 404background
0
170
さぁV100、メモリをお食べ・・・
Avatar for nilpe nilpe
0
140
ローカルLLMでどこまでコードが書けるか -拡張版 /　How much code can be written on a local LLM Extended
Avatar for Naoki Kishida kishida
2
950
Oxcを導入して開発体験が向上した話
Avatar for Yuji Yamaguchi yug1224
4
310
IBM Bobを活用したレガシーアプリの最新化
Avatar for Akira Onishi (IBM) oniak3ibm
PRO
1
190
3Dシーンの圧縮
Avatar for Fadis fadis
1
710

Featured

See All Featured
Agile Leadership in an Agile Organization
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
160
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
17k
Thoughts on Productivity
Avatar for Jon Yablonski jonyablonski
76
5.2k
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
Avatar for Szymon Słowik szymonslowik
1
1.1k
Ten Tips & Tricks for a 🌱 transition
Avatar for Manu Carrasco Molina stuffmc
0
130
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.9k
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
46
2.9k
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
31
10k
How to audit for AI Accessibility on your Front & Back End
Avatar for davetheseo davetheseo
0
420
Sam Torres - BigQuery for SEOs
Avatar for Tech SEO Connect techseoconnect
PRO
0
280
More Than Pixels: Becoming A User Experience Designer
Avatar for Michelle Schulp Hunt marktimemedia
3
440
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.7k

Transcript

  1. PAINLESS UI TESTING WITH JEST YOAN PRATAMA PUTRA

  2. TESTING TESTING TESTING TESTING TESTING TESTING TESTING TESTING TESTING

  3. WHY TESTING?

  4. PAINLESS UI TESTING WITH JEST - KODEFOX ▸ To find

    bugs ▸ To find defects ▸ To ensure what we create does not break ▸ To ensure what we create does what it is supposed to do

  5. HOW TO DO TESTING?

  6. None

  7. PAINLESS UI TESTING WITH JEST - KODEFOX ▸ Fast ▸

    Easy Setup ▸ Instant Feedback ▸ Snapshot Testing ▸ From Facebook

  8. PAINLESS UI TESTING WITH JEST - KODEFOX ▸ Watch mode

    ▸ Mock modules and functions ▸ Mock react native components ▸ Mock react native platform OS FEATURES
  9. None
  10. None

  11. WHAT ABOUT UI COMPONENTS?

  12. SNAPSHOT TESTING

  13. None

  14. expect(component).toMatchSnapshot() get the output of the function save it into

    a .snap file has saved snapshot? compare snapshots

  15. SNAPSHOT TESTING PASS FAIL CHANGED BUG

  16. None
  17. None
  18. None
  19. None
  20. None
  21. None
  22. None

  23. WHAT WILL HAPPEN?

  24. None
  25. None

  26. SNAPSHOT TESTING PASS FAIL CHANGED BUG

  27. WHAT WILL HAPPEN?

  28. None

  29. SNAPSHOT TESTING PASS FAIL CHANGED BUG

  30. PAINLESS UI TESTING WITH JEST - KODEFOX BENEFITS OF SNAPSHOT

    TESTING ▸ Automated process ▸ Adapt to changes ▸ Easy to maintain

  31. Thank you! @oshimayoan oshimayoan/testing-react-demo