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
170
0
Share
Cypress vs. Playwright
Matija Marohnić
September 28, 2022
More Decks by Matija Marohnić
See All by Matija Marohnić
oxlint & oxfmt: linting and formatting from the future
silvenon
0
29
Goodbye jsdom/happy-dom, hello Vitest Browser Mode!
silvenon
0
17
Introduction to Remix
silvenon
0
150
Studying Strapi: an open source head headless CMS
silvenon
0
55
CSS Specificity
silvenon
0
62
Make your JavaScript projects more accessible to newcomers
silvenon
0
89
React Hooks
silvenon
0
93
PostCSS
silvenon
0
63
CSS Custom Properties
silvenon
0
52
Other Decks in Programming
See All in Programming
代数的データ型って何が嬉しいの? #frontend_phpcon_do
kajitack
0
110
生成AI時代にこそ効くGo | Why Go Works in the Age of Generative AI
mom0tomo
8
3k
関係性から理解する"同一性"の型用語たち
pvcresin
2
620
tsserverとは何だったのか、これからどうなるのか
nowaki28
1
420
These Five Tricks Can Make Your Apps Greener, Cheaper, & Nicer
hollycummins
0
250
色即是空、空即是色、データサイエンス
kamoneggi
1
210
net-httpのHTTP/2対応について
naruse
0
350
Why Laravel apps break—Mastering the fundamentals to keep them maintainable
kentaroutakeda
1
310
新規プロダクトを高速で生み出すハーネスエンジニアリング
seanchas116
15
7.4k
Inside Stream API
skrb
1
380
AI時代の仕事技芸論 — ソフトウェア開発で「遊ぶように働く」職人的熟達のすすめ
kuranuki
1
520
権限チェックの一貫性を型で守る TypeScript による多層防御
mnch
4
970
Featured
See All Featured
Testing 201, or: Great Expectations
jmmastey
46
8.2k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
Stop Working from a Prison Cell
hatefulcrawdad
274
21k
The Pragmatic Product Professional
lauravandoore
37
7.3k
Context Engineering - Making Every Token Count
addyosmani
9
920
Practical Orchestrator
shlominoach
191
11k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
340
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.4k
The Art of Programming - Codeland 2020
erikaheidi
57
14k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
62k
How STYLIGHT went responsive
nonsquared
100
6.1k
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.3k
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 🥳