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
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
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
9
Introduction to Remix
silvenon
0
140
Studying Strapi: an open source head headless CMS
silvenon
0
48
CSS Specificity
silvenon
0
46
Make your JavaScript projects more accessible to newcomers
silvenon
0
78
React Hooks
silvenon
0
84
PostCSS
silvenon
0
45
CSS Custom Properties
silvenon
0
40
Maintainable Integration Testing in React
silvenon
0
48
Other Decks in Programming
See All in Programming
Patterns of Patterns
denyspoltorak
0
1.4k
humanlayerのブログから学ぶ、良いCLAUDE.mdの書き方
tsukamoto1783
0
190
16年目のピクシブ百科事典を支える最新の技術基盤 / The Modern Tech Stack Powering Pixiv Encyclopedia in its 16th Year
ahuglajbclajep
5
1k
React 19でつくる「気持ちいいUI」- 楽観的UIのすすめ
himorishige
11
7.4k
AI巻き込み型コードレビューのススメ
nealle
1
160
Rust 製のコードエディタ “Zed” を使ってみた
nearme_tech
PRO
0
160
Amazon Bedrockを活用したRAGの品質管理パイプライン構築
tosuri13
4
390
IFSによる形状設計/デモシーンの魅力 @ 慶應大学SFC
gam0022
1
300
AIによるイベントストーミング図からのコード生成 / AI-powered code generation from Event Storming diagrams
nrslib
2
1.9k
Fragmented Architectures
denyspoltorak
0
150
AI によるインシデント初動調査の自動化を行う AI インシデントコマンダーを作った話
azukiazusa1
1
720
そのAIレビュー、レビューしてますか? / Are you reviewing those AI reviews?
rkaga
6
4.5k
Featured
See All Featured
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.4k
Building Flexible Design Systems
yeseniaperezcruz
330
40k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
249
1.3M
Visual Storytelling: How to be a Superhuman Communicator
reverentgeek
2
430
Designing Experiences People Love
moore
144
24k
The Curious Case for Waylosing
cassininazir
0
230
The Pragmatic Product Professional
lauravandoore
37
7.1k
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
180
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
240
Raft: Consensus for Rubyists
vanstee
141
7.3k
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.4k
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 🥳