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
87
1
Share
End to End Testing: How to test frontend?
imprashast
May 10, 2019
Other Decks in Programming
See All in Programming
権限チェックの一貫性を型で守る TypeScript による多層防御
mnch
4
1k
生成AI時代にこそ効くGo | Why Go Works in the Age of Generative AI
mom0tomo
8
3.1k
次世代リンターで探る、tsgo 時代における型認識カスタムルールの現実解
ytakahashii
3
1.4k
Java × distroless で 軽量なコンテナイメージを / Java on Distroless
contour_gara
0
440
Hive Metastoreを通して学ぶIceberg REST Catalog ― 仕様から実装まで
okumin
0
320
代数的データ型って何が嬉しいの? #frontend_phpcon_do
kajitack
7
2.8k
ビジネスモデルから紐解く、AI+型駆動開発
hirokiomote
2
5k
作って学ぶ、 JSX (TSX) ランタイムの基本
syumai
7
1.4k
ふつうのFeature Flag実践入門
irof
7
3.4k
Oxlintのカスタムルールの現況
syumai
5
930
TSKaigi 2026 TypeScriptバックエンドのオブザーバビリティ戦略 — Datadog × NestJSの実践
taiseiyamamotoan
1
210
肥大化するレガシーコードに立ち向かうためのインターフェース分離と依存の逆転 / JJUG CCC 2026 Spring
hirokunimaeta
0
330
Featured
See All Featured
Kristin Tynski - Automating Marketing Tasks With AI
techseoconnect
PRO
0
260
Principles of Awesome APIs and How to Build Them.
keavy
128
17k
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
160
Test your architecture with Archunit
thirion
1
2.3k
Navigating Team Friction
lara
192
16k
Bootstrapping a Software Product
garrettdimon
PRO
307
120k
Statistics for Hackers
jakevdp
799
230k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.2k
Ruling the World: When Life Gets Gamed
codingconduct
0
240
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
2k
The Curious Case for Waylosing
cassininazir
1
370
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
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