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

Painless UI Testing with Jest

Avatar for Andi N. Dirgantara Andi N. Dirgantara
April 19, 2017
Programming
1
140

Painless UI Testing with Jest

This slides was presented on f8meetupmalang2017.splashthat.com by Yoan Pratama Putra from KodeFox.

Avatar for Andi N. Dirgantara

Andi N. Dirgantara

April 19, 2017
Tweet

More Decks by Andi N. Dirgantara

See All by Andi N. Dirgantara
Building Scalable and Flexible API by Leveraging GraphQL and BigTable
Avatar for Andi N. Dirgantara hellowin
0
88
How Traveloka Handle Data Pipeline for Big Things?
Avatar for Andi N. Dirgantara hellowin
4
630
Data Lake Implementation in Traveloka
Avatar for Andi N. Dirgantara hellowin
2
340
How Big Data Platform Handle Big Things
Avatar for Andi N. Dirgantara hellowin
1
160
How Big Data Works in Sale Stock
Avatar for Andi N. Dirgantara hellowin
4
510
Interactive Animations with React Native
Avatar for Andi N. Dirgantara hellowin
0
180
Loopback Framework for Developing REST API with Node.js
Avatar for Andi N. Dirgantara hellowin
1
170
Facebook Developer Circle: Malang - Initial Meet Up
Avatar for Andi N. Dirgantara hellowin
0
120

Other Decks in Programming

See All in Programming
安いハードウェアでVulkan
Avatar for Fadis fadis
0
550
Angular-Apps smarter machen mit Gen AI: Lokal und offlinefähig - Hands-on Workshop!
Avatar for Christian Liebel christianliebel
PRO
0
120
AI 開発合宿を通して得た学び
Avatar for ニフティ株式会社 niftycorp
PRO
0
150
[SF Ruby Feb'26] The Silicon Heel
Avatar for Vladimir Dementyev palkan
0
120
GC言語のWasm化とComponent Modelサポートの実践と課題 - Scalaの場合
Avatar for Rikito Taniguchi tanishiking
0
120
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
780
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
700
AI活用のコスパを最大化する方法
Avatar for Ochtum ochtum
0
230
API Platformを活用したPHPによる本格的なWeb API開発 / api-platform-book-intro
Avatar for Takashi Kanemoto ttskch
1
150
Understanding Apache Lucene - More than just full-text search
Avatar for Alexander Reelsen spinscale
0
130
CSC307 Lecture 15
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
260
それはエンジニアリングの糧である：AI開発のためにAIのOSSを開発する現場より / It serves as fuel for engineering: insights from the field of developing open-source AI for AI development.
Avatar for nrs nrslib
0
310

Featured

See All Featured
Code Reviewing Like a Champion
Avatar for maltzj maltzj
528
40k
Sam Torres - BigQuery for SEOs
Avatar for Tech SEO Connect techseoconnect
PRO
0
220
How to build a perfect <img>
Avatar for Jono Alderson jonoalderson
1
5.3k
How to audit for AI Accessibility on your Front & Back End
Avatar for davetheseo davetheseo
0
220
The Mindset for Success: Future Career Progression
Avatar for Greg Gifford greggifford
PRO
0
280
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
Avatar for Ines Montani inesmontani
PRO
3
3.1k
Leading Effective Engineering Teams in the AI Era
Avatar for Addy Osmani addyosmani
9
1.7k
Taking LLMs out of the black box: A practical guide to human-in-the-loop distillation
Avatar for Ines Montani inesmontani
PRO
3
2.1k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
57
6.8k
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
191
11k
Designing for Timeless Needs
Avatar for Cassini Nazir cassininazir
0
170
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
32
2.5k

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