Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
End to End Testing: How to test frontend?
Search
imprashast
May 10, 2019
Programming
1
83
End to End Testing: How to test frontend?
imprashast
May 10, 2019
Tweet
Share
Other Decks in Programming
See All in Programming
Devinで実践する!AIエージェントと協働する開発組織の作り方
masahiro_nishimi
6
3k
Prism.parseで 300本以上あるエンドポイントに 接続できる権限の一覧表を作ってみた
hatsu38
1
110
Blueskyのプラグインを作ってみた
hakkadaikon
1
510
漸進。
ssssota
0
1.8k
単体テストの始め方/作り方
toms74209200
0
430
コードに語らせよう――自己ドキュメント化が内包する楽しさについて / Let the Code Speak
nrslib
6
1.4k
CSC307 Lecture 17
javiergs
PRO
0
110
機械学習って何? 5分で解説頑張ってみる
kuroneko2828
0
200
「兵法」から見る質とスピード
ickx
0
260
実はすごいスピードで進化しているCSS
hayato_yokoyama
0
110
UPDATEがシステムを複雑にする? イミュータブルデータモデルのすすめ
shimomura
1
530
The Evolution of Enterprise Java with Jakarta EE 11 and Beyond
ivargrimstad
1
610
Featured
See All Featured
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.6k
Designing Experiences People Love
moore
142
24k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
47
2.8k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Measuring & Analyzing Core Web Vitals
bluesmoon
7
480
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.8k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
106
19k
Navigating Team Friction
lara
186
15k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
137
34k
Transcript
End to End Testing: How to test frontend? Prashast Mehra
(Finn Travel)
None
Motivation? • Why should you even test the frontend? •
Whats the worse that could happen? • I have unit tested my js code and api’s. So I don’t need this, right?
None
None
Benefits • A simple integration test will make sure that
you never break existing features while making new stuff. • You won’t be scared to update npm dependencies. • You will have more confidence in your production app. • Developer experience will be quite smooth. Etc…
None
Cypress The web has evolved. Finally, testing has too.
Fast, easy and reliable testing for anything that runs in a browser.
None
What have we achieved? • Full confidence over our frontend*
• UI is consistent 99% of the time* • Upgrade design system changes with confidence*
Complexities • Whitelabel • In-app browser • IE
None
None
None
None
• Visual Regression Testing • API Testing • Javascript Testing
• Test Runner • Build Artifacts What this talk is all about
Visual Regression Testing
Upgrading Troika?
Screenshot Diff: After upgrading troika Before After Diff
None
None
None
None
Testing API’s
None
Testing Javascript
None
None
None
None
Test Runner
None
None
Build Artifacts
None
None
What exactly went wrong in this build:
None
– Anonymous (or maybe me) “If you don’t like testing
your product, most likely your customers won’t like to test it either.”
Thank you