$30 off During Our Annual Pro Sale. View Details »
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
The state of end-to-end testing for modern web ...
Search
vladikoff
September 30, 2023
Programming
0
80
The state of end-to-end testing for modern web apps
vladikoff
September 30, 2023
Tweet
Share
More Decks by vladikoff
See All by vladikoff
SmashingConf 2020
vladikoff
0
33
dotJS 2019 - Into WebAssembly
vladikoff
0
24
3D + the Web Platform
vladikoff
0
420
7 years of three.js
vladikoff
0
150
node.js @ GA 2015
vladikoff
0
460
JS Testing Stack - Full Stack Toronto 2014
vladikoff
1
830
Node.JS Intro - General Assembly
vladikoff
3
490
CSS Preprocessor Workflow with Grunt
vladikoff
3
2.7k
3D Voxel Worlds with voxel.js
vladikoff
1
2k
Other Decks in Programming
See All in Programming
Your Architecture as a Crime Scene?Forensic Analysis
manfredsteyer
PRO
0
100
ローターアクトEクラブ アメリカンナイト:川端 柚菜 氏(Japan O.K. ローターアクトEクラブ 会長):2720 Japan O.K. ロータリーEクラブ2025年12月1日卓話
2720japanoke
0
730
ELYZA_Findy AI Engineering Summit登壇資料_AIコーディング時代に「ちゃんと」やること_toB LLMプロダクト開発舞台裏_20251216
elyza
0
160
LLM Çağında Backend Olmak: 10 Milyon Prompt'u Milisaniyede Sorgulamak
selcukusta
0
120
関数実行の裏側では何が起きているのか?
minop1205
1
700
WebRTC、 綺麗に見るか滑らかに見るか
sublimer
1
190
なあ兄弟、 余白の意味を考えてから UI実装してくれ!
ktcryomm
11
11k
Socio-Technical Evolution: Growing an Architecture and Its Organization for Fast Flow
cer
PRO
0
350
堅牢なフロントエンドテスト基盤を構築するために行った取り組み
shogo4131
8
2.4k
これならできる!個人開発のすゝめ
tinykitten
PRO
0
110
組み合わせ爆発にのまれない - 責務分割 x テスト
halhorn
1
150
C-Shared Buildで突破するAI Agent バックテストの壁
po3rin
0
390
Featured
See All Featured
Agile that works and the tools we love
rasmusluckow
331
21k
Side Projects
sachag
455
43k
Optimising Largest Contentful Paint
csswizardry
37
3.5k
Why You Should Never Use an ORM
jnunemaker
PRO
61
9.6k
Fireside Chat
paigeccino
41
3.7k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.3k
How STYLIGHT went responsive
nonsquared
100
6k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
9.8k
Building Applications with DynamoDB
mza
96
6.8k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
48
9.8k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3k
Transcript
State of end-to-end testing for modern web applications VLAD FILIPPOV
About Vlad // software engineer // full stack web developer
// open-source contributor
In this talk … • History of web application testing
• Testing challenges • Learn new automation tools • Demos!
Testing Web Apps
Testing Web Apps
None
2004 → 2014 → 2024
2004 • First versions of Selenium 2006+ • First versions
of Selenium WebDriver • Headless webkit testing via PhantomJS
2014 (from my 2014 presentation)
2024 WebDriverIO Playwright
Goals of these tests • Track down code regressions •
Cross-browser compatibility testing • Cost-effective testing with real user behaviour • Full end-to-end workflow
Goals of these tests • Track down code regressions •
Cross-browser compatibility testing • Cost-effective testing with real user behaviour • Full end-to-end workflow • Confidence in shipping code
Testing Challenges
Writing tests “How do I find the password reset button
for my tests?”
Flaky tests “I’ve looked everywhere for it and gave up!”
Continuous integration challenges “What is wrong with my test?” “I
need to be able to run tests locally and in CI”
Solving these problems… • Flaky tests • Spending time writing
tests • Continuous integration • Debugging • Slow Tests
Automation & Testing Tools
None
WebDriverIO
Playwright - playwright.dev Speed Correctness Multi-environment Language Choice Usability Debugging
Lightweight QA Integration
Playwright solving our testing challenges
None
Reduce flakiness with auto-wait
Screenshots Parallelism
Accessibility testing Browser configuration
None
None
playwright-ai writes tests for you
None
Q&A Thank You! contact: vf.io slides: vf.io/refactor23