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

Painless UI Testing with Jest

Andi N. Dirgantara
April 19, 2017
Programming
1
130

Painless UI Testing with Jest

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

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
hellowin
0
75
How Traveloka Handle Data Pipeline for Big Things?
hellowin
4
620
Data Lake Implementation in Traveloka
hellowin
2
310
How Big Data Platform Handle Big Things
hellowin
1
130
How Big Data Works in Sale Stock
hellowin
4
490
Interactive Animations with React Native
hellowin
0
140
Loopback Framework for Developing REST API with Node.js
hellowin
1
140
Facebook Developer Circle: Malang - Initial Meet Up
hellowin
0
110

Other Decks in Programming

See All in Programming
Итераторы в Go 1.23: зачем они нужны, как использовать, и насколько они быстрые?
lamodatech
0
1.4k
QA環境で誰でも自由自在に現在時刻を操って検証できるようにした話
kalibora
1
140
functionalなアプローチで動的要素を排除する
ryopeko
1
210
Beyond ORM
77web
11
1.6k
KMP와 kotlinx.rpc로 서버와 클라이언트 동기화
kwakeuijin
0
300
Amazon Nova Reelの可能性
hideg
0
200
令和7年版 あなたが使ってよいフロントエンド機能とは
mugi_uno
10
5.2k
混沌とした例外処理とエラー監視に秩序をもたらす
morihirok
13
2.3k
[JAWS-UG横浜 #80] うわっ…今年のServerless アップデート、少なすぎ…？
maroon1st
0
100
ASP.NET Core の OpenAPIサポート
h455h1
0
120
PHPとAPI Platformで作る本格的なWeb APIアプリケーション（入門編） / phpcon 2024 Intro to API Platform
ttskch
0
390
『改訂新版 良いコード／悪いコードで学ぶ設計入門』活用方法−爆速でスキルアップする！効果的な学習アプローチ / effective-learning-of-good-code
minodriven
28
4.2k

Featured

See All Featured
Into the Great Unknown - MozCon
thekraken
34
1.6k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
Designing for Performance
lara
604
68k
The Art of Programming - Codeland 2020
erikaheidi
53
13k
How STYLIGHT went responsive
nonsquared
96
5.3k
Agile that works and the tools we love
rasmusluckow
328
21k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
127
18k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
49
2.2k
YesSQL, Process and Tooling at Scale
rocio
170
14k
Producing Creativity
orderedlist
PRO
343
39k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
10
870

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