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
The state of end-to-end testing for modern web ...
Search
vladikoff
September 30, 2023
Programming
0
69
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
22
dotJS 2019 - Into WebAssembly
vladikoff
0
21
3D + the Web Platform
vladikoff
0
390
7 years of three.js
vladikoff
0
140
node.js @ GA 2015
vladikoff
0
450
JS Testing Stack - Full Stack Toronto 2014
vladikoff
1
810
Node.JS Intro - General Assembly
vladikoff
3
480
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
フロントエンドテストの育て方
quramy
8
1.9k
本当だってば!俺もTRICK 2022に入賞してたんだってば!
jinroq
0
180
令和トラベルにおけるコンテンツ生成AIアプリケーション開発の実践
ippo012
1
250
snacks.nvim内のセットアップ不要なプラグインを紹介 / introduce_snacks_nvim
uhooi
0
300
Go1.24で testing.B.Loopが爆誕
kuro_kurorrr
0
140
読もう! Android build ドキュメント
andpad
1
190
安全に倒し切るリリースをするために:15年来レガシーシステムのフルリプレイス挑戦記
sakuraikotone
5
2.1k
データベースエンジニアの仕事を楽にする。PgAssistantの紹介
nnaka2992
6
3.3k
20250326_生成AIによる_レビュー承認システムの実現.pdf
takahiromatsui
15
4.3k
Windows版PHPのビルド手順とPHP 8.4における変更点
matsuo_atsushi
0
360
複数ドメインに散らばってしまった画像…! 運用中のPHPアプリに後からCDNを導入する…!
suguruooki
0
400
小さく段階的リリースすることで深夜メンテを回避する
mkmk884
2
110
Featured
See All Featured
How STYLIGHT went responsive
nonsquared
99
5.4k
GraphQLとの向き合い方2022年版
quramy
45
14k
The Pragmatic Product Professional
lauravandoore
33
6.5k
Side Projects
sachag
452
42k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.3k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.7k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
30
2.3k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
28
2k
Six Lessons from altMBA
skipperchong
27
3.7k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
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