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
76
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
140
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
技術を根付かせる / How to make technology take root
kubode
1
250
第3回関東Kaggler会_AtCoderはKaggleの役に立つ
chettub
3
1k
Rubyで始める関数型ドメインモデリング
shogo_tksk
0
110
Writing documentation can be fun with plugin system
okuramasafumi
0
120
Amazon S3 TablesとAmazon S3 Metadataを触ってみた / 20250201-jawsug-tochigi-s3tables-s3metadata
kasacchiful
0
170
Djangoアプリケーション 運用のリアル 〜問題発生から可視化、最適化への道〜 #pyconshizu
kashewnuts
1
250
バックエンドのためのアプリ内課金入門 (サブスク編)
qnighy
8
1.8k
責務と認知負荷を整える! 抽象レベルを意識した関心の分離
yahiru
4
620
社内フレームワークとその依存性解決 / in-house framework and its dependency management
vvakame
1
560
sappoRo.R #12 初心者セッション
kosugitti
0
260
GAEログのコスト削減
mot_techtalk
0
120
昭和の職場からアジャイルの世界へ
kumagoro95
1
380

Featured

See All Featured
Become a Pro
speakerdeck
PRO
26
5.1k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
100
18k
Rails Girls Zürich Keynote
gr2m
94
13k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.3k
What's in a price? How to price your products and services
michaelherold
244
12k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.2k
For a Future-Friendly Web
brad_frost
176
9.5k
Testing 201, or: Great Expectations
jmmastey
42
7.2k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
30
4.6k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Why Our Code Smells
bkeepers
PRO
336
57k

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