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
Cypress vs. Playwright
Search
Matija Marohnić
September 28, 2022
Programming
0
160
Cypress vs. Playwright
Matija Marohnić
September 28, 2022
Tweet
Share
More Decks by Matija Marohnić
See All by Matija Marohnić
Goodbye jsdom/happy-dom, hello Vitest Browser Mode!
silvenon
0
7
Introduction to Remix
silvenon
0
140
Studying Strapi: an open source head headless CMS
silvenon
0
41
CSS Specificity
silvenon
0
32
Make your JavaScript projects more accessible to newcomers
silvenon
0
76
React Hooks
silvenon
0
76
PostCSS
silvenon
0
45
CSS Custom Properties
silvenon
0
40
Maintainable Integration Testing in React
silvenon
0
35
Other Decks in Programming
See All in Programming
ノーコードからの脱出 -地獄のデスロード- / Escape from Base44
keisuke69
0
670
Kotlin 2.2が切り拓く: コンテキストパラメータで書く関数型DSLと新しい依存管理のかたち
knih
0
400
AIの弱点、やっぱりプログラミングは人間が(も)勉強しよう / YAPC AI and Programming
kishida
7
3.5k
AI POSにおけるLLM Observability基盤の導入 ― サイバーエージェントDXインターン成果報告
hekuchan
0
470
なんでRustの環境構築してないのにRust製のツールが動くの? / Why Do Rust-Based Tools Run Without a Rust Environment?
ssssota
15
48k
AIを駆使して新しい技術を効率的に理解する方法
nogu66
0
580
仕様がそのままテストになる!Javaで始める振る舞い駆動開発
ohmori_yusuke
4
1.8k
乱雑なコードの整理から学ぶ設計の初歩
masuda220
PRO
18
5.6k
Private APIの呼び出し方
kishikawakatsumi
2
830
Promise.tryで実現する新しいエラーハンドリング New error handling with Promise try
bicstone
2
200
CSC509 Lecture 13
javiergs
PRO
0
240
高単価案件で働くための心構え
nullnull
0
110
Featured
See All Featured
How STYLIGHT went responsive
nonsquared
100
5.9k
GitHub's CSS Performance
jonrohan
1032
470k
A designer walks into a library…
pauljervisheath
210
24k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Building a Scalable Design System with Sketch
lauravandoore
463
33k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
231
22k
It's Worth the Effort
3n
187
28k
How to Think Like a Performance Engineer
csswizardry
28
2.3k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.2k
Unsuck your backbone
ammeep
671
58k
Building Applications with DynamoDB
mza
96
6.7k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
249
1.3M
Transcript
Matija Marohnić Cypress vs. Playwright End-to-end testing showdown https://silvenon.com/blog/e2e-testing-with-cypress-vs-playwright
My experience with Cypress
Background • prior experience with tools like WebdriverIO • used
Cypress for a long time • friendlier API • approachable • but eventually mostly for critical functionality
Speed • 5 tests = 45s (locally) • compared to
my other optimizations it became uncomfortable • started writing less tests 💔
GUI 🤷
GUI
API • familiarity = jQuery 😔 • won’t look familiar
to any new developers
API • should = expect
API • wrap objects to make assertions • another round
of jQuery for everyone! 🍻
API • synchronous…? • commands are queued to be run
later
Meet Playwright 🎭
Background • new testing framework by Microsoft • haven’t used
it in any serious projects yet • only side projects
Supports WebKit • unlike Cypress, Playwright supports Safari • Safari’s
support table can be uncomfortable, so it’s really useful
Headless by default • seemed odd at fi rst •
turned out to be a great feature • less clutter, no dashboards or browsers • run headed only when you need to debug
Speed • 13 tests = 3s ⚡ • more than
2x as many tests = 15x faster • speed is no longer an issue • started testing every square inch of my blog
API • asynchronous, almost everything needs to be awaited
API • at fi rst repetitive and error-prone, mistakes aren’t
always obvious • but gives full control over execution order, more transparent
API • uses Jest’s expect library for assertions, so looks
more like a unit test • doesn’t need a Testing Library plugin, locators are powerful
VS Code extension 🤯 • killer feature • makes Playwright
really e ffi cient to use! • run a test just by clicking on it, and much more • a more balanced approach to GUI — stay in your text editor • 👨💻
…and so much more!
• I’m always excited to learn more about Playwright •
it makes me want to write more tests 🥳